- Published on
Learning Next.js - App Router Introduction
- Authors

- Name
- Brett Stockmeier
Next.js App Router course outcomes
The goal of this course is to teach Next.js through the building of a full stack web application. In this case, the goal is to create a financial dashboard that includes:
- a home page
- a login page
- pages that can not be accessed by unauthenticated users
- functionality to perform operations on a Postgres database
In the course of this project, it will also be necesarry to set-up the postgres database.
Personal Thoughts
In truth, I do not believe I have prior experience working with postgres databases, so I'm looking forward to the chance to learn that along with Next.js.
I can also forsee the basic components of this application being applicable to my ultimate goal of implementing Thirsty Libraries. The Home page will display recent activity and a summary of the users current level in the season. It will also be necesarry to create a form to insert data (reading records). The ability to update and delete records are less relevant to the goal of the project, but will be worthwhile to learn and practice as well.
More Specific Topics/Skills and Tools Covered
(and my personal thoughts on each)
- Styling: The different ways to style your application in Next.js - Let's be honest, looking good is important for anything being made available to a general public. Doubly so for something that may be aimed at children. Not just looking good, but it has to feel good. UX is important, and this is certainly a part of that
- Optimizations: How to optimize images, links, and fonts. - Always important, and certainly a desireable skill for job hunting
- Routing: How to create nested layouts and pages using file-system routing - Important for UX, but also a valuable skill for creating modular pages that look good and are easy to scale and maintain
- Data Fetching: How to set up a Postgres database on Vercel, and best practices for fetching and streaming - I have firsthand experience for how slow database performance can choke an application, and like I said, I'm very interested to learn a new kind of database
- Search and Pagination: How to implement search and pagination using URL search params - I don't forsee this being super important for my purposes. I'm not very excited about learning it again either. It's important, but boring
- Mutating Data: How to mutate data using React Server Actions, and revalidate the Next.js cache - See above. I'd just rather focus on things that will allow me to advance my work on Thirsty Libraries
- Error Handling: How to handle general and 404 not found errors - I'm always interested in learning more error handling, because I was never really had a formal education in it. Everything I know about error handling I learned "on the job"
- Form Validation and Accessibility: How to do server-side form validation and tips for improving accessibility - in my experience, not super difficult to learn, or very big in content
- Authentication: How to add authentication to your application using NextAuth.js and Middleware - A basic security feature
- Metadata: How to add metadata and prepare your application for social sharing - Necesarry, and a brand new topic for me
Last Things:
(Prerequisite Knowledge, System Requirements, and "Join the Conversation")
Prerequisite Knowledge - aka know React and Javascript. I'm comfortable in my knowledge of both (as I've stated before), but I still intend to devote some time to reviewing both of these topics.
System Requirements - No issues forseen
"Join the Conversation" - Nice to know there is a reddit group that may be able to assist with any questions, and there's a Github community as well? I may have to investigate which is going to be better for asking questions
