دوره جامع و پیشرفته تیلویند

آموزش پروژه محور TailwindCSS با هدف توسعه سریع و بهینه ui/ux ارائه شده است. پروژه دوره بر اساس ui/ux کامل انجام داده میشه.

۱۲:۱۳:۰۰
۶۷ جلسه
۱۴۹۸ دانشجو
۵  از  ۱۳  رای
روش دریافت: اسپات پلیر
تاریخ انتشار :۱۴۰۱/۱۲/۱۴
آخرین بروزرسانی:۱۴۰۳/۱/۳۰
پشتیبانی: دائمی تلگرام

توضیحات دوره

آموزش پروژه محور TailwindCSS با هدف توسعه سریع و بهینه ui/ux ارائه شده است. پروژه دوره بر اساس ui/ux کامل انجام داده میشه.

تیلویند چیست ؟

آمارهای گیت هاب و سایت npmtrends نشان میده که بازارکار فریمورک tailwindCSS در یک مقیاس جهانی رو به پیشرفت هست. به نحوی که در یک سال گذشته از دانلود هفتگی600 هزار به 2.6 میلیون دانلود هفتگی رسیده. تیلویند (TailwindCSS) یک فریمورک برای توسعه رابط کاربری (فرانت اند) است. از جمله مزیت های تیلویند افزایش سرعت توسعه برنامه ها، قابلیت شخصی سازی بالا و هم چنین سرعت بالای سایت با کمترین حجم CSS نهایی هست که همین باعث شده از زمان انتشار (سال 2019) تا به الان (اوایل 2022) طرفداران زیادی را پیدا کند.

سازوکار تیلویند به چه صوررت هست؟

سازوکار تیلویند با همه فریمورک های توسعه رابط کاربری که تا به الان باهاش کار کردین، کاملا متفاوت هست. چون قرار نیست تیلویند (TailwindCSS) کامپوننت های آماده ای به شما بدهد و اتفاقا این ویژگی فوق العاده تیلویند، باعث شده که تیلویند رو منحصر بفرد بکنه. تیلویند با همان مفاهیم پایه ای CSS مثل فلکس، گرید، پدینگ و... کار میکنه و در واقع مبتی بر ایده utility-first هست. به این معنی که با کلاس های آماده برای تمام ویژگی های CSS فرآیند استایل دهی را خیلی ساده تر میکند.

نحوه استفاده از کلاس های آماده تیلویند به چه صورت هست؟

ایده اصلی تیلویند این هست که شما با خارج نشدن از فایل HTML، کلاس های آماده CSS که تیلویند در اختیار ما قرار مید هد را استفاده کنیم. در واقع تا حد خیلی زیادی ما نیاز به فایل های CSS. در برنامه نداریم. درست حدس زدین! دیگر نیازی نیست کلی زمان و انرژی صرف نام گذاری کلاس های CSS بکنید. مثلا قبل مجبور بودیم بر اساس قانون BEM اسم کلاس هایی شبیه btn btn—primary و... ایجاد بکنیم. اما دیگر نیازی به کلاس های این مدلی نخواهیم داشت! حتی برای ایجاد مدیا کوئری ها، حالت های hover, focus, active شما در همان فایل HTML میتوانید کد مدنظرتان را بنویسید.

تیلویند رسپانسیو هست یا نه ؟

اتفاقا یکی از مزیت های بشدت جذاب تیلویند همینه و میتونم بگم برای همیشه از مشکلات رسپانسیو سازی خداحافظی کنید. در واقع استایل دهی بر اساس mobile-first هست. یعنی از پیاده سازی UI در سایز گوشی موبایل شروع میکنیم و با مدیا کوئری های داخلی که خود تیلویند در اختیار ما قرار میده در سایز تبلت و دسکتاپ هم، استایل و چینش جدید را ایجاد میکنیم.

چرا موجب افزایش سرعت در فاز توسعه و تولید می شود؟

