آموزش نکست جی‌اس (Next.js) و ری‌اکت (React) - ساخت اپلیکیشن پورتال خبری فول استک - آخرین آپدیت

دانلود Next.js & React - Build Full Stack News Portal Application

نکته: ممکن هست محتوای این صفحه بروز نباشد ولی دانلود دوره آخرین آپدیت می باشد.
نمونه ویدیوها:
توضیحات دوره:

ساخت پورتال خبری تمام عیار با Next.js، React.js، Express.js و MongoDB

آموزش ساخت پورتال خبری فول استک با استفاده از Next.js، React.js، Express.js و MongoDB. یک پروژه کامل با پنل مدیریت و امکانات پیشرفته.

آموزش جامع ساخت پورتال خبری فول استک

در این دوره جامع، نحوه ساخت یک پورتال خبری کامل با استفاده از تکنولوژی‌های Next.js برای فرانت‌اند و Express.js و MongoDB برای بک‌اند را یاد خواهید گرفت. این دوره برای افرادی که به دنبال یادگیری توسعه وب فول استک هستند، بسیار مناسب است.

آنچه در این دوره خواهید آموخت:

  • مبانی Next.js و React.js
  • ساخت وبسایت نمونه کار با Next.js به همراه پنل مدیریت
  • مبانی Express.js برای توسعه بک‌اند
  • کار با کامپوننت‌های فانکشنال در React.js
  • مبانی MongoDB برای ذخیره سازی داده‌ها
  • طراحی کامل اپلیکیشن با استفاده از Tailwind CSS از صفر
  • استفاده از Middleware برای مسیرهای محافظت شده
  • پیاده سازی دو داشبورد مختلف برای ادمین و نویسنده با سطوح دسترسی مختلف
  • طراحی واکنش گرا برای تمامی دستگاه ها
  • امکان خروج از حساب کاربری (Logout)
  • یادگیری نحوه پیاده سازی احراز هویت و اعتبارسنجی
  • راه اندازی آپلود تصویر به Cloudinary
  • مدیریت مسیرهای تودرتو (Nested Route)
  • راه اندازی پروفایل ادمین و نویسنده
  • راه اندازی تغییر رمز عبور
  • امکان مودال برای نمایش تصاویر اخبار
  • راه اندازی فیلتر اخبار
  • راه اندازی صفحه بندی (Pagination) سفارشی اخبار
  • راه اندازی جستجوی اخبار
  • دریافت آخرین، جدیدترین و محبوب ترین اخبار
  • نمایش اخبار مرتبط با دسته بندی
  • ایجاد API برای اخبار
  • امکان گالری تصاویر
  • استقرار پروژه Next.js بر روی سرور

پیش نیازهای دوره:

  • آشنایی با مبانی JavaScript
  • تسلط به Tailwind CSS
  • دانش HTML و CSS
  • آشنایی با دستورات خط فرمان (Command Line)

چرا Next.js و React.js؟

Next.js فریم‌ورک ایده‌آل برای ساخت برنامه‌های React با عملکرد بالا است. با قابلیت‌های رندرینگ سمت سرور (SSR) و تولید صفحات استاتیک (SSG)، می‌توانید وب‌سایت‌هایی با سرعت بالا و بهینه برای SEO ایجاد کنید. ترکیب Next.js با React.js، محبوب‌ترین کتابخانه فرانت‌اند، به شما امکان می‌دهد رابط کاربری مدرن، تعاملی و مقیاس‌پذیر بسازید.

آنچه خواهید ساخت

این دوره شما را در ساخت یک پورتال خبری فول استک راهنمایی می‌کند که شامل موارد زیر است:

  • احراز هویت کاربر: یاد بگیرید چگونه ثبت نام، ورود و مدیریت جلسات امن کاربران را پیاده سازی کنید.
  • ارسال و ویرایش اخبار: یک سیستم مدیریت اخبار پویا بسازید که در آن کاربران احراز هویت شده بتوانند مقالات خبری را در زمان واقعی ارسال و ویرایش کنند.
  • دسته‌ها و برچسب‌ها: مقالات را بر اساس دسته‌ها و برچسب‌ها برای ناوبری بهتر و تجربه کاربری سازماندهی کنید.
  • طراحی واکنش گرا: اطمینان حاصل کنید که برنامه شما کاملاً واکنش گرا است و با استفاده از Tailwind CSS در همه دستگاه ها کار می کند.
  • جستجو و فیلتر: عملکرد جستجو و فیلتر پیشرفته را پیاده سازی کنید تا به کاربران کمک کنید به راحتی اخباری را که به آن اهمیت می دهند پیدا کنند.
  • داشبورد مدیریت: یک داشبورد مدیریت بصری ایجاد کنید تا کاربران، پست‌ها و نظرات را به طور موثر مدیریت کنید.

بهینه سازی SEO و عملکرد

