آموزش ۱۵ پروژه وب کاربردی با HTML، CSS و جاوا اسکریپت - آخرین آپدیت

دانلود 15 Real-World Web Projects with HTML, CSS, and JavaScript

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

آموزش جامع HTML، CSS و جاوا اسکریپت: پروژه‌های عملی از پایه تا پیشرفته!

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

تسلط بر مبانی HTML و CSS

  • یادگیری سینتکس، معناشناسی و بهترین روش‌ها: نحو (Syntax)، معناشناسی (Semantics) و بهترین روش‌های کدنویسی HTML/CSS را بیاموزید تا صفحات وب بصری خیره‌کننده و واکنش‌گرا (Responsive) را از ابتدا بسازید.

ساخت اپلیکیشن‌های تعاملی با جاوا اسکریپت

  • افزودن پویایی به پروژه‌ها: از جاوا اسکریپت (JavaScript) برای ایجاد تعامل، مدیریت رویدادها (Event Handling) و ویژگی‌های داینامیک به پروژه‌های وب خود استفاده کنید.

توسعه انواع پروژه‌های فرانت‌اند

  • پروژه‌های متنوع و کاربردی: پروژه‌های مختلفی مانند بازی‌ها، فرم‌ها، پخش‌کننده‌های موسیقی و موارد دیگر بسازید و مهارت‌های عملی فرانت‌اند (Frontend) خود را به نمایش بگذارید.

افزایش اعتماد به نفس در توسعه فرانت‌اند

  • تمرین، توضیح و پشتیبانی: با تمرین مداوم، توضیحات جامع و پشتیبانی جامعه، با اطمینان کامل چالش‌های جدید توسعه وب را بپذیرید و پیشرفت کنید.

پیش‌نیازها

  • ویرایشگر متن (Text Editor)
  • مرورگر وب مدرن (Modern Web Browser)
  • درک اولیه از HTML، CSS و جاوا اسکریپت

به دوره «تسلط بر توسعه وب فرانت‌اند» خوش آمدید، جایی که با انجام پروژه‌های عملی، سفری هیجان‌انگیز را برای تبدیل شدن به یک توسعه‌دهنده فرانت‌اند ماهر آغاز خواهید کرد. این دوره با دقت طراحی شده است تا شما را از سطح مبتدی به پیشرفته برساند، در حالی که تجربه یادگیری را جذاب و کاربردی نگه می‌دارد.

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

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

اما ما به همین جا بسنده نمی‌کنیم. آماده باشید تا عضلات خلاقیت خود را به کار بگیرید، زیرا به دنیای اسلایدرها (Sliders)، فرم‌ها (Forms) و ابزارک‌های تعاملی (Interactive Widgets) وارد می‌شویم. چه در حال طراحی یک وبلاگ شخصی باشید و چه یک سایت تجارت الکترونیک، این مهارت‌ها در ساخت رابط‌های کاربری کاربرپسند که مخاطبان شما را مجذوب و خوشحال می‌کند، بی‌قیمت خواهند بود.

و چه کسی گفته که یادگیری نمی‌تواند سرگرم‌کننده باشد؟ آماده باشید تا خود را با پروژه‌های هیجان‌انگیزی مانند بازی‌های پازل و بازی‌های حافظه به چالش بکشید. از طریق این بازی‌ها، شما نه تنها مهارت‌های کدنویسی خود را تقویت می‌کنید، بلکه مفاهیم مهمی مانند مدیریت رویدادها (Event Handling)، دستکاری DOM (DOM Manipulation) و منطق بازی (Game Logic) را نیز فرا خواهید گرفت.

اما صبر کنید، هنوز بیشتر است! آیا تا به حال خواسته‌اید برنامه یادداشت‌برداری یا پخش‌کننده موسیقی خود را بسازید؟ اکنون فرصت شماست! دوره ما شما را در فرآیند ایجاد این برنامه‌های کاربردی راهنمایی می‌کند و به شما می‌آموزد که چگونه داده‌ها را ذخیره و بازیابی کنید، فایل‌های صوتی را پخش کنید و طرح‌بندی‌های واکنش‌گرا (Responsive Layouts) ایجاد کنید که با اندازه‌های مختلف صفحه نمایش سازگار باشند.

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

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

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

