کانال تلگرام پشتیبانی تلگرام شماره تماس پشتیبانی: 0930 395 3766
ورود ثبت نام

آموزش Tailwind CSS 4: ساخت 5 پروژه وب با React و Tailwind - آخرین آپدیت

دانلود Tailwind CSS 4: Build 5 Web Projects with React & Tailwind

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

آموزش جامع Tailwind CSS 4 و React با ساخت 5 پروژه واقعی | یادگیری طراحی مدرن رابط کاربری و توسعه وب واکنش‌گرا

تسلط بر Tailwind CSS 4

تمام ویژگی‌های جدید، بهبودها و بهترین شیوه‌ها را برای ساخت رابط‌های کاربری مدرن و واکنش‌گرا به صورت کارآمد بیاموزید.

ساخت 5 پروژه واقعی

با ساخت پنج پروژه کاملاً کاربردی، تجربه عملی کسب کنید و بر موارد استفاده عملی Tailwind CSS 4 تمرکز کنید.

تقویت مهارت‌های React

دانش React خود را هنگام ادغام Tailwind CSS برای ساخت رابط‌های کاربری پویا و تعاملی تقویت کنید.

بهینه‌سازی برای عملکرد و دسترسی‌پذیری

بیاموزید چگونه کد Tailwind CSS تمیز، قابل نگهداری و بهینه بنویسید.

پیش‌نیازها

  • دانش پایه HTML و CSS – آشنایی با HTML و CSS مفید است، اما نیازی نیست که متخصص باشید.
  • آشنایی پایه با JavaScript – آشنایی با مبانی جاوا اسکریپت دنبال کردن مطالب را آسان‌تر می‌کند، اما مبتدیان نیز می‌توانند در حین آموزش یاد بگیرند.
  • آشنایی با React (اختیاری) – داشتن مقداری تجربه با React مفید است، اما هر پروژه شما را گام به گام در ادغام Tailwind CSS با React راهنمایی می‌کند.
  • یک ویرایشگر کد (VS Code توصیه می‌شود) – برای نوشتن و مدیریت فایل‌های پروژه خود به یک ویرایشگر متن مانند VS Code نیاز خواهید داشت.
  • دانش پایه Tailwind CSS توصیه می‌شود – اگرچه نیازی به تجربه قبلی با Tailwind CSS ندارید، اما داشتن درک اولیه از فریم‌ورک‌های CSS با رویکرد utility-first مفید است.

Tailwind CSS به طور کامل روش استایل‌دهی وب‌سایت‌ها را متحول کرده است و اکنون با انتشار Tailwind CSS 4، سریع‌تر، قدرتمندتر و کارآمدتر از همیشه شده است. اگر به دنبال پیشرو بودن و تسلط بر آخرین نسخه Tailwind هستید، این دوره دقیقاً همان چیزی است که به آن نیاز دارید.

در این دوره عملی، شما ضمن ساخت پنج پروژه واقعی با React، جدیدترین ویژگی‌های Tailwind CSS 4 را کشف و پیاده‌سازی خواهید کرد. به جای پرداختن صرف به تئوری، بر روی پروژه‌های عملی کار خواهید کرد که پتانسیل کامل این نسخه کاملاً جدید را به نمایش می‌گذارند. Tailwind CSS 4 بهبودهای قابل توجهی را معرفی می‌کند که عملکرد را افزایش داده، فرآیند توسعه را ساده‌تر کرده و انعطاف‌پذیری بیشتری برای ساخت کامپوننت‌های مدرن رابط کاربری ارائه می‌دهد. یاد خواهید گرفت که چگونه از این ویژگی‌ها به طور کامل برای ایجاد اپلیکیشن‌های وب خیره‌کننده، واکنش‌گرا و بسیار بهینه استفاده کنید.