نه تنها یک پورتال خبری خیره کننده خواهید ساخت، بلکه یاد خواهید گرفت که چگونه برنامه خود را برای SEO بهینه کنید. ما به تکنیک هایی مانند:

  • مدیریت متا تگ ها برای رتبه بندی بهتر موتورهای جستجو
  • بهینه سازی تصاویر و دارایی ها برای زمان بارگذاری سریعتر
  • بهبود امتیازات Lighthouse برای تجربه کاربری و قابلیت کشف بهتر

در پایان این دوره، درک عمیقی از Next.js، React.js و توسعه فول استک خواهید داشت، همراه با اطمینان از ساخت و استقرار برنامه های وب با عملکرد بالا خود.

همین امروز ثبت نام کنید و ساخت آینده توسعه وب را با Next.js و React.js شروع کنید!


سرفصل ها و درس ها

مقدمه Introduction

  • معرفی پروژه - چیزی که خواهید ساخت Introduction Project - What You Will Build

  • به دوره خوش آمدید Welcome to the Course

  • نیازمند حمایت شما Need Your Support

  • ماموریت من My Mission

مبانی React: ساختار React، کامپوننت JSX و رندرینگ React Fundamentals React Structure, JSX component & Rendering

  • معرفی React React Introduction

  • ایجاد اپلیکیشن React جدید با استفاده از Vite Create New React App Using Vite

  • اجرای پروژه و دستور ساخت Project Run And Build Command

  • بررسی عمیق ساختار پروژه React Dive Inside React Project Structure

  • سازماندهی پوشه‌های فایل Organizing File Folders

  • بهترین افزونه‌ها و تنظیمات VS Code برای توسعه React Best VS Code Extensions And Settings For React Development

  • درک اولیه از کامپوننت قسمت 1 Primary Understanding On Component Part 1

  • درک اولیه از کامپوننت قسمت 2 Primary Understanding On Component Part 2

JSX و قراردادها JSX And Conventions

  • JSX و قراردادها JSX And Conventions

  • JSX مخفف If Else JSX Short Hand If else

  • تابع فراخوانی شده فوری JSX JSX Immediately invoked function

  • حلقه داخل JSX JSX Loop Inside

  • رندرینگ شرطی JSX با استفاده از If Else JSX Conditional Rendering Using If Else

  • رندرینگ شرطی JSX با استفاده از Switch Statement JSX Conditional Rendering Using Switch Statement

  • رندرینگ شرطی JSX با استفاده از عملگر Ternary JSX Conditional Rendering Using Ternary Operator

  • رندرینگ شرطی JSX با استفاده از Logical And JSX Conditional Rendering Using Logical And And

  • رندرینگ شرطی JSX با استفاده از تابع فراخوانی شده فوری JSX Conditional Rendering Using Immidiatly Invoked Function

مدیریت کامپوننت React Manage React Component

  • ارسال ویژگی‌ها به کامپوننت فرزند Passing Properties to Child Component

  • ارسال رشته ساده به کامپوننت فرزند Passing Simple String to Child Component

  • ارسال شیء به کامپوننت فرزند Passing Object to Child Component

  • ارسال تابع به کامپوننت فرزند Passing Function to Child Component

  • مدیریت رویداد کلیک Managing Click Event

  • مدیریت ارسال فرم Managing Form Submit

React Routing React Routing

  • اعمال React Router Dom Applying React Router Dom

  • Link و NavLink برای Router Link And NavLink For Router

  • Browser Router در مقابل HashRouter Browser Router VS HashRouter

  • ارسال پارامتر از طریق ناوبری Passing Parameter Via Naviagation

React Hook & State Management React Hook & State Management

  • [Hook] آشنایی با Hook [Hook] Meet With Hook

  • [Hook] useRef InnerText InnerHTML [Hook] useRef InnerText InnerHTML

  • [Hook] useRef کار با Attribute [Hook] useRef Working With Attribute

  • useRef کار با عنصر Input useRef Working With Input Element

  • useRef کار با کلاس CSS useRef Working With CSS Class

  • useRef ذخیره محاسبات پرهزینه useRef Caching Expensive Computation

  • useState درک درونی useState Understading Inside

  • useState کار با شیء Immutable useState Working With Immutable Object

  • useState کار با آرایه Immutable قسمت 1 useState Working With Immutable Array Part 1

  • useState کار با آرایه Immutable قسمت 2 useState Working With Immutable Array Part 2

  • useState مدیریت فرم مانند حرفه‌ای قسمت 1 useState Managing Form Like Pro Part 1

  • useState مدیریت فرم مانند حرفه‌ای قسمت 2 useState Managing Form Like Pro Part 2

  • useEffect درک آرگومان‌ها و کاربردها useEffect understanding arguments and uses

  • useEffect فراخوانی API با استفاده از Promises useEffect calling api using promises

  • useEffect فراخوانی API با استفاده از Async Await useEffect calling api usig async await

