آموزش ساخت یک پخش کننده موسیقی با استفاده از HTML، CSS، جاوا اسکریپت
Making A Music Player Using HTML,CSS, JavaScript
سلام، این Nishant است و من معلم شما برای این کلاس خواهم بود.
برای طراحی یا توسعه وب، 3 فناوری ضروری وجود دارد، HTML، CSS، و جاوا اسکریپت.
هدف اصلی این کلاس این است که دانش خود را در مورد این 3 مورد استفاده کنید (فقط کمی مورد نیاز است!) و با ساختن یک سری پروژه های آموزشی و در عین حال سرگرم کننده که دقیقاً به شما نشان می دهد چگونه آنها کاملاً با هم کار می کنند آنها را عملی کنید. . کار بر روی پروژه ها و حل مشکلات یک راه عالی برای یادگیری است.
شروع فایل‌ها: https://github.com/nishant0811/MusicPLayer
پروژه ای که در این دوره خواهیم ساخت، یک پخش کننده موسیقی جاوا اسکریپت خواهد بود.
همه ابزارهای مورد نیاز برای دانلود رایگان هستند، من از موارد زیر استفاده خواهم کرد:
Atom: https://atom.io/
مرورگر وب کروم:
ما با ایجاد رابط کاربری با HTML شروع می کنیم. سپس با استفاده از CSS یک استایل را اعمال می کنیم.
سپس جاوا اسکریپت را اضافه می کنیم، اینجاست که جادوی واقعی اتفاق می افتد!
شما به مواردی مانند:
- ایجاد رابط های HTML
- یک ظاهر طراحی با Css
- ترکیب جاوا اسکریپت و پیوند دادن فایل های خارجی
- دستکاری DOM
- انجام محاسبات و ذخیره سازی در متغیرها
- آرایه های جاوا اسکریپت
- حلقه
- پخش کننده صوتی HTML5
- نحوه ایجاد عناصر سفارشی برای کنترل صدا
- تنظیم منبع صدا و تصویر به صورت پویا
- محاسبه مقدار عنصر پیشرفت HTML
- تابع تصادفی
- عملکرد کف
- چگونه کد خود را اشکال زدایی کنیم
- مخلوط کردن لیست پخش
- و خیلی بیشتر
بنابراین اگر به دنبال ادامه دادن و به کارگیری مهارت های خود با استفاده از پروژه های واقعی هستید، شما را در کلاس خواهم دید!
سلام،
پروژه شما این خواهد بود:
- پخش کننده موسیقی تدریس شده در کلاس را بسازید
- تصویر را دایره ای کنید و آن را در مرکز تراز کنید
- عنوان آهنگ را از راست حرکت دهید و آن را بالای کنترلرها قرار دهید
- عنوان باید فقط زمانی نشان داده شود که موسیقی پخش شود
- هنگام پخش موسیقی، تصویر باید بچرخد
من حدس می‌زنم همین باشد.
اگر قادر به انجام آن نیستید، مشکلی وجود ندارد، فقط به من اطلاع دهید. من یک سخنرانی در مورد آن خواهم داشت. فقط هر چیزی را که دوست دارید بسازید. منتظر پروژه های شما
هستیمدرس ها Lessons
-
جزئیات پروژه (بعدی چیست) Project Details (What's next)
-
HTML برای پروژه HTML For Project
-
پرونده پایان آهنگ Song Ending Case
-
عملکرد نوار پیشرفت Progress Bar Function
-
مبانی اصلی سازی DOM Basics of DOM mainpulation
-
توابع مکث را پخش کنید Play Pause Functions
-
توابع بعدی و قبلی Next And Previous Functions
-
عملکرد قطع و وصل کردن Mute And Shuffle Function
-
استایل دادن به صفحه Styling the Page
-
مقدمه Introduction
https://donyad.com/d/0ff3
Nishant Raj
بهترین نسخه از خودت باش
سلام، من Nishant هستم.
من یک دانشجوی کالج و یک توسعه دهنده وب آزاد هستم. من واقعا عاشق کدنویسی و آموزش هستم. من از کلاس 8 کدنویسی می کنم.
مهارت هایی که می دانم:
python
html
css
javascript
node.js
mongodb
c++
c
جاوا
امیدوارم بتوانم همه ابهامات شما را برطرف کنم و بتوانم دانش خود را به اشتراک بگذارم. بنابراین اجازه دهید در کلاس های من ببینیم.
بهترین ها!
متشکرم!
نمایش نظرات