Beginner's Guide to React, Next.js, and TypeScript

Explore React, an open source front end library for building web interfaces, its reusable components and state management, and see how Next.js, built on React, enables a cohesive web framework.

Keep react state immutable by copying objects with spread syntax and updating from the copy. Use a library to handle immutability behind the scenes, especially for deeply nested state.

Explore the fundamentals of React with components, state, props, events, and hooks, and learn immutable state management with Emma as you build a todo app using TypeScript and Next.js.

Explore NestJS as a React-friendly open-source framework and learn to build with Next.js, install Node.js and VS Code, run npm run dev, and navigate Next.js project structure, routing, and configuration.

Learn how to create dynamic routes by naming folders with square brackets, using params to read segments, and implementing catch-all and optional catch-all routes with three dots.

Build a simple RESTful todo backend with user accounts and JWT authentication, enabling create, read, update, and delete of todos via a two-controller mvc api using entity framework and swagger.

Create a middleware to protect the to do routes in a Next.js app by checking a token cookie, redirecting unauthenticated users to login, and configuring a matcher for multiple paths.

Create a sign up page with a form for first name, last name, and password, posting to the create user endpoint and auto authenticating with a token in a cookie.

Create and view todos by fetching user-specific data with a server action, render with map, authorize via cookie token, and paginate to show five items.

Create and wire a pagination system for todos using a Next.js React app, implementing page number and page size query params, previous and next controls, and a client pagination component.