یک خوش آمدگویی گرم به دوره Next.js توسط Uplatz.
Next.js یک فریم ورک محبوب React برای ساخت برنامه های کاربردی وب و وب سایت های ایستا رندر شده از سمت سرور (SSR) است. این نرم افزار که توسط Vercel توسعه یافته است، توسعه برنامه های React را با ارائه طیف وسیعی از ویژگی هایی که عملکرد، مقیاس پذیری و تجربه توسعه دهنده را افزایش می دهد، ساده می کند.
Next.js چگونه کار می کند
Next.js در بالای React عمل میکند و مجموعهای از عملکردها را فراهم میکند که رندرینگ و مسیریابی را تسهیل میکند. در اینجا یک نمای کلی در سطح بالا از نحوه عملکرد آن آمده است:
رندر سمت سرور (SSR)
درخواست اولیه: وقتی کاربر صفحه ای را درخواست می کند، Next.js HTML را برای بارگذاری اولیه روی سرور ایجاد می کند. این باعث بهبود سئو و زمان بارگذاری صفحه می شود.
Hydration: پس از بارگیری اولیه، Next.js بسته جاوا اسکریپت را برای مشتری ارسال می کند که صفحه را "هیدراته" می کند و آن را تعاملی می کند.
تولید سایت ایستا (SSG)
پیش رندر: برای صفحات استاتیک، Next.js در زمان ساخت HTML تولید می کند که مستقیماً از یک CDN ارائه می شود. این زمان بارگذاری سریع را فراهم می کند و عملکرد را بهبود می بخشد.
مسیرهای API
توابع بدون سرور: Next.js به شما امکان می دهد مسیرهای API را مستقیماً در برنامه خود تعریف کنید. اینها توابع بدون سرور هستند که منطق پشتیبان را مدیریت می کنند و می توانند برای کارهایی مانند ارسال فرم یا واکشی داده ها استفاده شوند.
مسیریابی مبتنی بر فایل
مسیرهای پویا: Next.js از یک سیستم مسیریابی مبتنی بر فایل استفاده می کند که در آن ساختار فایل در فهرست صفحات با مسیرهای موجود در برنامه مطابقت دارد. مسیرهای پویا را می توان با استفاده از نام فایل های محصور در پرانتز ایجاد کرد.
تقسیم خودکار کد
بارگیری درخواستی: Next.js به طور خودکار کد شما را تقسیم می کند و فقط جاوا اسکریپت لازم را برای صفحه درخواستی بارگیری می کند و زمان بارگذاری و عملکرد را بهبود می بخشد.
پشتیبانی از CSS و Sass
پشتیبانی داخلی: Next.js پشتیبانی داخلی برای CSS و Sass ارائه می دهد. میتوانید استایلها را مستقیماً به مؤلفههای خود وارد کنید یا از ماژولهای CSS برای استایلبندی محدوده استفاده کنید.
ویژگی های کلیدی Next.js
رندر سمت سرور (SSR)
تولید HTML در سرور را برای هر درخواست فعال میکند، SEO و زمان بارگذاری را بهبود میبخشد.
تولید سایت ایستا (SSG)
اجازه می دهد تا صفحات را در زمان ساخت از قبل رندر کنید که در نتیجه عملکرد سریع و استقرار آسان را به همراه دارد.
بازسازی استاتیک افزایشی (ISR)
به روز رسانی محتوای ثابت را پس از ساخت بدون بازسازی کل سایت فعال می کند. این اجازه می دهد تا صفحات استاتیک به صورت تدریجی به روز شوند.
مسیریابی مبتنی بر فایل
از یک سیستم مسیریابی مبتنی بر فایل ساده استفاده می کند که در آن فایل های موجود در فهرست صفحات به طور خودکار به مسیرهایی در برنامه تبدیل می شوند.
مسیرهای API
راهی برای ایجاد نقاط پایانی باطن به عنوان توابع بدون سرور، سادهسازی مدیریت منطق سمت سرور ارائه میدهد.
تقسیم خودکار کد
کد را به صورت خودکار تقسیم می کند تا فقط جاوا اسکریپت لازم برای صفحه درخواستی بارگیری شود و عملکرد را بهبود بخشد.
پشتیبانی داخلی CSS و Sass
از وارد کردن فایلهای CSS و Sass به همراه ماژولهای CSS برای سبکهای محدوده پشتیبانی میکند.
پشتیبانی از TypeScript
پشتیبانی خارج از جعبه TypeScript، ادغام TypeScript را در برنامه Next.js آسان می کند.
بهینه سازی تصویر
یک جزء Image را برای بهینه سازی خودکار تصاویر، از جمله بارگذاری تنبل و اندازه پاسخگو ارائه می دهد.
بازخوانی سریع
بهروزرسانی سریع برای مؤلفههای React، ارائه بازخورد فوری در حین توسعه بدون از دست دادن حالت مؤلفه.
Next.js این ویژگیها را ترکیب میکند تا یک چارچوب بسیار کارآمد و مناسب برای توسعهدهندگان برای ساخت برنامههای کاربردی وب مدرن ایجاد کند و مزایای رندر استاتیک و پویا را متعادل کند.
Next.js - برنامه درسی دوره
ماژول 1: مقدمه ای بر Next.js
شروع به کار با Next.js: نمای کلی و مزایا
توضیحات: مقدمه ای بر Next.js، بررسی ویژگی های اصلی آن و مزایایی که برای توسعه وب مدرن ارائه می دهد.
شروع پروژه Next.js شما: راه اندازی و ساختار
توضیحات: نحوه ایجاد یک برنامه Next.js با استفاده از دستور create-next-app و پیمایش ساختار پوشه پروژه را بیاموزید.
ماژول 2: مسیریابی در Next.js
تسلط بر مسیریابی Next.js: از اصول اولیه تا تکنیک های پیشرفته
توضیحات: تکنیکهای مسیریابی مختلف را در Next.js کشف کنید، از جمله مسیرهای اساسی، پویا، تودرتو و catch-all برای ساخت برنامههای پیچیده.
ایجاد ناوبری کارآمد با مسیرهای موازی در Next.js
توضیحات: با توسعه یک برنامه کاربردی کوچک و کاربردی برای بهبود ناوبری، مسیرهای موازی را در Next.js پیاده سازی کنید.
تکنیک های مسیریابی پیشرفته: رهگیری مسیرها در Next.js
توضیحات: تکنیکهایی را برای رهگیری مسیرها، از جمله رهگیری مسیرهای نرم و مستقیم، برای بهبود ناوبری و جریان کاربر کاوش کنید.
ماژول 3: استایل سازی در Next.js
سبک دادن به برنامه Next.js: راهنمای جامع
توضیحات: یک بررسی عمیق در روشهای استایلسازی موجود در Next.js 14، از جمله ماژولهای CSS، Sass، styled-jsx، و سایر روشها برای سبکسازی مؤثر برنامه شما.
ماژول 4: مدیریت دارایی و SEO
بهینه سازی تصاویر، متادیتا و سئو در Next.js
توضیحات: نحوه مدیریت تصاویر و فایل های ثابت، پیکربندی ابرداده برای صفحات و پیاده سازی تکنیک های بهینه سازی SEO برای افزایش دید سایت خود را بیاموزید.
ماژول 5: مدیریت داده
واکشی داده در Next.js: بهترین روشها و تکنیکها
توضیحات: روشهای مختلف واکشی دادهها را در Next.js کاوش کنید، از جمله رندر سمت سرور (SSR)، ایجاد سایت استاتیک (SSG) و واکشی سمت مشتری برای بهبود عملکرد برنامه.
پروژه Next.js با Prisma و SQLite: یک رویکرد عملی
توضیحات: یک پروژه با استفاده از Prisma برای مدیریت پایگاه داده و SQLite ایجاد کنید، با استفاده از آخرین کنترلکنندههای مسیر Next.js برای مدیریت مؤثر دادهها.
ماژول 6: API Routes and Middleware
ساخت و مدیریت مسیرهای API در Next.js
توضیحات: مروری جامع از ایجاد و مدیریت مسیرهای API در Next.js، از جمله استراتژیهای مسیریابی مختلف و بهترین شیوهها.
استفاده از قدرت میانافزار در Next.js
توضیحات: بحث عمیق در مورد Next.js Middleware و Edge Runtime، با مثالهای عملی از نحوه پیادهسازی آنها برای بهبود عملکرد برنامه.
ماژول 7: بهبود تجربه کاربر
افزایش UX با رابط کاربری بارگیری سفارشی در Next.js
توضیحات: روشهای مختلف را برای ایجاد حالتهای بارگذاری مؤثر در برنامه خود، بهبود تجربه کاربر در حین واکشی داده یا انتقال صفحه، کاوش کنید.
ایجاد یک صفحه سفارشی 404 در Next.js: افزایش تجربه کاربر
توضیحات: بیاموزید که چگونه یک صفحه سفارشی "Not Found" در Next.js طراحی کنید و اطلاعات مربوط به سایت را برای راهنمایی کاربران در هنگام مواجهه با صفحه گم شده نمایش دهید.
ماژول 8: رسیدگی به خطا
مدیریت خطا در Next.js: مدیریت زمان اجرا و خطاهای جهانی
توضیحات: نحوه مدیریت و مدیریت خطاهای بخش زمان اجرا و خطاهای کلی را در برنامه های Next.js خود برای اطمینان از استحکام و قابلیت اطمینان بدانید.
ماژول 9: پروژه های ساختمانی
پروژه عملی: ساخت با Next.js 14
توضیحات: با ساختن یک پروژه کوچک که دارای ویژگی های مختلف Next.js 14 است، مفاهیم آموخته شده را به کار ببرید و درک خود را از طریق کاربرد عملی تقویت کنید.
ساخت یک پروژه با Prisma و SQLite: یک رویکرد عملی
توضیحات: با Prisma و SQLite در پروژههای ساختمانی عمیقتر غوطهور شوید و از جدیدترین کنترلکنندههای مسیر Next.js برای مدیریت دادهها و یکپارچهسازی باطن استفاده کنید.
ماژول 10: استقرار
استقرار برنامه های Next.js: راهنمای کامل برای Vercel
توضیحات: راهنمای گام به گام در مورد استقرار برنامه Next.js خود در Vercel، از جمله ادغام با GitHub و مدیریت استقرارها برای به روز رسانی یکپارچه.
ماژول 11: آماده سازی مصاحبه
مصاحبههای Ace Your Next.js: سوالات و مفاهیم کلیدی
توضیحات: سوالات متداول مصاحبه و مفاهیم ضروری مربوط به Next.js را مرور کنید تا به طور موثر برای مصاحبه های شغلی آماده شوید و تخصص خود را نشان دهید.
سریعترین رشد ارائه دهنده آموزش جهانی فناوری اطلاعات Uplatz پیشرو در انگلستان است که ارائه دهنده خدمات آموزش فناوری اطلاعات به دانشجویان در سراسر جهان است. منحصر به فرد بودن ما از آنجا ناشی می شود که ما دوره های آموزشی آنلاین را با کسری از متوسط هزینه این دوره ها در بازار ارائه می دهیم. تخصص ما شامل SAP ، Oracle ، Salesforce ، AWS ، Microsoft Azure ، Google Cloud ، IBM Cloud ، Science data ، Python ، JavaScript ، Java ، Digital Marketing ، Agile و DevOps است. Uplatz که در مارس 2017 تاسیس شد ، شاهد افزایش خارق العاده ای در صنعت آموزش است که با یک دوره آنلاین SAP FICO شروع می شود و اکنون آموزش 500+ دوره را در 54 کشور جهان ارائه داده است که طی 10 سال به 10 هزار دانشجو خدمت کرده اند. آموزش Uplatz بسیار با ساختار ، موضوع محور و شغل محور است و تأکید زیادی بر تمرین و تکالیف در سرورهای زنده دارد. دوره های ما توسط بیش از هزار مربی بسیار ماهر و باتجربه طراحی و تدریس می شوند که در زمینه های خود اعم از SAP ، Cloud ، Oracle یا هر فناوری یا سیستم درخواستی تخصص کافی دارند.
نمایش نظرات