Next js/ by Nima shokouhfar

Get Started. It's Free
or sign up with your email address
Next js/ by Nima shokouhfar by Mind Map: Next js/ by Nima shokouhfar

1. Styles

1.1. bad

1.2. good

1.3. not as good

1.4. not as bad

1.5. important

1.6. warning

2. main

2.1. shadcn/ui + thailwind

2.2. Alwyay be carefull with these tags

2.2.1. <a>

2.2.2. <img>

2.2.3. Always search them in project using vs code before pushing them into the production

2.2.4. Best example of this messing up is using shadcn pagination library

2.3. shadcn/ui thailwind nextjs

2.3.1. velite

2.3.2. use mdx

2.3.3. part 2

2.4. nextjs course full

2.4.1. 1

2.4.1.1. summary

2.4.1.1.1. all components in nextjs are by default server component

2.4.1.1.2. routes

2.4.1.1.3. layout

2.4.1.1.4. Metadata

2.4.1.1.5. Navigation

2.4.1.1.6. template files

2.4.1.1.7. loading.tsx

2.4.1.1.8. error

2.4.1.1.9. parallel routes

2.4.1.1.10. intercepting routes

2.4.1.1.11. route handlers

2.4.1.1.12. rendering

2.4.1.1.13. generateStaticParams

2.5. Udemy_Next.js_Dev_to_Deployment Brad traversy

2.5.1. package moment

2.5.1.1. for fixing the date

2.5.2. Next

2.5.2.1. conditional routing

2.5.2.1.1. 2

2.5.2.1.2. 1

2.5.2.2. modal is an issue since this is server side rendering

2.5.3. strapi

2.5.3.1. Cloudinary For Images plugin

2.5.3.2. strapi filtering

2.5.3.3. slugify

2.5.4. react-toastify

2.5.5. gray-matter

2.5.6. front-matter

2.6. brad nextjs 14

2.6.1. introduction

2.6.1.1. type of websites

2.6.1.1.1. oure statuc

2.6.1.1.2. SPA

2.6.1.1.3. ssr

2.6.1.1.4. SSG

2.6.1.2. dev tools

2.6.1.2.1. extension

2.6.1.2.2. vs code extension

2.6.1.2.3. multiple cursor

2.6.2. Next.js Fundamentals & Project Start

2.6.2.1. 1

2.6.2.1.1. rafce

2.6.2.1.2. metadata

2.6.2.2. 4

2.6.2.2.1. server vs client

2.6.2.2.2. getting data from url

2.6.2.2.3. useful icon

2.6.2.2.4. this is important

2.6.2.3. 11

2.6.2.3.1. react spinner

2.7. NextAuth.js

2.7.1. keycloak credential

2.7.2. tut

2.7.3. tut

2.8. vid

2.8.1. API routes like GET are caching by default

2.8.1.1. to Make them dynamic you can use POST. since POST is dynamic by default

2.9. .env / dotenv

2.9.1. when loaded

2.9.1.1. .env.production: Loaded during production builds (next build).

2.9.1.2. .env.development: Loaded during development (next dev).

2.9.1.3. .env.local: This file is loaded for all environments and can be used for local development.

2.9.2. In a Next.js application, environment variables that you want to expose to the browser must start with NEXT_PUBLIC_.

2.10. Skip linting/ Disable linting

2.10.1. /** @type {import('next').NextConfig} */ const nextConfig = { transpilePackages: ["next-mdx-remote"], typescript: { ignoreBuildErrors: true, // This skips type checking }, }; export default nextConfig;

2.11. Terser issue/ docker

2.11.1. solution

2.11.1.1. /** @type {import('next').NextConfig} */ const nextConfig = { swcMinify: false, // Disable SWC minification transpilePackages: ["next-mdx-remote"], typescript: { ignoreBuildErrors: true, // This skips type checking }, }; export default nextConfig;