دوره آموزش طراحی سایت

دوره طراحی سایت چه خبره؟

این دوره عملاً چند تا دوره رو تو یه دوره جا داده! توی این دوره شما قراره HTML, CSS, JavaScript, Tailwind , jQuery و Flex رو به‌طور کامل یاد بگیرید و ۴ تا پروژه کامل رو هم انجام بدید. یعنی همه چیز از پایه تا پیشرفته توی یه پکیج جمع شده.

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

شک دارید که شدنی باشه؟ خب، باید بگم که این دوره رو قبلاً دانشجوهای زیادی گذروندن و پروژه‌های فوق‌العاده‌ای انجام دادن. اصلاً هم ملاک اینکه کسی قبلاً رشته کامپیوتر خونده باشه یا تجربه خاصی داشته باشه نیست! خیلی از بچه‌ها بدون هیچ پیش‌زمینه‌ای توی این دوره شرکت کردن و کارهای خیلی عالی ارائه دادن.

اگه شک دارید، حتماً یه سری به پروژه‌های دانشجویی بزنید و خودتون ببینید! این دوره جوری طراحی شده که همه می‌تونن ازش استفاده کنن و موفق بشن.

توی دوره طراحی سایت چه چیزهایی یاد می‌گیرید؟

این دوره پر از مهارت‌های کاربردیه که تو مسیر طراحی سایت به کارتون میاد.

حالا بریم سراغ جزئیات:

بخش اول: شما با HTML و CSS به‌طور کامل آشنا می‌شید. قراره صفحه اصلی تحلیل داده رو با این دو ابزار پیاده‌سازی کنید.

بخش دوم: نوبت به آموزش ریسپانسیو کردن سایت‌ها می‌رسه، که سایت‌تون توی هر دستگاهی، چه موبایل چه دسکتاپ، به‌خوبی نمایش داده بشه. برای آشنایی بیشتر با این موضوع می‌تونید بلاگ "ریسپانسیو چیست؟" رو بخونید.

بخش سوم: حالا به یه چالش جذاب‌تر می‌رسیم؛ پیاده‌سازی تم قدیم و جدید دیجی‌کالا به عنوان پروژه نهایی شما! اینجاست که دیگه حرفه‌ای شدن خودتون رو نشون می‌دید.

بخش چهارم: تو این قسمت، پروژه جذاب شمرون کباب رو با AJAX و Web API می‌زنید و با JavaScript صفحات داینامیک می‌سازید. اینجا به جایی می‌رسید که می‌تونید از صفر تا صد یه قالب سایت رو طراحی کنید.

حالا که پایه‌های طراحی رو یاد گرفتید، JavaScript رو به‌صورت کامل بررسی می‌کنیم. شما دستورات کامل جاوا اسکریپت رو یاد می‌گیرید. یه پروژه ادیتور با جاوا اسکریپت می‌زنید. یاد می‌گیرید چطوری داده‌ها رو اعتبارسنجی کنید. با مفاهیم unobtrusive و data- کار می‌کنید. با JSON و شی‌گرایی آشنا می‌شید و کلی کارای دیگه...

بعدش نوبت می‌رسه به یه آشنایی اولیه با بک‌اند: نصب و کار با SQL، ساخت جدول و دیتابیس محصولات. مفاهیم Web API و نوشتن اون و نهایتاً طراحی سبد خرید و کار با Local Storage برای ذخیره داده‌ها. تا اینجا دیگه کاملاً مسلط می‌شید به طراحی سایت و آماده‌اید که پروژه‌های بزرگ‌تری رو به چالش بکشید!

من HTML و CSS بلدم، آیا دوره طراحی سایت برای من مناسبه؟

خیلی از دوستان زنگ می‌زنن و می‌پرسن: "ما HTML و CSS بلدیم، آیا این دوره به درد ما می‌خوره یا نه؟" جواب کوتاه اینه: بله، حتماً!

اینکه فقط تگ‌های HTML و CSS رو بشناسید، به این معنی نیست که شما کاملاً به طراحی سایت مسلطید. ساخت یه صفحه ساده هم لزوماً نشون نمی‌ده که حرفه‌ای هستید. کسی که واقعاً بلده، می‌تونه با ابزارهایی مثل Flexbox و Grid، از صفر تا صد یه سایت رو بدون هیچ دغدغه‌ای طراحی کنه. مثلاً صفحه اصلی دیجی‌کالا رو با خیال راحت پیاده کنه.

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

ما علاوه بر آموزش‌های اصلی، یه عالمه منابع رایگان هم به شما می‌دیم؛ منابعی که معمولاً تو دوره‌های دیگه به‌صورت جداگونه و با هزینه عرضه می‌شن. خیالتون راحت باشه، این روش کاملاً ثابت شده‌ست و نتیجه 23 سال تجربه ما در زمینه آموزشه.

یه مشکل بزرگ اکثر دانشجوها اینه که نمی‌تونن پروژه‌های کامل رو اجرا کنن. ما تو این دوره مفصل به این موضوع پرداختیم و مطمئن می‌شیم که شما پروژه‌های واقعی و کامل رو با تسلط انجام بدین.

پروژه طراحی صفحه اصلی دیجی‌کالا