مبانی Express JS Express JS Fundamental

  • معرفی Express Js چیست Introduction What is Express Js

  • اولین برنامه Express شما Your First Express Application

  • Express js Routing Express js Routing

  • چهار موضوعی که باید روی آنها تمرکز کنیم Four Topic We Need To Focus

  • درک Response Understanding Response

  • Response رشته ساده Simple String Response

  • کد وضعیت Response Response Status Code

  • JSON Response JSON Response

  • Response Download Response Download

  • Response Redirect Response Redirect

  • Response Header Response Header

  • Response Set Cookies Response Set Cookies

  • Response Clear Cookies Response Clear Cookies

  • کار با Request Working With Request

  • Get Request با URL Query Get Request With URL Query

  • کار با هدر Get Request Working With Get Request Header

  • Simple Post Request Simple Post Request

  • Post Request با URL Query Post Request With URL Query

  • Post Request با ویژگی‌های هدر Post Request With Header Properties

  • Post application-json Post application-json

  • کار با Multipart Form Data Working With Multipart Form Data

  • آپلود فایل File Upload

  • Middleware Middleware

  • Application Middleware Application Middleware

  • Route Middleware Route Middleware

مبانی MongoDB - یک پایگاه داده NoSQL MongoDB Fundamental - A NoSQL Database

  • معرفی MongoDB Introduction to MongoDB

  • نصب MongoDB و Compass Installing MongoDB and Compass

  • اتصال به MongoDB Connecting to MongoDB

  • Schema و Models Schema and Models

  • ایجاد و ذخیره یک سند Create and Save a document

  • یافتن اسناد به روش‌های مختلف Find documents in multiple ways

  • Query API: انتخاب، مرتب‌سازی، محدود کردن، شمارش اسناد Query API Select, Sort, Limit, Count Documents

  • Complex Query: عملگرهای مقایسه Complex Query Comparison Operators

  • Complex Query: عملیات And, Or Complex Query And, Or Operations

  • تمرین: Advanced Query Exercise Advanced Query

  • به‌روزرسانی یک سند (روش 1) Update a document (Way 1)

  • به‌روزرسانی یک سند (روش 2) Update a document (Way 2)

  • حذف اسناد به 2 روش Delete documents in 2 ways

پایه Next JS Next JS Foundation

  • تنظیم ابزارهای محیط Environment Tools Setup

  • Next JS چیست و چرا What and Why Next JS

  • تفاوت بین React و Next js چیست What is the Different between React and Next js

  • ایجاد اپلیکیشن جدید و بررسی فرآیند بهینه‌سازی Build Create New App And Explore Build Optimization Process

  • بازی با ساختار پروژه Playing With Project Structure

  • مفهوم صفحه اصلی و کامپوننت Functional Primary Page Concept And Functional Component

  • کار با دارایی‌های استاتیک داخل Public Working With Static Asset Inside Public

  • کار با CSS سراسری و Module Working With Global And Module CSS

  • بررسی Client Side Rendering Exploring Client Side Rendering

  • بررسی Server Side Redering Exploring Server Side Redering

  • کجا از SSR استفاده کنیم کجا CSR Where use SSR Where CSR

  • چرا از use Client استفاده می‌کنیم Why we are writing use Client

  • بررسی مفهوم Directory Routing Exploring Directory Routing Concept

  • مفهوم Neasted Directory Routing Neasted Directory Routing Concept

  • کامپوننت Basic Link Basic Link Component

  • نوار پیشرفت در Routing Progress Bar In Routing

  • مدیریت Active Link Managing Active Link

  • Link Component Query Link Component Query

  • Link Component Query با useSearchParams Link Component Query With useSearchParams

  • ویژگی‌های Link Component Prefetch و Replace Link Component Prefetch and Replace Properties

  • جزئیات Routing Programmatically Programmatically Routing Details

  • تفکر در Next JS در مورد Server Component Thinking In Next JS What About Server Component

  • تفکر در Next JS در مورد Client Component Thinking In Next JS What About Client Component

پیکربندی و بهینه‌سازی‌های پیشرفته Next.js Next.js Advance Config and Optimizations

  • [Config] درک Base Path و Environment Variable [Config] Understanding Base Path And Environment Variable

  • درک Header Config Understanding Header Config

  • Header Security Config قسمت 1 Header Security Config Part 1

  • Header Security Config قسمت 2 Header Security Config Part 2

  • Header Security Config قسمت 3 Header Security Config Part 3

  • Connection و Compression Connection And Compression

  • بهینه‌سازی تصویر Image Optimization

  • بهینه‌سازی فونت قسمت 1 Font Optimization Part 1

  • بهینه‌سازی فونت قسمت 2 Font Optimization Part 2

  • اسکریپت و دارایی‌های استاتیک Script And Static Assets

