آموزش طراحی اسلایدرهای خلاقانه با next.js و tailwind.css

توی این پروژه، ما 6 تا اسلایدر مختلف با نکست جی اس و تیلویند سی اس اس طراحی میکنیم.

1 و 2. توی این دو تا اسلایدر، ما دو تا اسلایدر رو از صفر کد میزنیم. توی این دو تا ویدئو، هدف اینه که شما با استفاده از انیمیشن‌ها در next.js و همچنین مدیریت استیت برای تغییر اسلاید آشنا بشید.

3 و 4. توی دو تا اسلایدر دوم، هدف اینه که شما ببینید چه پکیج هایی برای طراحی اسلایدر در ریکت و نکست وجود داره. توی این دو اسلایدر، از دو پکیج متفاوت استفاده شده یعنی swiperjs و slick slider

5. اسلایدر پنجم، اسلایدر برفی هست. افکت برفی هم از اون افکتهای جذاب هست که کاربر رو جذب میکنه.

6. اسلایدر ششم، اسلایدر نمایش محصولات هست. اسلایدری کاملا ریسپانسیو که خودمون از صفر تا صدش رو کد میزنیم. 

نکته: ضبط این دوره، پیش از انتشار نسخه 13 فریمورک نکست جی اس انجام شده. در واقع با Next js 12. با استقرار Next js 13، جلسات 11 و 12 به این دوره اضافه شده که در جلسه 11، پروژه به نکست جی اس سیزده منتقل شده و در جلسه 12 هم، یک اسلایدر پکیجی دیگه به دوره اضافه شده.   

در واقع اگر شما دوره نکست جی اس مقدماتی مرن فا رو دیده باشید، قطعا توانایی زدن این پروژه با Next js 13 رو هم دارید ولی جلسه 11 هم میتونه کمک کننده باشه.