Module 1: Introduction
- Next.js Introduction
- Installing Next.js
- File Structure Explained
- Pages Explained
- _document.tsx file explained
- _app.tsx file explained
Module 2: Styling
- Style section introduction
- Styled JSX
- Global Styles
- CSS Modules
- Sass Modules
- File Structure
Module 3: Next.js APIs
- API Section Intro
- Creating APIs with Next.js
- req and res objects
- Simple JWT Auth Example
Module 4: Routing
- Simple Routing
- Link component
- Nested Routing
- Dynamic Routing
- useRouter
- Catch All Route
- Custom 404 Page
Module 5: Server Side Rendering
- getStaticProps
- revalidate parameter
- getStaticPaths
- getServerSideProps
Module 6: Redux
- Install Redux, React-Redux, Redux-Thunk, Redux-Logger
- Introduction to Redux , Why use Redux
- Unidirectional Data Flow
- Redux (Action, Reducer, Store) Structure
- Extension and plugin for Redux
- Debug / Log data (State) with Redux-Logger
Module 7: Basic Login Authentication
- Install Axios
- Install Backend with NodeJS / Express / Sequelize (DB ORM)
- Install Backend Libraries for express body-parser cors sequelize
- Create Web API with NodeJS
- Create NodeJS Router ด้วย Express
- Create Sub Router
- Create REST API for test Authentication (Register and Login)
- Learning DB Model (Code First) for SQLITE3 / PostgresSQL
- Use Body-Parser for HTTP Format with URLEncodeed and JSON , Multiple Parts
- Connect ReactJS Login with NodeJS API
Module 8: Integrate Material-UI
- Setup Theme MaterialUI & Bootstrap
- Create Header, Menu and Footer
- Install Bundled Files
- Convert HTML to JSX
- Install Page Navigation with React Router
- Create Responsive Page with Flexbox and Grid system
- Setup next/router with useRouter, withRouter,
- Create Route for regirter, login, stock, create/edit/delete
Module 9: Deployment
- Install Nginx Webserver
- Instll PM2 Node Monitor
- How to build on production
- CORS Problem solve
- Fallback URL Problem solve
Module 10: Tip and Tricks
- Next.js Plugin for work
- Best Practice for Next.js
- Next.js 3rd Library for work