Middleware و صفحه 404 Next.js Next.js Middleware And 404 page

  • Middleware Setup قسمت 1 Middleware Setup Part 1

  • Middleware Setup قسمت 2 Middleware Setup Part 2

  • صفحه یافت نشد Not Found Page

وب‌سایت نمونه کار اولیه Next.js با پنل ادمین Next.js Basic Portfolio Website With Admin Panel

  • وب‌سایت نمونه کار اولیه Next.js با پنل ادمین Next.js Basic Portfolio Website With Admin Panel

  • فایل‌های تمرینی وب‌سایت نمونه کار اولیه - منابع قابل دانلود Basic Portfolio Website Excise File - Downloadable Resources

  • کد منبع پروژه نمونه کار اولیه - منبع قابل دانلود Basic Portfolio Project Source Code - Downloadable Resource

  • ایجاد پروژه Nextjs و بسته‌ها Create Nextjs Project and Packages

  • تنظیم پایگاه داده Mongodb Mongodb Database Setup

  • ایجاد کامپوننت‌های منوی ناوبری ادمین قسمت 1 Create Admin Navigation Menu Components Part 1

  • ایجاد کامپوننت‌های منوی ناوبری ادمین قسمت 2 Create Admin Navigation Menu Components Part 2

  • ایجاد کامپوننت‌های منوی ناوبری ادمین قسمت 3 Create Admin Navigation Menu Components Part 3

  • ایجاد فرم Home برای ذخیره داده‌ها قسمت 1 Create Home Form for Store Data Part 1

  • ایجاد فرم Home برای ذخیره داده‌ها قسمت 2 Create Home Form for Store Data Part 2

  • ایجاد فرم صفحه About Create About Page Form

  • ایجاد فرم صفحه Experience Create Experience Page Form

  • ایجاد فرم صفحه Education Create Education Page Form

  • ایجاد فرم صفحه Project Create Project Page Form

  • کار برای Cerate Model Work For Cerate Model

  • Mongoose Schemas and Models Mongoose Schemas and Models

  • ایجاد Api برای تمام کامپوننت‌ها قسمت 1 Create Api for All Components Part 1

  • ایجاد Api برای تمام کامپوننت‌ها قسمت 2 Create Api for All Components Part 2

  • ایجاد سرویس‌های API مشترک Create Common API Services

  • توابع Async جاوااسکریپت و Fetch API JavaScript Async Functions and Fetch API

  • افزودن داده به پایگاه داده قسمت 1 Add Data to Database Part 1

  • افزودن داده به پایگاه داده قسمت 2 (رفع مشکل Experience) Add Data to Database Part 2 (Experience Issue Solve)

  • افزودن بازنشانی از داده‌ها Add Reset From Data

  • دریافت لیست داده‌ها و نمایش Get List of Data and Show

  • به‌روزرسانی داده‌های Home و About قسمت 1 Update Home And About Data Part 1

  • به‌روزرسانی داده‌های Home و About قسمت 2 Update Home And About Data Part 2

  • رندر کردن داده‌های Experience در صفحه Render Experience Data in Page

  • رندر کردن داده‌های Education و Project در صفحه Render Education and Project Data in Page

  • احراز هویت ورود به سیستم قسمت 1 Login Authentication Part 1

  • احراز هویت ورود به سیستم قسمت 2 Login Authentication Part 2

  • احراز هویت ورود به سیستم قسمت 3 Login Authentication Part 3

  • احراز هویت و اعتبارسنجی کاربر Authentication and User Validation

  • احراز هویت ورود به سیستم قسمت 4 Login Authentication Part 4

  • خروج کاربر User Logout-

  • کار برای Frontend Fetch Data قسمت 1 Work for Frontend Fetch Data Part 1

  • کار برای Frontend Fetch Data قسمت 2 Work for Frontend Fetch Data Part 2

  • طراحی Frontend NavBar قسمت 1 Design Frontend NavBar Part 1

  • طراحی Frontend NavBar قسمت 2 Design Frontend NavBar Part 2

  • طراحی Frontend NavBar قسمت 3 Design Frontend NavBar Part 3

  • طراحی Frontend NavBar قسمت 4 Design Frontend NavBar Part 4

  • طراحی Frontend Home Page قسمت 1 Design Frontend Home Page Part 1

  • طراحی Frontend Home Page قسمت 2 Design Frontend Home Page Part 2

  • طراحی Frontend Home Page قسمت 3 Design Frontend Home Page Part 3

  • طراحی Frontend Home Page قسمت 4 Design Frontend Home Page Part 4

  • طراحی Frontend About Page قسمت 1 Design Frontend About Page Part 1

  • طراحی Frontend About Page قسمت 2 Design Frontend About Page Part 2

  • طراحی Frontend About Page قسمت 3 Design Frontend About Page Part 3

  • طراحی Frontend Experience and Education Page قسمت 1 Design Frontend Experience and Education Page Part 1

  • طراحی Frontend Experience and Education Page قسمت 2 Design Frontend Experience and Education Page Part 2

  • طراحی Frontend Experience and Education Page قسمت 3 Design Frontend Experience and Education Page Part 3

  • طراحی Frontend Project Page قسمت 1 Design Frontend Project Page Part 1

  • طراحی Frontend Project Page قسمت 2 Design Frontend Project Page Part 2

  • طراحی Frontend Project Page قسمت 3 Design Frontend Project Page Part 3

  • طراحی Frontend Contact Us Page قسمت 1 Design Frontend Contact Us Page Part 1

  • طراحی Frontend Contact Us Page قسمت 2 Design Frontend Contact Us Page Part 2

  • طراحی Frontend Contact Us Page قسمت 3 Design Frontend Contact Us Page Part 3

  • ارسال فرم Contact Us قسمت 1 Contact Us Form Submit Part 1

  • ارسال فرم Contact Us قسمت 2 Contact Us Form Submit Part 2

  • حذف داده‌های Education قسمت 1 Delete Education Data Part 1

  • حذف داده‌های Education قسمت 2 Delete Education Data Part 2

  • DELETE Request Handling DELETE Request Handling

  • استقرار وب‌سایت نمونه کار اولیه Next.js در Web Server Deploy Next.js Basic Portfolio to Web Server