بله دقیقا، تیلونید (TailwindCSS) هم برای من و شما برنامه نویس زمان زیادی رو ذخیره میکنه تا در کمترین زمان ممکن پروژه رو توسعه بدهیم. در واقع همین که نگران رسپانسیو سازی نیستید، مشکلات اسم گذاری کلاس های CSS را ندارید، خیالتان از بابت استایل های تکراری راحت هست و در عین حال همه چی کاملا شخصی سازی هست، سرعت بشدت بالایی ایجاد میکنه. اما نکته جذاب تر اینه که در سایت شما با کمترین حجم CSS ممکن (حدود 7-8 کیلوبایت) کاملا بی نقص ایجاد میشه. همین سایت فرانت هوکس با tailwindCSS توسعه داده شده و حجم کل کد های CSS حدود 6.7 کیلوبایت هست. این حجم خیلی ناچیز سرعت سایت را به شدت بالا می برد و در بحث SEO و تجربه کاربری بشدت تاثیر گذار هست.

چرا تیلویند بازارکار رو به رشدی دارد؟

طراحی های رابط کاربری به سمت مینیمال شدن رفتن. استارتاپ های معتبری مثل دیجی کالا، اسنپ، تپسی، پی پینگ، زرین پال و... دیزاین سیستم خاص خودشون را دارند. به نحوی که همه چی کاملا مینیمال و شخصی سازی شده هست. انتخاب تیلویند به دلیل قدرت بالا در شخصی سازی در کنار این همه ویژگی های جذابش، طرفداران زیادی را پیدا کرده ست.

چرا این دوره حرفه ای ترین دوره ایران نام گذاری شده است؟

قرار نیست شما در این دوره صرفا داکینومنت سایت تیلویند رو با من بخونید و صرفا در حد تئوری با هم کار کنیم! خیر اتفاقا کاملا بر عکس. تنها راه اینه که پروژه واقعی و پیچیده پیاده سازی بشه. در هیچ کدام از دوره های ایرانی و حتی خارج کشور، همچین پروژه گسترده ای پیاده سازی نشده است. در واقع پروژه اصلی دوره ابتدا توسط متخصص ui/ux پیاده سازی شده است. فایل نهایی در فیگما و زپلین به شما ارائه میشود و در طی دوره بر اساس همین فایل های آماده شده صفر تا صد پروژه را با هم پیش میبریم. البته برای نشان دادن قدرت تیلویند، چندین کامپوننت کاملا پیشرفته و داینامیک هم توسعه داده می شود که برای تسلط دانش شما، خیلی مفید خواهد بود.

صاحب، وجه تمایز دوره ت چیه ؟

یک پروژه کاملا واقعی بر اساس ui/ux از قبل آماده شده. در قسمت 'مشاهده آنلاین پروژه های دوره' در همین صفحه سایت، میتونید خروجی نهایی دوره را ببینید. البته باید بگم که مباحث پیشرفته تر مثل کار با پلاگین های تیلویند هم کاملا تدریس شده است.

آیا همین دوره تیلویند کافی خواهد بود؟

مطمین باشید که اولین و آخرین دوره تیلویندی هست که شرکت خواهید کرد. تمرین ها و پروژه های این دوره فرآیند یادگیری شما را تکمیل می کند. دوره حرفه ای Tailwind کاملا متفاوت هست، به نحوی که شما رو به بازار کار می رساند، به شرطی که شما هم همت کنید و همراه من باشید.

برای پشتیبانی چه برنامه ای داری؟

این دوره پشتیبانی منحصربفرد دارد. پشتیبانی به صورت گروه های ویژه تلگرامی هست و فقط خودم جوابگوی هر گونه سوال و ابهام شما چه در مسائل فنی و چه در پروسه استخدامی و رزومه سازی هستم.

بخاطر مبلغ دوره، نمیخواهم در این دوره شرکت نمایم. پیشنهاد شما چیست؟

به دست آوردن هر چیزی بهایی دارد؛ خیلی از هزینه های زندگی به ما برنمیگرده اما شما توی این دوره روی ارتقاء کیفیت زندگی خودتان سرمایه گذاری می کنید. از امروز شروع کنید و روی رشد خودتان و مهارتتان سرمایه گذاری کنید. هر چیز ارزشمندی می‌خواهید به دست بیاورید باید ابتدا بهای آن را بپردازید.

جلسات دوره

