آموزش جاوا اسکریپت برای کودکان: بازی ها و برنامه های خود را در هر سنی کدنویسی کنید

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

معرفی جاوا اسکریپت Intro to JavaScript

• 1-1 مقدمه ای بر جاوا اسکریپت 1-1 Introduction to JavaScript

• 1-2 عبارات، متغیرها، اعداد و رشته ها 1-2 Expressions, variables, numbers and strings

• 1-3 برای حلقه ها و چاپ با console.log() 1-3 For loops and printing with console.log()

• 1-4 پیام های بازشو و ورودی 1-4 Popup messages and input

• 1-5 مشکل چالش - SayMyName 1-5 Challenge problem - SayMyName

• 1-6 راه حل چالش 1-6 Challenge Solution

• تمام نمونه کدهای دوره را دانلود و از حالت فشرده خارج کنید Download and unzip all code samples for the course

یک بازی حدس زدن پاپ آپ Hi-Lo ایجاد کنید Create a Popup Hi-Lo Guessing Game

• 2-1 ایجاد یک بازی حدس زدن پاپ آپ Hi-Lo 2-1 Creating a Popup Hi-Lo Guessing Game

• 2-2 اضافه کردن شرایط، خیلی زیاد، خیلی کم 2-2 Adding conditions, too high, too low

• 2-3 افزودن حلقه ها - حلقه های while و do-while 2-3 Adding loops - while and do-while loops

• 2-4 تمرین مرور و چالش - برنده را جشن بگیرید! 2-4 Review and Challenge Exercise – Celebrate the Winner!

• راه حل چالش 2-5 - برنده را جشن بگیرید! 2-5 Challenge Solution - Celebrate the winner!

مقدمه ای بر HTML Intro to HTML

• 3-1 مقدمه ای بر HTML - بازرسی و ویرایش 3-1 Intro to HTML – Inspecting and Editing

• 3-2 نوشتن HTML در Atom 3-2 Writing HTML in Atom

• 3-3 Document Object Model – DOM، دکمه ها و کلاس ها 3-3 Document Object Model – DOM, buttons, and classes

• 3-4 تمرین مرور و چالش 3-4 Review and Challenge Exercise

• 3-5 راه حل چالش 3-5 Challenge Solution

طراحی یک بازی حدس زدن HTML! Design an HTML Guessing Game!

• 4-1 طراحی یک بازی حدس زدن HTML 4-1 Designing an HTML Guessing Game

• 4-2 اتصال فرم به کد جاوا اسکریپت 4-2 Connecting the Form to the JavaScript Code

• 4-3 بهبود رابط کاربری و newGame() 4-3 Improving the User Interface, and newGame()

• 4-4 تمرینات مرور و چالش 4-4 Review and Challenge Exercises

• 4-5 راه حل - شمارش حدس ها، و جدول امتیازات 4-5 Solutions - Counting guesses, and Scoreboard

طراحی روی بوم HTML5 Drawing on the HTML5 Canvas

• 5-1 مقدمه HTML5 Canvas 5-1 Intro to HTML5 Canvas

• 5-2 روی Draw کلیک کنید 5-2 ClickDraw

• 5-3 بکشید و بکشید 5-3 Drag and Draw

• 5-4 تمرینات مرور و چالش 5-4 Review and Challenge Exercises

• 5-5 راه حل - رشد و کوچک شدن، مستطیل ها 5-5 Solution - Grow and Shrink, Rectangles

یک ماشین حساب پس انداز و برنامه داستان خنده دار MadLibs بسازید Build a Savings Calculator and MadLibs Funny Story App

• 6-1 فرم و جدول ماشین حساب پس انداز 6-1 Savings Calculator Form and Table

• 6-2 محاسبه و ذخیره مقادیر 6-2 Calculating and Storing Values

• 6-3 اشکال زدایی برنامه ها در کنسول مرورگر 6-3 Debugging Programs in the Browser Console

• 6-4 چالش بررسی و برنامه نویسی 6-4 Review and Programming Challenge

• 6-5 راه حل - FunnyStory.html 6-5 Solution - FunnyStory.html

از توابع برای ترسیم نمودار میله ای در جاوا اسکریپت بر روی بوم HTML5 استفاده کنید Use Functions to Draw a Bar Chart in JavaScript on the HTML5 Canvas

• 7-1 ترسیم نمودار میله ای در بوم 7-1 Drawing a Bar Chart in Canvas

• 7-2 تمرین مرور و چالش 7-2 Review and Challenge Exercise

• 7-3 راه حل - برچسب ها را به نمودار میله ای اضافه کنید 7-3 Solution - Add labels to the Bar Chart

BouncyDraw - کلاس ها و برنامه شی گرا در جاوا اسکریپت BouncyDraw - Classes and Object-Oriented Program in JavaScript

• 8-1 BouncyDraw - کلاس ها و برنامه شی گرا در جاوا اسکریپت 8-1 BouncyDraw - Classes and Object-Oriented Program in JavaScript

• 8-2 انیمیشن در جاوا اسکریپت با تایمر SetInterval 8-2 Animation in JavaScript with the SetInterval timer

• 8-3 تکمیل برنامه BouncyDraw 8-3 Completing the BouncyDraw App

• 8-4 کلاس های مرور، آرایه ها، انیمیشن و تمرین های چالشی 8-4 Review Classes, Arrays, Animation & Challenge Exercises

• 8-5 راه حل - اضافه کردن یک دکمه پاک و بدون توپ در پشت! 8-5 Solutions - Adding a Clear Button and No Ball Left Behind!

برنامه اضافی 1 - بازی کارت حافظه! Extra App 1 - Memory Card Game!

• 9-1 برنامه اضافی - بازی حافظه 9-1 Extra App - Memory Game

• 9-2 مراحل بعدی - سفارشی کردن بازی حافظه 9-2 Next Steps - Customizing the Memory Game

برنامه اضافی 2 - بازی ویدیویی مار! Extra App 2 - Snake Video Game!

• 10-1 برنامه اضافی 2 - بازی مار 10-1 Extra App 2 - Snake Game

• 10-2 مراحل بعدی - سفارشی کردن بازی Snake 10-2 Next Steps - Customizing the Snake Game