شروع ساخت سایت پورتال خبری پیشرفته Next JS Start To Build Next JS Complete Advance News Portal Site

  • ویدیوی معرفی پورتال خبری News Portal Introduction Video-

  • فایل تمرینی پروژه پورتال خبری News Portal Project Excise File

  • ساختار پروژه Project Structure

  • تنظیمات محیطی Environment Setup

تنظیم پروژه پورتال خبری News Portal Project Setup

  • تنظیم پروژه قسمت 1 Project Setup Part 1-

  • تنظیم پروژه قسمت 2 Project Setup Part 2

  • نصب Tailwind Css Install Tailwind Css

  • تنظیم پروژه قسمت 3 Project Setup Part 3

طراحی پنل ادمین Admin Panel Design

  • طراحی پنل ادمین قسمت 1 Admin Panel Design Part 1

  • طراحی پنل ادمین قسمت 2 Admin Panel Design Part 2

  • طراحی پنل ادمین قسمت 3 Admin Panel Design Part 3

  • طراحی پنل ادمین قسمت 4 Admin Panel Design Part 4

مدیریت مسیر تو در تو Nested Route Manage

  • مدیریت مسیر تو در تو قسمت 1 Nested Route Manage Part 1

  • مسیریابی و طرح بندی ها Routing and Layouts

  • مدیریت مسیر تو در تو قسمت 2 Nested Route Manage Part 2

طراحی صفحه اخبار News Page Design

  • طراحی صفحه اخبار قسمت 1 News Page Design Part 1

  • طراحی صفحه اخبار قسمت 2 News Page Design Part 2

  • طراحی صفحه اخبار قسمت 3 News Page Design Part 3

  • طراحی صفحه اخبار قسمت 4 News Page Design Part 4

  • طراحی صفحه اخبار قسمت 5 News Page Design Part 5

طراحی داشبورد ادمین Admin Dashboard Design

  • طراحی پنل ادمین قسمت 1 Admin Panel Design Part 1

  • طراحی پنل ادمین قسمت 2 Admin Panel Design Part 2

طراحی افزودن نویسنده ادمین Admin Add Writer Design

  • طراحی افزودن نویسنده ادمین قسمت 1 Admin Add Writer Design Part 1

  • طراحی افزودن نویسنده ادمین قسمت 2 Admin Add Writer Design Part 2

طراحی صفحه نویسنده ادمین Admin Writer Page Design

  • طراحی صفحه نویسنده ادمین Admin Writer Page Design

طراحی صفحه پروفایل کاربر User Profile Page Design

  • طراحی صفحه پروفایل کاربر قسمت 1 User Profile Page Design Part 1

  • طراحی صفحه پروفایل کاربر قسمت 2 User Profile Page Design Part 2

تنظیم صفحه افزودن اخبار نویسنده Writer Add News Page Setup

  • تنظیم صفحه افزودن اخبار نویسنده قسمت 1 Writer Add News Page Setup Part 1

  • تنظیم صفحه افزودن اخبار نویسنده قسمت 2 Writer Add News Page Setup Part 2

  • تنظیم صفحه افزودن اخبار نویسنده قسمت 3 Writer Add News Page Setup Part 3

  • تنظیم صفحه افزودن اخبار نویسنده قسمت 4 Writer Add News Page Setup Part 4

  • طراحی داشبورد نویسنده Writer Dashboard Design

