Max Next – Course Summary


Updated Jul 15th, 2021

Course repo is here. The chapters are on different branches. Genius was my original thought but actually not so much. Can’t see branches without -a flag and checking out and running “npm run dev,” gets fatal error. Note you may need to run “npm init -y” to have the code run to make sure you have the packages.

Course Table of Contents

Section 1.) Getting Started
Section 2.) React Refresher (React Only Meetups Example Project)
Section 3.) Pages and File-based Routing
Section 4.) Project (NextJS Events Project with Dummy Data – Green UI)
Section 5.) Page Pre-Rendering and Data Fetching (Mini CSR project with firebase)
Section 6.) Project Time (Events Project without Dummy Data but with Firebase – Green UI)
Section 7.) Optimizing NextJS Apps
Section 8.) Adding back-end Code with API Routes
Section 9.) Project Time: API Routes (Events Project With Newsletter Registration Flow and Comments)
Section 10.) Working with App-wide State
Section 11.) Complete App Example (Build a Full Blog A to Z)
Section 12.) Deploying Next JS Apps
Section 13.) Adding Authentication
Section 14.) Optional: NextJS Summary
Section 15.) Course End

Projects Summary: Meetups, Events and Blog

A goal for me is to be able to build an application with MongoDB database and Authorization because these two things, along with TypeScript and Next.js, is the top of my mountain for now.

First Pass

Max calls NextJS a full-stack framework because you can access the file system, connect to the database and handle authorization in one project, without leaving the code editor. So it’s full-stack out of the box and you don’t have to build a standalone Rest API.

That said, server-side rendering is key for SEO, although dashboards don’t need SEO or server-side rendering because they’re behind a paywall and no one cares about SEO for a dashboard. You’re going to want your homepage as an SSR page and subsequent is going to be a single page react application that is client-side rendered. You’ve got this blended server-side-rendered single page application which I think is what is referred to as isomorphic.

@next/MDX package: Markdown files (.md) that can contain React components. This is not the package that is used in the course?

There are page components and non-page components. Data-fetching functions only work in page components? Non-page components will have to rely on client side fetching if we want them to fetch data, (useEffect with useState or useReducer)

You can deploy a NodeJS/Express app on Vercel so I don’t know why you need to bother with Heroku for the back-end unless their is an issue with cost. Just use NextJS with built-in API instead of building and hosting a separate backend. May be good to keep building APIs with Express to keep skills sharp.

Side-Note: I went to the academind site because this guy Max is amazing. The site gives you full access to the catalog and future releases for around $20 a month or $200 a year and is likely worth paying for. There’s a discord with 8.3k people that were online?!

Side-Note: Discord site had a pretty cool lava lamp effect on the login landing page.