آموزش Next.js - آخرین آپدیت

مبانی Next.js Fundamentos do Next.js

• Next.js چیست O que é o Next.js

• متدهای رندرینگ در Next.js Métodos de Renderização do Next.js

• نصب و راه‌اندازی Instalação

• نصب Tailwind CSS نسخه 3 Instalando o Tailwind CSS na v3

• درک سیستم روتینگ در Next.js Entendendo o Roteamento do Next.js

• تفاوت‌های _app و _document Diferenças entre _app e _document

• کامپوننت‌های Link و Image Componentes Link e Image

• آشنایی با پروژه Conhecendo o projeto

• نصب shadcn ui Instalação shadcn-ui

• کامپوننت: Header Componente: Header

• کامپوننت: Active Link Componente: Active Link

• طراحی Layout Layout

• کامپوننت: Footer Componente: Footer

• طراحی لوگو Criando a Logo

• افزودن Style Guide Adicionando Style Guide

• بخش: Hero Seção: Hero

• بخش: Feature Seção: Feature

• بخش: Support Seção: Support

• بخش: Customer Story Seção: Customer Story

• بخش: Call to action Seção: Call to action

• تنظیم فونت‌ها Ajustando as fontes

• افزودن تصاویر Adicionando imagens

• رفاکتورینگ کدها Refatorações

• افزودن پوشه جدید در tailwind Adicionando a nova pasta no tailwind

• نصب و پیکربندی Instalação e configuração

• ایجاد اولین پست Criando nosso primeiro post

• ساخت صفحه وبلاگ Criando a página de blog

• شروع ساخت کامپوننت Search Iniciando o componente Search

• تکمیل کامپوننت Search Finalizando o Search

• کامپوننت: PostCard Componente: PostCard

• افزودن اطلاعات داینامیک به PostCard Adicionando informações dinâmicas ao PostCard

• کامپوننت: PostGridCard Componete: PostGridCard

• لیست داینامیک پست‌ها Listagem dinâmica de posts

• پیاده‌سازی قابلیت جستجو Criando a funcionalidade de busca

• صفحه: Post Página: Post

• کامپوننت: Avatar Componente: Avatar

• کامپوننت: Markdown Componente: Markdown

• بهبود کامپوننت Avatar Melhorias no componente Avatar

• شروع ساخت کامپوننت اشتراک‌گذاری Iniciando o componente de compartilhamento

• ساخت هوک اشتراک‌گذاری - بخش اول Criando o hook para compatilhamento - Parte 1

• ساخت هوک اشتراک‌گذاری - بخش دوم Criando o hook para compatilhamento - Parte 2

• افزودن قابلیت‌های اشتراک‌گذاری Adicionando funcionalidade ao compatilhar

• بهبودهای Layout Melhorias no layout

• مفاهیم SSR، SSG و ISR SSR, SSG e ISR

• پیاده‌سازی SSG در وبلاگ Aplicando SSG no blog

• پیاده‌سازی SSG در پست‌ها Aplicando SSG no post

• درک React Server Components Entendendo os React Server Components

• مهاجرت لندینگ پیج Migrando a Landing Page

• آشنایی با فایل‌های ویژه و Client Components Entendendo sobre os arquivos especiais e Client Components

• مهاجرت لیست پست‌ها Migrando a Listagem de Posts

• ساخت صفحه 404 سفارشی Criando a Página 404 Customizada

• ساخت فایل loading.tsx Criando o loading.tsx

• ساخت فایل error.tsx Criando o error.tsx

• ساخت صفحه پست Criando a Página de Post

• ساخت کامپوننت PostShare Criando o Component PostShare

• درک SSG و ISR در App Router Entendendo SSG e ISR na App Router

• دیپلوی پروژه Fazendo o Deploy

• SEO چیست O Que é SEO

• بهبود SEO لندینگ پیج Melhorando o SEO da Landing Page

• بهبود SEO صفحه لیست پست‌ها Melhorando SEO na Página de Listagem de Posts

• بهبود SEO صفحه پست Melhorando o SEO da Página do Post

• SEO و Core Web Vitals SEO e Core Web Vitals

پروژه پت شاپ (Pet Shop) Pet Shop

• آشنایی با پروژه Conhecendo o Projeto

• تنظیمات اولیه Next.js Setup Inicial Next.js

• Docker چیست Entendendo o que é o Docker

• درک Docker Compose Entendendo o Docker Compose