طراحی صفحه ورود و اتصال DB Login Page Design and DB Connect

  • طراحی صفحه ورود و اتصال DB قسمت 1 Login Page Design and DB Connect Part 1

  • طراحی صفحه ورود و اتصال DB قسمت 2 Login Page Design and DB Connect Part 2

  • مدیریت فرم و مدیریت وضعیت Form Handling and State Management

  • طراحی صفحه ورود و اتصال DB قسمت 3 Login Page Design and DB Connect Part 3

  • طراحی صفحه ورود و اتصال DB قسمت 4 Login Page Design and DB Connect Part 4

بک‌اند ورود کاربر User Login Backend

  • بک‌اند ورود کاربر قسمت 1 User Login Backend Part 1

  • بک‌اند ورود کاربر قسمت 2 User Login Backend Part 2

  • بک‌اند ورود کاربر قسمت 3 User Login Backend Part 3

  • بک‌اند ورود کاربر قسمت 4 User Login Backend Part 4

  • بک‌اند ورود کاربر قسمت 5 User Login Backend Part 5

  • بک‌اند ورود کاربر قسمت 6 User Login Backend Part 6

عملکرد خروج از داشبورد Dashboard Logout Function

  • عملکرد خروج از داشبورد Dashboard Logout Function

تنظیم افزودن نویسنده Writer Add Setup

  • تنظیم افزودن نویسنده قسمت 1 Writer Add Setup Part 1

  • تنظیم افزودن نویسنده قسمت 2 Writer Add Setup Part 2

  • تنظیم افزودن نویسنده قسمت 3 Writer Add Setup Part 3

  • تنظیم افزودن نویسنده قسمت 4 Writer Add Setup Part 4

ویرایش، به‌روزرسانی و حذف نویسنده Writer Edit Update And Delete

  • ویرایش، به‌روزرسانی و حذف نویسنده قسمت 1 Writer Edit Update And Delete Part 1

  • ویرایش، به‌روزرسانی و حذف نویسنده قسمت 2 Writer Edit Update And Delete Part 2

  • ویرایش، به‌روزرسانی و حذف نویسنده قسمت 3 Writer Edit Update And Delete Part 3

  • ویرایش، به‌روزرسانی و حذف نویسنده قسمت 4 Writer Edit Update And Delete Part 4

  • اعتبارسنجی ورودی و مدیریت خطا Input Validation and Error Handling

  • ویرایش، به‌روزرسانی و حذف نویسنده قسمت 5 Writer Edit Update And Delete Part 5

عملکرد افزودن اخبار News Add Function

  • عملکرد افزودن اخبار قسمت 1 News Add Function Part 1

  • عملکرد افزودن اخبار قسمت 2 News Add Function Part 2

  • عملکرد افزودن اخبار قسمت 3 News Add Function Part 3

  • عملکرد افزودن اخبار قسمت 4 News Add Function Part 4

  • عملکرد افزودن اخبار قسمت 5 News Add Function Part 5

  • عملکرد افزودن اخبار قسمت 6 News Add Function Part 6

عملکرد تصویر اخبار Modal Modal News Image Function

  • عملکرد تصویر اخبار Modal قسمت 1 Modal News Image Function Part 1

  • عملکرد تصویر اخبار Modal قسمت 2 Modal News Image Function Part 2

  • عملکرد تصویر اخبار Modal قسمت 3 Modal News Image Function Part 3

  • عملکرد تصویر اخبار Modal قسمت 4 Modal News Image Function Part 4

  • آپلود فایل و ادغام Cloudinary File Upload and Cloudinary Integration

  • عملکرد تصویر اخبار Modal قسمت 5 Modal News Image Function Part 5

دریافت داده‌های اخبار از پایگاه داده Get News Data From Database

  • دریافت داده‌های اخبار از پایگاه داده قسمت 1 Get News Data From Database Part 1

  • دریافت داده‌های اخبار از پایگاه داده قسمت 2 Get News Data From Database Part 2

گزینه ویرایش و به‌روزرسانی اخبار Edit and Update News Option

  • ویرایش و به‌روزرسانی اخبار قسمت 1 Edit and Update News Part 1

  • ویرایش و به‌روزرسانی اخبار قسمت 2 Edit and Update News Part 2

  • ویرایش و به‌روزرسانی اخبار قسمت 3 Edit and Update News Part 3

حذف اخبار با گزینه تصویر News Delete with Image Option

  • حذف اخبار با تصویر قسمت 1 News Delete with Image Part 1

  • حذف اخبار با تصویر قسمت 2 News Delete with Image Part 2

افزودن داده‌های نمایشی Add Demo Data

  • افزودن داده‌های نمایشی در پایگاه داده Add Demo Data in Database

جستجو و صفحه‌بندی اخبار Search and News Pagination

  • جستجو و صفحه‌بندی اخبار قسمت 1 Search and News Pagination Part 1

  • جستجو و صفحه‌بندی اخبار قسمت 2 Search and News Pagination Part 2

نمایش گزینه فیلتر اخبار Show News Filter Option

  • نمایش گزینه فیلتر اخبار Show News Filter Option

