لطفا جهت اطلاع از آخرین دوره ها و اخبار سایت در
کانال تلگرام
عضو شوید.
یادگیری Next.js
Learning Next.js
نکته:
آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره:
Next.js یک چارچوب React است که توسط توسعهدهندگان برای توسعهدهندگان، برای ایجاد برنامههای وب با کیفیت بالا و واکنشگرا ایجاد شده است. با ابزارهای داخلی و ویژگی های آماده استفاده، Next.js روند توسعه را بدون دردسر و آسان می کند. در این دوره آموزشی، Sandy Ludosky، توسعهدهنده و مربی وب، به شما میآموزد که چگونه از چارچوب Next.js برای سرعت بخشیدن و بهبود گردش کار خود استفاده کنید، خواه توسعهدهنده جلویی یا پشتیبان باشید. نحوه ساخت و استقرار یک برنامه وب کاملاً کاربردی را بیاموزید. راههایی را برای استفاده و بهبود تجربه توسعهدهنده کاوش کنید. بهعلاوه، مثالهای عملی را مرور کنید و یک پروژه دوره را تکمیل کنید تا به شما کمک کند آنچه را که آموختهاید تمرین کنید. این دوره می تواند به شما کمک کند تا با Next.js به سطح بعدی بروید.
سرفصل ها و درس ها
مقدمه
Introduction
فایل های تمرینی
Exercise files
آنچه شما باید بدانید
What you should know
Next.js: یک چارچوب React توسط توسعه دهندگان، برای توسعه دهندگان
Next.js: A React framework by developers, for developers
1. شروع به کار و کشف Next.js
1. Getting Started and Discovering Next.js
Next.js چیست؟
What is Next.js?
ایجاد پروژه بلاگ و کاوش در آناتومی برنامه
Creating the Blog project and exploring the app anatomy
راه اندازی محیط توسعه
Setting up the development environment
مزایای استفاده از Next.js
The benefits of using Next.js
2. ساختن برنامه خود با روتر برنامه
2. Building Your Application with App Router
ایجاد صفحات و طرح بندی
Creating pages and layouts
راه حل: یک مسیر اضافه کنید
Solution: Add a route
یک مسیر پویا ایجاد کنید
Create a dynamic route
چالش: یک مسیر اضافه کنید
Challenge: Add a route
ایجاد یک طرح بندی مشترک بین صفحات
Creating a shared layout between pages
پیمایش بین صفحات
Navigating between pages
3. سبک دادن به برنامه شما: CSS و فونت های سفارشی
3. Styling Your Application: CSS and Custom Fonts
یک ظاهر طراحی شرطی را با clsx اعمال کنید
Apply conditional styling with clsx
استفاده از ماژول های CSS برای کامپوننت ها
Using CSS modules for components
اضافه کردن سبک های جهانی
Adding global styles
با استفاده از Tailwind CSS
Using Tailwind CSS
چالش: بهینه سازی تصاویر و فونت ها
Challenge: Optimizing images and fonts
راه حل: بهینه سازی تصاویر و فونت ها
Solution: Optimizing images and fonts
4. استقرار و اتصال به منبع داده
4. Deploy and Connect to a Data Source
یک مخزن GitHub ایجاد کنید و پروژه را فشار دهید
Create a GitHub repository and push the project
راه اندازی پایگاه داده PostgreSQL
Setting up a PostgreSQL database
پروژه خود را متصل کرده و اجرا کنید
Connect and deploy your project
ایجاد یک حساب کاربری Vercel
Creating a Vercel account
راه حل: تغییرات را بنویسید و فشار دهید و سپس مجدداً گسترش دهید
Solution: Write and push changes then redeploy
چالش: تغییرات را بنویسید و فشار دهید و سپس مجدداً گسترش دهید
Challenge: Write and push changes then redeploy
5. واکشی داده ها
5. Fetching Data
چالش: داده ها را در پایگاه داده وارد کنید
Challenge: Insert data to the database
راه حل: داده ها را در پایگاه داده وارد کنید
Solution: Insert data to the database
از پرس و جوهای SQL برای واکشی داده ها استفاده کنید
Use SQL queries to fetch data
پایگاه داده را بسازید و پرس و جوهای SQL را اجرا کنید
Seed the database and execute SQL queries
کشف روش های مختلف واکشی داده ها
Discovering the different ways of fetching data
6. مدیریت خطاها، پیش رندر، ذخیره سازی و بهینه سازی
6. Handling Errors, Pre-rendering, Caching, and Optimizing
پخش جریانی و رندر جزئی را با صفحه بارگیری فعال کنید
Enable streaming and partial rendering with a loading page
رسیدگی به خطاها با صفحه خطا: error.tsx
Handling errors with an error page: error.tsx
چالش: مدیریت خطاهای 404 با توابع notFound
Challenge: Handling 404 errors with notFound functions
رندر استاتیک در مقابل رندر پویا
Static rendering vs. dynamic rendering
رندر پویا بدون کش
Dynamic rendering without caching
اضافه کردن اسکلت های بارگیری
Adding loading skeletons
راه حل: مدیریت خطاهای 404 با توابع notFound
Solution: Handling 404 errors with notFound functions
7. افزودن احراز هویت
7. Adding Authentication
محافظت از صفحات و مسیرهای API
Protecting pages and API routes
با حساب جیمیل خود وارد شوید
Sign in with your Gmail account
راه اندازی NextAuth.js
Setting up NextAuth.js
ایجاد مسیرها و مؤلفه های تأیید اعتبار
Creating the auth routes and components
چالش: احراز هویت و ایجاد پست
Challenge: Authenticate and create posts
افزودن ارائهدهنده اعتبار Google
Adding the Google credentials provider
شروع کار با NextAuth.js
Getting started with NextAuth.js
راه حل: احراز هویت و ایجاد پست
Solution: Authenticate and create posts
8. هوش مصنوعی مولد: با OpenAI یک چت بات بسازید
8. Generative AI: Build a Chatbot with OpenAI
درخواست هایی را برای ایجاد تکمیل با ChatCompletion API تعریف کنید
Define requests to generate completion with the ChatCompletion API
یک پروژه را تنظیم و پیکربندی کنید
Set up and configure a project
نوشتن پست های وبلاگ با محتوای تولید شده توسط هوش مصنوعی
Writing blog posts with AI-generated content
لینکدین: شبکه اجتماعی حرفهای برای ارتباط و کارآفرینی
لینکدین به عنوان یکی از بزرگترین شبکههای اجتماعی حرفهای، به میلیونها افراد در سراسر جهان این امکان را میدهد تا ارتباط برقرار کنند، اطلاعات حرفهای خود را به اشتراک بگذارند و فرصتهای شغلی را کشف کنند. این شبکه اجتماعی به کاربران امکان میدهد تا رزومه حرفهای خود را آپدیت کنند، با همکاران، دوستان و همکاران آینده ارتباط برقرار کنند، به انجمنها و گروههای حرفهای ملحق شوند و از مقالات و مطالب مرتبط با حوزه کاری خود بهرهمند شوند.
لینکدین همچنین به کارفرمایان امکان میدهد تا به دنبال نیروهای با تجربه و مهارت مورد نیاز خود بگردند و ارتباط برقرار کنند. این شبکه حرفهای به عنوان یک پلتفرم کلیدی برای بهبود دسترسی به فرصتهای شغلی و گسترش شبکه حرفهای خود، نقش مهمی را ایفا میکند. از این رو، لینکدین به عنوان یکی از مهمترین ابزارهای کارآفرینی و توسعه حرفهای در دنیای امروز مورد توجه قرار دارد.
سندی لودوسکی کار خود را به عنوان مشاور فناوری اطلاعات در کانادا آغاز کرد.
پس از توسعه وردپرس، سندی شروع به توسعه اپلیکیشن های موبایل iOS با زبان سوئیفت کرد.
سندی متخصص در فن آوری های موبایل و وب به مدت 7 سال، از مشتریان خود در پروژه های تحول دیجیتال پشتیبانی می کند. او همچنین به عنوان یک مربی مستقل برای حمایت از فراگیران در بازآموزی حرفه ای برای مشاغل در توسعه وب کار می کند. سندی اغلب در کارگاه ها و طرح های غیرانتفاعی دیده می شود، جایی که او اشتیاق خود را برای آموزش کد با داوطلبان دیگر به اشتراک می گذارد. در وب، او مرتباً آموزش هایی با محتوای آموزشی جدید منتشر می کند.
نمایش نظرات