۱معرفی کلی tailwindCSS
۱۰
دانلود ویدیو
۲نصب تیلویند به کمک tailwind-cli
۱۵
دانلود ویدیو
۳مینفایی کردن تیلویند در هنگام نصب با tailwind-cli
۴
۴مفاهیم اصلی در فریمورک تیلویند
۱۶
۵تیلویند چطوری کار میکند؟
۹
۶base and utilities directive
۹
۷component directive and extract styles
۱۰
۸container class in tailwind
۹
۹position and dispaly and tailwind
۷
۱۰flex properties
۱۵
۱۱flex parent properties
۱۰
۱۲grid and its properties
۱۴
۱۳an example of grid
۱۰
۱۴spacing
۱۵
۱۵sizing - border - colors
۱۶
۱drop down static
۱۳
دانلود ویدیو
۲drop down dynamic
۱۰
دانلود ویدیو
۳Radio group static
۱۰
۴Radio group dynamic
۱۱
۵disclosure static
۷
۶disclosure dynamic
۶
۷Tab static
۱۱
۸Tab dynamic
۶
۹dynamic header and content
۱۰
۱Digitize ui/ux
۱۵
دانلود ویدیو
۲setup app using postcss
۶
۳adding fonts to App
۱۲
۴mobile app bar section
۱۳
۵mobile filter sort bar section
۱۱
۶mobile products section
۱۹
۷product detail and image
۵
۸color group selection
۱۷
۹loop on products data
۱۳
۱۰products grid section
۱۲
۱۱desktop filter section
۱۰
۱۲desktop dynamic sort
۴
۱۳sidebar -1
۱۸
۱۴desktop sidebar filter section
۱۶
۱۵accodion on filter section
۷
۱۶improve accordion styles
۴
۱۷Navbar section
۱۱
۱۸search input in navbar
۷
۱۹fix container and styles
۱۵
۲۰fix sidebar sticky position
۱۰
۲۱bottom navigation
۱۰
۲۲dynamic bottom navigation
۲۰
۲۳improve bottom navigation
۴
۱mobile upper section
۷
دانلود ویدیو
۲color selection
۱۰
۳mobile seller detail
۷
۴desktop grid content
۷
۵product detail section
۱۳
۶product detail section 2
۲۲
۷cart summmary detail
۹
۸mini product image
۱۳
۱بررسی کلیات صفحه سبد خرید
۱۰
دانلود ویدیو
۲cart item -1
۱۷
۳cart item -2 - improvement
۵
۴cart items in desktop
۱۲
۵cart summary section
۹
۱dark mode -1
۹
دانلود ویدیو
۲dark mode -2
۷
۳dark mode -3
۱۵
۴form plugin -1
۷
۵form plugin -2
۱۱
۶typography plugin
۱۴
۷aspect ratio plugin
۱۷

سوالات متداول

بله در این دوره یک پروژه فروشگاهی کاملا رسپانسیو بر اساس ui/ux از قبل آماده با هم پیاده سازی می کنیم. این پروژه چندین صفحه متنوع با چالش های مختلف دارد که فرآیند یادگیری شما را تکمیل می کند.

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

تیلویند یکی از فریمورک هایی هست که قرار نیست UIآماده ای به ما بدهد. با همان مفاهیم پایه ای CSS در کمترین زمان ممکن با بهترین کیفیت و بهینه ترین حجم CSS پروژه قابل انجام هست. یک ترند جهانی هست و فرصت خوبی برای یادگیری این فریمورک هست.

بله، تمام دوره های فرانت هوکس پشتیبانی دارد و وجود یک مربی در سرعت یادگیری شما قطعا اثرگذار هست.

پیش نیاز این دوره فقط HTML CSS هست.

تیلویند یک فریمورک مدرن و ترند جهانی هست که در تمام پلتفرم ها مثل React.js, Vue.js, Angular قابل استفاده است. با یادگیری تیلویند سرعت زیاد توسعه و لذت پیاده سازی رابط کاربری را به صورت کاملا بهینه، تجربه خواهید کرد.

۵۹۸,۰۰۰
% ۳۰
۴۱۹,۰۰۰
صاحب محمدی

صاحب محمدی

مدرس دوره

داستان برنامه نویس شدن من برمیگرده به سال 93. همون موقع که برای پروژه های دانشگاه (رشته مهندسی نفت) برنامه نویسی میکردم. کم کم با MATLAB آشنا شدم و بعدا وارد حوزه برنامه نویسی وب شدم و الان حدود 7 ساله که شغل تخصصی من برنامه نویسی وب هست. علاقه من جاوااسکریپت و خاندانش است. به همین دلیل فرانت هوکس رو بنا کردم تا تجربه چند ساله رو در قالب دوره های پروژه محور به علاقه مندان این حوزه انتقال بدم ☘️🤍.

میتوانید دیدگاه خود را ثبت کنید