آموزش next.js 12 پروژه کدنویسی سایت شخصی و رزومه
آموزش پروژه محور next js - کدنویسی وب سایت رزومه( شخصی یا نمونه کار) با فرانت next js، بک اند node js، دیتابیس mongo و فریمورک استایلینگ tailwind css.
تکنولوژی های استفاده شده
next.js
node.js
mongodb
tailwind.css
تعداد جلسات دوره
جلسات رایگان دوره
معرفی کامل دوره
صفحه اصلی
شامل دو بخش هست. بخش اول، سمت راست صفحه هست که اطلاعات مسئول سایت در اون نمایش داده میشه. این بخش کل ارتفاع صفحه رو میپوشونه و در سمت راست، فیکس شده. بخش دوم، سمت چپ یا details هست که شامل چندین بخش هست. 1) هدر سایت 2) بنر سایت 3) آیتم های تبلیغاتی 4) 10 نمونه کار آخر سایت، به صورت اسلایدر 5) فوتر سایت
نکته: منوی سایت در بالای صفحه، فوتر در پایین و بخش اطلاعات مسئول سایت در سمت راست، فیکس شده و در همه صفحات، ثابت هستند.
صفحه هر نمونه کار
شامل اسلایدری از تصاویر نمونه کار، عنوان اون نمونه کار، توضیحات، ویژگی ها، لینک، تاریخ انتشار و مهارت های استفاده شده هست.
صفحه همه نمونه کارها
لیستی از همه نمونه کارها رو نمایش میده. دارای صفحه بندی هم هست و در هر صفحه، تعداد مشخصی نمایش داده میشه.
نکته: در کارت ویژه هر نمونه کار، تصویر نمونه کار، عنوان اون و مهارت استفاده شده نمایش داده میشه.
صفحه سوابق کاری
سوابق کاری مسئول سایت به صورت باکس باکس توی این صفحه نمایش داده میشه. محتوای هر باکس، شامل عنوان، تاریخ و توضیحات هست.
صفحه سفارش پروژه یا تماس
شامل دو بخش هست. بخش بالایی که در اون، اطلاعات تماس نمایش داده میشه و بخش پایینی که شامل یه فرم هست. توی اون فرم، مراجعه کننده به سایت، میتونه پروژه ثبت کنه. این پروژه جدید، هم در دیتابیس ثبت میشه و هم توی بخش پروژه های جدید در داشبورد سایت، به مدیر سایت نمایش داده میشه. مدیر هم با یه کلیک، میتونه کاری کنه که این پروژه بره به آرشیو و دیگه توی پروژه های جدیدنمایش داده نشه.
ورود ادمین
وب سایت دارای یه بخش ورود یا لاگین هم هست که مخصوص مدیر هست.
داشبورد سایت
آخرین بخش وب سایت، داشبورد مدیریتی هست که دارای چندین بخش هست. 1) بخش افزودن نمونه کار 2) بخش ویرایش نمونه کار 3) بخش حذف نمونه کار 4) بخش جدیدترین پروژه ها 5) بخش به روز رسانی اطلاعات مدیر 6)پیدا کردن پروژه با شماره تلفن سفارش دهنده
نکته در این دوره، از پوشه pages به عنوان پوشه اصلی پروژه استفاده شده. یکی از تفاوت های نکست جی اس 12 و 13 در این هست که توی نکست 13، پوشه app به پروژه اضافه شده و ما میتونیم به جای پوشه pages، از پوشه app استفاده کنیم. اما پوشه اپ، هنوز در مرحله آزمایشی هست پس توصیه میکنم که استفاده از پوشه پیجز رو همراه با من، توی این پروژه یاد بگیرید.