هر پروژه در این دوره با دقت طراحی شده است تا قدرت و کارایی Tailwind CSS 4 را به نمایش بگذارد. شما یک بخش هیرو با قابلیت تغییر حالت روشن/تاریک، فرم‌های احراز هویت تعاملی، یک سیستم امتیازدهی 5 ستاره پویا، یک آکاردئون FAQ و یک اسلایدر روان با ترنزیشن‌ها را خواهید ساخت. این پروژه‌ها نه تنها به شما کمک می‌کنند تا بر Tailwind CSS 4 مسلط شوید، بلکه مهارت‌های React شما را نیز با ادغام بی‌درز این دو بهبود می‌بخشند.

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

در پایان این دوره، درک کاملی از نحوه استفاده از جدیدترین ویژگی‌های Tailwind CSS 4، نحوه استایل‌دهی کارآمدتر به اپلیکیشن‌های وب، و نحوه ساخت پروژه‌های شیک و حرفه‌ای با حداقل تلاش خواهید داشت. چه مبتدی باشید و چه یک توسعه‌دهنده باتجربه، این دوره پر از بینش‌های ارزشمند و دانش عملی است که به شما کمک می‌کند سریع‌تر و بهتر از همیشه طراحی کنید.

در این سفر هیجان‌انگیز به من بپیوندید و یکی از اولین کسانی باشید که با ساخت اپلیکیشن‌های وب زیبا و کاربردی، بر Tailwind CSS 4 مسلط می‌شود. بیایید شروع کنیم و مهارت‌های UI شما را به سطح بعدی برسانیم!

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

Introduction

  • مقدمه Introduction

دوره فشرده Tailwind CSS 4: ویژگی‌های جدید (اختیاری) Tailwind CSS 4 Crash Course: New Features (Optional)

  • نحوه نصب و استفاده از Tailwind CSS 4 How to Install and use Tailwind CSS 4

  • نصب و راه‌اندازی با Vite Installation & Setup with Vite

  • دایرکتیو @theme @theme Directive

  • دایرکتیو @utility @utility Directive

  • به‌روزرسانی‌های استایل پیش‌فرض Default Style Updates

  • شناسایی محتوا Content Detection

  • دایرکتیو @plugin @plugin Directive

  • کوئری‌های کانتینر Container Queries

  • APIهای تبدیل سه‌بعدی 3D Transform APIs

  • APIهای گرادیان Gradient APIs

  • سایه‌ها و حلقه‌ها Shadows & Rings

  • سایر ویژگی‌های جدید Other New Features

  • مهاجرت از نسخه ۳ به نسخه ۴ Migrating v3 - v4

پروژه - فرم‌های احراز هویت Project - Authentication Forms

  • پیش‌نمایش پروژه Project Preview

  • نصب و راه‌اندازی Installation & Setup

  • ساخت فرم‌های احراز هویت Building Authentication Forms

پروژه - آکاردئون پرسش‌های متداول (FAQ) Project - FAQ Accordion

  • پیش‌نمایش پروژه Project Preview

  • نصب و راه‌اندازی Installation & Setup

  • تنظیم هدر و کنترل‌های پرسش‌های متداول (FAQ) Setting Up the FAQ Header & Controls

  • پیاده‌سازی سوئیچ تم تاریک/روشن Implementing Dark/Light Theme Toggle

  • نمایش پرسش‌ها و پاسخ‌ها Displaying Questions & Answers

  • پیاده‌سازی قابلیت باز و بسته شدن Implementing Expand/Collapse Functionality

  • افزودن قابلیت ذخیره‌سازی محلی Adding Local Storage Functionality

پروژه - هدر وب‌سایت با سوئیچ تم تاریک/روشن Project - Website Header with Dark/Light Theme Toggle

  • پیش‌نمایش پروژه Project Preview

  • نصب و راه‌اندازی Installation & Setup

  • ایجاد سوئیچ تم تاریک/روشن Creating the Dark/Light Theme Toggle

  • طراحی عناصر بنر Designing the Banner Elements

  • نشان‌های فنری و ذخیره‌سازی محلی Bouncing Badges and Local Storage

پروژه - سیستم امتیازدهی ۵ ستاره Project - 5-Star Rating System

  • پیش‌نمایش پروژه Project Preview

  • نصب و راه‌اندازی Installation & Setup

  • ساخت سیستم امتیازدهی Building the Rating System

