Next.js 13 Crash Course Tutorial #3 - Pages & Routes

➡️ Use promo code NEXTNINJA50 for 50% off!

📂🥷🏼 Access the course files on GitHub:

📂🥷🏼 CSS File from course files:

💻🥷🏼 React Tutorial:

[DeshonMorgan-rthz]

MAKE SURE YOU PUT THE FOLDER NAMES IN LOWER CASE! lol this functionality seems to completely fail if you dont name the route-folder in lower case. i spent two days trying to fix this

[blazi_]

What we have right now:

There's two types of rendering in nextjs13

CSR: html will render in user browser

SSR: html will render on server and sent to user device


use SSR for:
Fetching data from db
Talking with backend directly because its rendered on server

Use CSR for:
Interactivity and accessing browser apis also using react states


To create a page you create folder with name of that route like /home will be home folder and inside that folder you create file with name of page.jsx which will hold all your page code

Ask me any question ill do my best to answer your question

[rain-]

Finally the NextJs tutorial that using JSX ❤❤

[Ansidion]

Thanks for the video. Good explanation.

[loloin]

I got a 404. Could you advise why? I double-checked to make sure the folder is under the 'App' folder.

[vehktaur]

It would have been nice if this was with typescript

[NumbBlaze]

How would you structure an SPA (Single Page Application)?

[marianaangel]

please please please teach us how to integrate redux with next

[problem]

As now by default the page.jsx is server component. If I want to create client component <CustomButton/> then where should I create CustomButton.jsx ?
Inside the current directory e.g. tickets or root (app) ?

[WhiteArtsMagic]

Wow... totally hate the nesting of the page name with page.jsx inside of that page... feels messy

[ToadyEN]

Are you releasing your paid course on here? I paid for it last week

[theangelofspace]

Im just sad the serie is on javascript. Nextjs is not a beginner framework and nobody will hire you to build a production nextjs on js. This woukd have been a more complete tutorial to add to my essential dev videos playlist if it was on typescript, never the list I will finish the serie because because of loyalty 😢.

[LucianoClassicalGuitar]

The latest version of react no longer has this app folder I think.

[ademineshat]

The routes are not ideal. For every page crating a new folder, is just to much 😢

[makiss.]

Thank you for this. The guys that make these react frameworks are the worst . Such an ass backwards approach page page page.... why bother even creating unique names for the function?