عملکرد به‌روزرسانی وضعیت اخبار News Status Update Function

  • عملکرد به‌روزرسانی وضعیت اخبار قسمت 1 News Status Update Function Part 1

  • عملکرد به‌روزرسانی وضعیت اخبار قسمت 2 News Status Update Function Part 2

  • درخواست API و مجوز API Request and Authorization

  • عملکرد به‌روزرسانی وضعیت اخبار قسمت 3 News Status Update Function Part 3

ایجاد پروژه Next Js برای Frontend Create Next Js Project for Frontend

  • ایجاد پروژه Next Js Create Next Js Project

  • نصب همه وابستگی‌ها برای پروژه اخبار Install All Dependencies for News Project

ایجاد برنامه و طراحی هدر App Create and Design Header

  • ایجاد و طراحی هدر قسمت 1 Create and Design Header Part 1

  • ایجاد و طراحی هدر قسمت 2 Create and Design Header Part 2

  • ایجاد و طراحی هدر قسمت 3 Create and Design Header Part 3

  • ایجاد و طراحی هدر قسمت 4 Create and Design Header Part 4

  • ایجاد و طراحی هدر قسمت 5 Create and Design Header Part 5

  • ایجاد و طراحی هدر قسمت 6 Create and Design Header Part 6

طراحی سرتیتر Frontend Frontend Headline Design

  • طراحی سرتیتر Frontend Frontend Headline Design

طراحی آخرین اخبار Latest News Design

  • طراحی آخرین اخبار قسمت 1 Latest News Design Part 1

  • طراحی آخرین اخبار قسمت 2 Latest News Design Part 2

  • طراحی آخرین اخبار قسمت 3 Latest News Design Part 3

  • طراحی آخرین اخبار قسمت 4 Latest News Design Part 4

  • طراحی آخرین اخبار قسمت 5 Latest News Design Part 5

طراحی اخبار محبوب Popular News Design

  • طراحی اخبار محبوب قسمت 1 Popular News Design Part 1

  • طراحی اخبار محبوب قسمت 2 Popular News Design Part 2

  • طراحی اخبار محبوب قسمت 3 Popular News Design Part 3

  • طراحی اخبار محبوب قسمت 4 Popular News Design Part 4

  • طراحی اخبار محبوب قسمت 5 Popular News Design Part 5

  • طراحی اخبار محبوب قسمت 6 Popular News Design Part 6

اخبار و طراحی Footer News and Footer Design

  • اخبار و طراحی Footer قسمت 1 News and Footer Design Part 1

  • اخبار و طراحی Footer قسمت 2 News and Footer Design Part 2

  • اخبار و طراحی Footer قسمت 3 News and Footer Design Part 3

  • اخبار و طراحی Footer قسمت 4 News and Footer Design Part 4

طراحی صفحه اخبار دسته‌بندی Category News Page Design

  • طراحی صفحه اخبار دسته‌بندی قسمت 1 Category News Page Design Part 1

  • طراحی صفحه اخبار دسته‌بندی قسمت 2 Category News Page Design Part 2

  • طراحی صفحه اخبار دسته‌بندی قسمت 3 Category News Page Design Part 3

  • طراحی صفحه اخبار دسته‌بندی قسمت 4 Category News Page Design Part 4

طراحی صفحه جزئیات اخبار News Details Page Design

  • طراحی صفحه جزئیات اخبار News Details Page Design

ایجاد News API News API Create

  • ایجاد News API قسمت 1 News API Create Part 1

  • ایجاد News API قسمت 2 News API Create Part 2

  • ایجاد News API قسمت 3 News API Create Part 3

  • MongoDB Aggregation Pipeline MongoDB Aggregation Pipeline

گزینه نمایش داده‌های اخبار News Data Show Option

  • گزینه نمایش داده‌های اخبار قسمت 1 News Data Show Option Part 1

  • گزینه نمایش داده‌های اخبار قسمت 2 News Data Show Option Part 2

  • گزینه نمایش داده‌های اخبار قسمت 3 News Data Show Option Part 3

سرتیترهای اخبار دسته بندی News Headlines Category

  • سرتیترهای اخبار دسته بندی قسمت 1 News Headlines Category Part 1

  • سرتیترهای اخبار دسته بندی قسمت 2 News Headlines Category Part 2

  • سرتیترهای اخبار دسته بندی قسمت 3 News Headlines Category Part 3

نمایش صفحه جزئیات اخبار News Details Page Show

  • نمایش صفحه جزئیات اخبار قسمت 1 News Details Page Show Part 1

  • نمایش صفحه جزئیات اخبار قسمت 2 News Details Page Show Part 2

  • نمایش اخبار مرتبط در صفحه جزئیات Related News Shows in Details Page

نمایش لیست دسته‌بندی اخبار News Category List Show

  • نمایش صفحه دسته‌بندی اخبار قسمت 1 News Category Page Show Part 1

  • نمایش صفحه دسته‌بندی اخبار قسمت 2 News Category Page Show Part 2

  • فیلتر کردن Query با MongoDB Query Filtering with MongoDB