پروژه - اسلایدر تصاویر Project - Image Slider

  • ساخت اسلایدر تصاویر Building Image Slider

نمایش نظرات

آموزش Tailwind CSS 4: ساخت 5 پروژه وب با React و Tailwind
جزییات دوره
6 hours
33
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
163
4.6 از 5
دارد
دارد
دارد

https://donyad.com/d/0eb16d

جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Code And Create Code And Create

توسعه وب / طراحی وب 'کد و ایجاد' یک شرکت توسعه وب است که متشکل از توسعه دهندگان حرفه ای وب ، طراحان وب و مدرسان آنلاین باتجربه است. 'Code And Create' دوره های آموزشی آنلاین ایجاد می کند. بیشتر آنها پرفروش ترین ها در بستر Udemy هستند. ما در چندین فن آوری و زبان برنامه نویسی مانند HTML5 ، CSS3 ، SASS ، Bootstrap ، Material Design ، JavaScript ، ReactJS ، Angular ، VueJS ، NodeJS ، MongoDB ، PHP ، MySQL ، Python و موارد دیگر تخصص داریم ... "Code And Create" همچنین یک کانال YouTube به نام "Code And Create" را اجرا می کند ، جایی که ما محتوای آموزشی رایگان را در توسعه وب / طراحی / برنامه نویسی ایجاد می کنیم. ما از حضور در اینجا هیجان زده ایم و مشتاقیم دانش و تجربه خود را به اشتراک بگذاریم. مشتاقانه منتظر دیدن شما در دوره های ما هستیم.

George Lomidze George Lomidze

توسعه دهنده/طراح/معلم آنلاین

سلام،

من جورج هستم، یک برنامه‌نویس/طراح وب کامل، یکی از بنیانگذاران 'Code And Create' و نویسنده چندین کلاس در Skillshare.

من هیجان زده هستم که اینجا هستم و فرصتی برای کمک به مردم برای یادگیری یکی از جالب ترین و قدرتمندترین زمینه های امروزی دارم.

من تصمیم گرفتم دانش و تجربه خود را با جهان به اشتراک بگذارم و این دلیل اصلی حضور من در Skillshare است.

من در فناوری‌های زیر تخصص دارم: HTML، CSS، SASS، Bootstrap، JavaScript، jQuery، React، React Native، NodeJS، Git و موارد دیگر...

منتظر دیدار شما در کلاس‌هایم هستم و به شما کمک می‌کنم تا یک توسعه‌دهنده وب حرفه‌ای شوید.

Lasha Nozadze Lasha Nozadze

توسعه دهنده وب و نرم افزار بنیانگذار 'CodeAndCreate'. سلام من لاشا هستم! من یک توسعه دهنده / طراح وب کاملاً پشته و کاملاً پشته ، مهندس نرم افزار با چندین سال تجربه و نویسنده چندین دوره پرفروش در Udemy هستم. وقتی وارد برنامه نویسی شدم ، حدس زدم که زندگی جدیدی پیدا کرده ام و از آن احساس هیجان می کنم ، زیرا معتقدم برنامه نویسی یکی از داغ ترین زمینه ها در قرن 21 است. تجربه من در توسعه وب شامل فن آوری های زیر است ، مانند HTML5 ، CSS3 ، SASS ، Bootstrap ، JavaScript ، React ، Node.js ، PHP ، MySQL و موارد دیگر ... خوشحالم که به شما گفتم ، تدریس اشتیاق دیگر من شد. من بسیار سپاسگزار و هیجان زده هستم که فرصتی پیدا کردم تا دانش و تجربه خود را با شما در میان بگذارم. من یک شرکت توسعه وب ایجاد کرده ام ، به نام 'CodeAndCreate' ، با دوستم جورج. 'CodeAndCreate' شرکتی است که برای اهداف زیر عمل می کند: "دانش خود را برای بهتر کردن دنیا کدگذاری ، ایجاد و به اشتراک بگذارید!"