• طراحی منوی دیجی‌کالا
• مروری مختصر بر اصول طراحی Responsive (از جلسات قبل)
• طراحی قالب‌های موردنیاز برای صفحه اصلی سایت دیجی‌کالا
• طراحی Header سایت و جانمایی تک‌تک عناصر مانند لوگو، باکس جستجو و باکس ورود و ثبت‌نام
• یادآوری مفهوم Ajax و نوشتن Web Api برای انجام عمل جستجو با تکنولوژی .Net
• تمرین بوت کمپ: طراحی خلاصه سبد موجود در بالای صفحات دیجی کالا توسط دانشجویان
• طراحی Effect بازشونده برای نتیجه ی جستجوی سریع و نمایش نتایج با استفاده از ترکیب Web Api, Ajax, JavaScript, Css, Html
• Responsive سازی Header دیجی کالا با استفاده از تکنولوژی Flex

جلسه طراحی منوی دیجی‌کالا

• طراحی منوی دیجی‌کالا در دو حالت دسکتاپ و موبایل
• یادآوری مباحث Float و عناصر Before و After در CSS
• یادآوری مباحث CSS Transition
• طراحی لایه اول منو به صورت غیر Responsive
• طراحی لایه دوم منو با استفاده از تکنولوژی Flex و قابلیت های Flex Positioning
• طراحی منو در حالت Responsive به صورت همبرگری (Hamburger Menu)

جلسه پیاده‌سازی ماژول پیشنهاد ویژه و تب‌های هوشمند

• طراحی ماژول پیشنهاد ویژه
• یادآوری از مباحث Timer در جاوا اسکریپت
• یادآوری سریع از مباحث Unobtrusive در جاوا اسکریپت
• پیاده‌سازی Tab Component بدون استفاده از Tailwind برای صفحه اول
• افزودن Timer برای تغییر اتوماتیک تب‌ها در صفحه اول

پیاده‌سازی بخش محصولات سایت دیجی‌کالا

• آموزش نحوه استفاده از Owl Carousel در طراحی سایت
• پیاده‌سازی بخش محصولات به‌صورت Responsive

طراحی اسلایدر بالای سایت دیجی‌کالا

• یادآوری کامپوننت اسلایدر در Tailwind
• تنظیم پارامترهای Responsive برای اسلایدر

پیاده سازی برند های ویژه

طراحی بخش "شرط فروش" سایت دیجی کالا

مقدمات و مفاهیم پایه‌ای جاوا اسکریپت

• آموزش پروژه‌محور زبان جاوا اسکریپت از سطح پایه تا متوسط
• ایجاد تسلط کامل بر مفاهیم عمومی جاوا اسکریپت و ساخت/تغییر DOM
• طراحی رابط کاربری پروژه شمرون کباب شامل بخش‌های زیر:
• طراحی هدر و منو: شامل لوگو، نوار جستجو و منوی ناوبری
• طراحی بدنه سایت: شامل بنرها، پیشنهادات ویژه و سایر بخش‌ها
• نمایش محصولات: همراه با جزئیات هر محصول به‌صورت جداگانه
• ایجاد سبد خرید: با قابلیت افزودن، حذف و ویرایش تعداد محصولات

ساخت و مدیریت بانک اطلاعاتی و جداول

• نصب و پیکربندی بانک اطلاعاتی SQL Server
• آشنایی با مفاهیم Table، Record، Row، Column و Field
• طراحی پایگاه داده فروشگاه شمرون کباب با تمرکز بر موارد زیر:
• ایجاد جداول برای محصولات، دسته‌بندی‌ها، سفارشات، کاربران و سایر اطلاعات ضروری
• اتصال پایگاه داده SQL Server به پروژه
• استفاده از رویکرد Code-First با Entity Framework در پروژه ASP.NET Core

آموزش ساخت بک‌اند (Web API)

• آموزش پروژه‌محور ساخت Web API برای فروشگاه اینترنتی
• برطرف کردن چالش درک مفاهیم بک‌اند برای طراحان فرانت‌اند و نزدیک شدن به برنامه‌نویس فول‌استک
• پیاده‌سازی Web API در مراحل زیر انجام می‌شود:
• تعریف مدل‌ها (Models): ایجاد فایل‌های مدل برای کلاس‌های دیتابیس
• ساخت کنترلرها (Controllers): پیاده‌سازی عملیات CRUD برای هر مدل
• ایجاد API برای محصولات: شامل ایجاد، خواندن، بروزرسانی و حذف اطلاعات محصول

آموزش Ajax و مفاهیم آن

• تسلط بر مفاهیم برنامه‌نویسی ناهمزمان با استفاده از Ajax در پروژه‌های فرانت‌اند
• فراخوانی APIهای فروشگاه الکترونیکی با استفاده از Ajax
• برنامه‌نویسی بخش محصولات و سبد خرید به‌صورت داینامیک و متصل به API
• ایجاد درخواست Ajax برای ارسال و دریافت داده‌ها از سرور

پیاده‌سازی قابلیت‌های سبد خرید

• افزودن محصولات به سبد خرید
• ایجاد قابلیت افزایش و کاهش تعداد محصولات
• نمایش محصولات انتخاب‌شده در سبد خرید
• محاسبه و نمایش مجموع قیمت محصولات
• ایجاد دکمه‌های پرداخت و ادامه خرید همراه با هدایت به صفحات مربوطه