• پیکربندی ESLint، Prettier و Lefthook Configurando ESLint, Prettier e Lefthook

• نصب Docker Client Instalando o Docker Client

• نصب و پیکربندی Prisma Instalando e Configurando o Prisma

• شروع طراحی Design System Iniciando Nosso Design System

• شروع ساخت صفحه Home Iniciando a Home

• ادامه ساخت صفحه Home Continuando a Home

• پیاده‌سازی منطق بازه‌های زمانی Criando Lógica para os Períodos

• کامپوننت PeriodSection Componente PeriodSection

• ساخت AppointmentCard Criando o AppointmentCard

• ادامه ساخت Appointment Card Continuando o Appointment Card

• اصلاحات بصری Ajustes Visuais

• Server Actions چیست O Que São Server Actions

• ساخت ساختار Appointment Form Criando a Base do Appointment Form

• طراحی Schema برای Appointment Form Criando o Schema do Appointment Form

• ساخت اولین Inputها Criando os Primeiros Inputs

• ساخت Input تلفن با ماسک Criando o Input de Telefone com Máscara

• ساخت Input تقویم Criando o Input de Calendário

• ساخت Select تاریخ - بخش اول Criando o Select de Data - Parte 01

• ساخت Select تاریخ - بخش دوم Criando o Select de Data - Parte 02

• تکمیل ظاهر Appointment Form Finalizando o Visual do Appointment Form

• ساخت تابع Submit Criando a Função de Submit

• ساخت Server Action Criando a Server Action

• لیست کردن نوبت‌ها Listando os Agendamentos

• استفاده از Revalidate Path Utilizando o Revalidate Path

• ویرایش نوبت Editando um Agendamento

• ساخت Server Action برای ویرایش Criando Server Action para a Edição

• پیاده‌سازی قابلیت حذف نوبت Criando a Funcionalidade de Deleção de um Agendamento

• جستجوی داینامیک Busca dinâmica

• ساخت DatePicker Criando o DatePicker

• بهبود DatePicker Melhorando o DatePicker

• افزودن Calendar Adicionando o Calendar

• ساخت Navigation Button Criando o Navigation Button

• رفاکتورینگ Server Action Refatorando a Server Action

• تنظیمات نهایی Ajustes Finais

• شروع دیپلوی پروژه Iniciando o deploy do projeto

• پایان دیپلوی Finalizando o deploy

احراز هویت و API خارجی در Next.js Autenticação e API externa no Next.js

• راه‌اندازی پروژه Next.js Setup do Projeto Next.js

• راه‌اندازی API Hono با Drizzle و Better Auth Setup da API Hono com Drizzle e Better Auth

• ساختار Board Estrutura do Board

• کامپوننت‌های بخش‌ها (Section) Componentes de Seção

• ساختار کارت‌ها Estrutura dos Cards

• افکت‌های Hover و Focus Efeitos de Hover e Focus

• روتینگ و Layoutها در Next.js Roteamento e Layouts no Next.js

• ساختار Header Estrutura do Cabeçalho

• پارامترهای جستجو با Nuqs Search Parameters com Nuqs

• احراز هویت با Better Auth Autenticação com Better Auth

• متادیتاهای صفحات Metadados das Páginas

• تفاوت Client و Server Components Client e Server Components

• دریافت Issues از Board Buscando Issues do Board

• اعمال فیلتر در لیست Aplicando Filtro na Listagem

• صفحه Issue و حذف داده‌های تکراری (Deduplication) Página de Issue e Deduplicação

• ساختار صفحه Issue Estrutura da Página de Issue

• لیست نظرات Listagem de Comentários

• وضعیت Loading صفحه Issue Loading State da Página de Issue

• Partial Pre Rendering و Suspense API Partial Pre-Rendering Suspense API

• فرم ارسال نظرات Formulário de Comentários

• راه‌اندازی React Query Setup do React Query

• بارگذاری تعاملات در Issue Carregamento das Interações na Issue

• قابلیت لایک Funcionalidade de Like

• بارگذاری تعاملات در Board Carregando Interações no Board

• به‌روزرسانی کش لایک‌ها Atualização de Cache dos Likes

• ایجاد نظرات Criação de Comentários

• Parallel و Intercepting Routes Parallel e Intercepting Routes

• مودال جزئیات Issue Modal do Detalhe da Issue

• سیستم Cache در Next.js Cache no Next.js

• تولید Open Graph Image Gerando Open Graph Image

• جمع‌بندی و پایان Encerramento