آخرین اخبار و اخبار محبوب Latest and Popular News

  • آخرین اخبار و اخبار محبوب قسمت 1 Latest and Popular News Part 1

  • آخرین اخبار و اخبار محبوب قسمت 2 Latest and Popular News Part 2

نمایش اخبار اخیر Recent News Show

  • نمایش اخبار اخیر قسمت 1 Recent News Show Part 1

  • نمایش اخبار اخیر قسمت 2 Recent News Show Part 2

  • به‌روزرسانی دسته‌بندی با شمارش Update Category with Count

گزینه گالری تصویر Image Gallery Option

  • گزینه گالری تصویر Image Gallery Option

نمایش Api گزینه جستجو Show Search Option Api

  • نمایش گزینه اخبار جستجو قسمت 1 Show Search News Option Part 1

  • نمایش گزینه اخبار جستجو قسمت 2 Show Search News Option Part 2

  • نمایش گزینه اخبار جستجو قسمت 3 Show Search News Option Part 3

گزینه به‌روزرسانی پروفایل کاربر User Profile Update Option

  • گزینه به‌روزرسانی پروفایل کاربر قسمت 1 User Profile Update Option Part 1

  • گزینه به‌روزرسانی پروفایل کاربر قسمت 2 User Profile Update Option Part 2

  • گزینه به‌روزرسانی پروفایل کاربر قسمت 3 User Profile Update Option Part 3

  • گزینه به‌روزرسانی پروفایل کاربر قسمت 4 User Profile Update Option Part 4

  • گزینه به‌روزرسانی پروفایل کاربر قسمت 5 User Profile Update Option Part 5

  • اعتبارسنجی شناسه کاربر و بازیابی داده‌ها User ID Validation and Data Retrieval

توابع تغییر رمز عبور کاربر User Change Password Functions

  • توابع تغییر رمز عبور کاربر قسمت 1 User Change Password Functions Part 1

  • توابع تغییر رمز عبور کاربر قسمت 2 User Change Password Functions Part 2

به‌روزرسانی داشبورد Update Dashboard

  • به‌روزرسانی داشبورد ادمین Update Admin Dashboard

  • به‌روزرسانی اخبار اخیر در داشبورد ادمین Update Recent News in Admin Dashboard

نمایش نظرات

آموزش نکست جی‌اس (Next.js) و ری‌اکت (React) - ساخت اپلیکیشن پورتال خبری فول استک
جزییات دوره
50.5 hours
315
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
389
4.8 از 5
دارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Kazi Ariyan Kazi Ariyan

توسعه دهنده وب ، کارآفرین ، مربی آنلاین سلام! من کازی آریان هستم. من یک توسعه دهنده وب هستم و علاقه جدی به تدریس دارم و بنیانگذار eLe easy Learning و یک توسعه دهنده وب ، برنامه نویس و مربی پرشور هستم. من در 7 سال گذشته بصورت آنلاین کار می کنم و چندین وب سایت موفق ایجاد کرده ام که در اینترنت فعالیت می کنند. من سعی می کنم یک دوره مبتنی بر پروژه ایجاد کنم که به شما کمک کند تا حرفه ای یاد بگیرید و به عنوان یک توسعه دهنده کامل سقوط کنید. یادگیری آسان برای کمک به شما در موفقیت در زندگی وجود دارد. هر دوره برای آموزش مهارت خاصی طراحی شده است. امیدوارم موافقت کنید! خواه در تلاش برای یادگیری یک مهارت جدید از ابتدا باشید و یا بخواهید حافظه خود را با آنچه در گذشته آموخته اید تازه کنید ، به مکان مناسب رسیده اید. آموزش و پرورش دنیا را به جای بهتری تبدیل می کند. با مهارت های جدید دنیای خود را بهتر کنید.

Easy learning Easy learning

گرافیک مهندسی/رسم نویسنده این دوره B. Tech را تکمیل کرده است. مهندسی مکانیک از کالج مهندسی پونا (Coop) و کارشناسی ارشد مهندسی در تولید و اتوماسیون. او در لاغر شش سیگما سیاه کمربند (LSSBB) با طراحی آزمایش (DOE) و تجزیه و تحلیل داده ها تایید شده است. او سخنرانی های آنلاین را در زمینه گرافیک مهندسی یا نقاشی به عنوان در برنامه SPPU ساخته است. محتوا نه تنها مربوط به SPPU بلکه قابل اجرا برای همه دانشجویان سال اول سال است. خالق یادگیری آسان، مفاهیم مهندسی و چیزهای مهندسی را به صورت دستی فراهم می کند. نویسنده آن را در واقع با استفاده از ابزارها کشیده شده است. بنابراین دانش آموزان می توانند به راحتی پس از گام نویسنده قرعه کشی کنند.