What I’m Learning In
The Ultimate NEXT.JS 13 Crash Course for Beginners (2023) by Sonny Sangha
After completing a few projects recently including my portfolio website, and a mock food-ordering app called Basiligo, I felt pretty confident to try and build a full-scale web application with all the trimmings.
I designed the web application in Adobe XD, created a logo as well as some other assets in Illustrator, and went onto VS Code Insiders to start developing the web application using Next.js.
I was aware that Next.js 13 was out but made the rookie mistake of thinking that I didn’t have to look deep into it before beginning the build. This led to a host of problems down the line primarily relating to unoptimised code as I was trying to build a Next.js 13 application whilst still having a Next.js 12 mindset. As such I wasn’t using Next.js 13 best practices to optimise things like performance speed and security. Something which can be done by, for example, using Server components when possible; only implementing client components when necessary and if possible abstracting away client component code to minimise how much of the program is handled on the client side. I was also unaware of how to use the reserved file names properly too, to, for example, provide page layout templates with ‘layout.tsx’ to help optimise performance speed by avoiding unnecessary re-renders.
So far this course has done a lot for me in terms of bettering my understanding of the capabilities of Next.js 13. Things I’ve learned so far include:
- Reserved file names like layout.tsx, loading.tsx, page.tsx, not-found.tsx, error.tsx, etc.
- How to implement Next.js 13’s version of SSG and ISR
- The benefits of Next.js 13 components defaulting to being rendered on the server.
- Etc.
The instructor in the video, Sonny Sangha, will also be teaching us about things like Appwrite, Zustand and GraphQL, to further enhance our coding abilities and make us more flexible as developers.