بیایید شروع کنیم و رویاهای فرانت‌اند شما را به واقعیت تبدیل کنیم!


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

خوش آمدید Welcome

  • مقدمه Introduction

  • راه‌اندازی Setup

پروژه - فرم تماس متحرک Project - Animated Contact Form

  • فرم تماس متحرک Animated Contact Form

پروژه - گالری با افکت‌های هاور Project - Gallery with Hover Effects

  • ساخت گالری با افکت‌های هاور Building Gallery with Hover Effects

پروژه - اسلایدر ویدئو Project - Video Slider

  • اسلایدر ویدئو Video Slider

پروژه - ناوبری با منوی همبرگری Project - Navigation with Hamburger Menu

  • ساخت ناوبری با منوی همبرگری Building Navigation with Hamburger Menu

پروژه - فرم ثبت‌نام Project - Signup Form

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

  • ایجاد نشانه‌گذاری HTML Creating the HTML Markup

  • استایل‌دهی فرم ثبت‌نام Styling Signup Form

  • افزودن جاوااسکریپت به پروژه Adding JavaScript to the Project

پروژه - گالری الهام‌گرفته از Awwwards Project - Awwwards-Inspired Gallery

  • ساخت گالری الهام‌گرفته از Awwwards Building Awwwards-Inspired Gallery

پروژه - نوار ناوبری Project - Navbar

  • ساخت نوار ناوبری Building Navbar

پروژه - پخش‌کننده موسیقی Spotify Project - Spotify Music Player

  • ایجاد نشانه‌گذاری HTML Creating the HTML Markup

  • استایل‌دهی پخش‌کننده موسیقی Styling Music Player

  • فعال کردن پخش‌کننده با جاوااسکریپت Making Player Work with JavaScript

پروژه - کارت تجارت الکترونیک Project - Ecommerce Card

  • کارت تجارت الکترونیک Ecommerce Card

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

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

  • ایجاد نشانه‌گذاری HTML و داده‌های افراد Creating the HTML Markup and Persons Data

  • نمایش محتوا Displaying Content

  • افزودن CSS به اسلایدر Adding CSS to the Slider

  • فعال کردن اسلایدر - بخش ۱ Making Slider Work - Part 1

  • فعال کردن اسلایدر - بخش ۲ Making Slider Work - Part 2

پروژه - گالری Project - Gallery

  • ساخت گالری Building Gallery

پروژه - بازی پازل Project - Puzzle Game

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

  • نشانه‌گذاری HTML و راه‌اندازی اولیه HTML Markup and Basic Setup

  • استایل‌دهی پازل Styling Puzzle

  • ایجاد و نمایش خانه‌های پازل Creating and Displaying Puzzle Cells

  • کشیدن و رها کردن و امتیازها Drag and Drop and Points

  • افزودن قابلیت به پازل Adding Functionality to Puzzle

پروژه - ناوبری با افکت‌های هاور Project - Navigation with Hover Effects

  • ساخت ناوبری با افکت‌های هاور Building Navigation with Hover Effects

پروژه - گالری Project - Gallery

  • ساخت گالری Building Gallery

پروژه - بازی حافظه Project - Memory Game

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

  • نشانه‌گذاری HTML و راه‌اندازی اولیه HTML Markup and Basic Setup

  • استایل‌دهی پروژه Styling Project

  • ایجاد کلاس‌ها Creating Classes

  • ایجاد کارت‌ها و نمایش آیکون‌ها Creating Cards and Displaying Icons

  • فعال کردن بازی Making Game Work

بونوس Bonus

  • درس بونوس Bonus Lecture

نمایش نظرات

آموزش ۱۵ پروژه وب کاربردی با HTML، CSS و جاوا اسکریپت
جزییات دوره
13.5 hours
38
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
279
4.7 از 5
دارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

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' شرکتی است که برای اهداف زیر عمل می کند: "دانش خود را برای بهتر کردن دنیا کدگذاری ، ایجاد و به اشتراک بگذارید!"