آموزش دوره Crash: ساخت یک برنامه وب کامل در یک آخر هفته!

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

خوش آمدید، خوش آمدید، خوش آمدید! Welcome, Welcome, Welcome!

• معرفی Introduction

• قبل از شروع بخوانید! Read Before You Start!

• مروری بر سطح بالا از توسعه وب A High-Level Overview of Web Development

• راه اندازی ویرایشگر کد ما Setting Up Our Code Editor

HTML - ساختن اسکلت برنامه [روز 1] HTML – Building the App Skeleton [DAY 1]

• HTML چیست؟ What is HTML?

• ساختار سند HTML HTML Document Structure

• کار با متن و لیست Working With Text and Lists

• هایپرلینک ها، تصاویر و ویژگی ها Hyperlinks, Images, and Attributes

• ساختار برنامه Structuring the App

• ساخت یک فرم Building a Form

• اضافه کردن دکمه های بیشتر Adding More Buttons

CSS - سبک دادن به برنامه [روز 1] CSS – Styling the App [DAY 1]

• CSS چیست؟ What is CSS?

• استایل دادن به متن Styling Text

• از جمله فونت های گوگل Including Google Fonts

• کار با رنگ Working With Color

• ارث و انتخاب کننده جهانی Inheritance and the Global Selector

• مدل جعبه CSS The CSS Box Model

• بلوک و عناصر درون خطی Block and Inline Elements

• ایجاد طرح‌بندی‌های کوچک با Flexbox Creating Small Layouts With Flexbox

• استفاده از Flexbox در حقایق ما Applying Flexbox to Our Facts

• ایجاد طرح بندی های بزرگتر با شبکه CSS Creating Larger Layouts With CSS Grid

• مرکز کردن برنامه Centering the App

• پیوندها و انتقالات یک ظاهر طراحی شده Styling Links and Transitions

• دکمه های یک ظاهر طراحی شده Styling Buttons

• مهارت توسعه دهنده: گوگل و خواندن اسناد Developer Skill: Googling and Reading Documentation

• حالت دادن به دکمه های رأی گیری Styling the Voting Buttons

• عناصر فرم یک ظاهر طراحی شده Styling Form Elements

• تطبیق چیدمان با صفحه نمایش های کوچکتر Adapting the Layout to Smaller Screens

Supabase - ذخیره داده های برنامه [روز 1] Supabase – Storing the App Data [DAY 1]

• Supabase چیست؟ What is Supabase?

• ایجاد اولین پایگاه داده شما Creating Your First Database

• ایجاد یک جدول Creating a Table

• افزودن سیاست های امنیتی Adding Security Policies

جاوا اسکریپت - تعاملی کردن برنامه [روز 1 + 2] JavaScript – Making the App Interactive [DAY 1 + 2]

• جاوا اسکریپت چیست؟ What is JavaScript?

• نمایش و پنهان کردن فرم Displaying and Hiding the Form

• مقادیر، متغیرها و اپراتورها Values, Variables, and Operators

• کارکرد Functions

• تصمیم گیری با اظهارات if/else Taking Decisions With if/else Statements

• اپراتور سه تایی The Ternary Operator

• کار با رشته ها Working With Strings

• توابع پیکان Arrow Functions

• آرایه ها Arrays

• اشیاء Objects

• Looping Over Arrays: The forEach and map Methods Looping Over Arrays: The forEach and map Methods

• DOM چیست؟ What is the DOM?

• بازگشت به اولین دستکاری DOM Going Back to the First DOM Manipulation

• ایجاد عناصر DOM Creating DOM Elements

• بارگیری داده ها با واکشی و همگام سازی/انتظار Loading Data With fetch and async/await

• فیلتر و روش های آرایه را پیدا کنید The filter and find Array Methods

React - ساختن برنامه نهایی [DAY 2] React – Building the Final App [DAY 2]

• React چیست؟ What is React?

• نصب Node.js و راه اندازی یک React Project Installing Node.js and Setting Up A React Project

• ملاقات با JSX و ایجاد مؤلفه برنامه Meeting JSX and Creating the App Component

• تقسیم رابط ما به اجزا Dividing Our Interface Into Components

• ارائه فهرست حقایق Rendering the List of Facts

• پاس و دریافت لوازم Passing and Receiving Props

• ارائه فهرست دسته بندی ها Rendering the List of Categories

• معرفی ایالت Introducing State

• نمایش و پنهان کردن فرم به روش React Displaying and Hiding the Form the React Way

• ایجاد کامپوننت هدر Creating the Header Component

• کار با Forms the React Way Working With Forms the React Way

• افزودن یک واقعیت جدید - قسمت 1 Adding a New Fact – Part 1

• افزودن یک واقعیت جدید - قسمت 2 Adding a New Fact – Part 2

• بارگیری داده ها از Supabase با useEffect Loading Data From Supabase with useEffect

• ایجاد کامپوننت لودر Creating a Loader Component

• فیلتر کردن بر اساس دسته بندی ها Filtering by Categories

• بارگذاری یک واقعیت در Supabase Uploading a Fact to Supabase

• رسیدگی به آرا و به روز رسانی یک واقعیت در Supabase Handling Votes and Updating a Fact on Supabase

استقرار - بارگذاری برنامه در اینترنت [DAY 2] Deployment – Uploading the App to the Internet [DAY 2]

• نمایش برنامه در همه تلفن های همراه Displaying The App on All Mobile Phones

• پایان کار و ایجاد یک ساختمان تولید Finishing Touches and Creating a Production Build

• در حال استقرار در Netlify Deploying to Netlify

پایان! The End!

• از اینجا کجا برویم Where to Go from Here

• پاداش: دوره های دیگر من را بررسی کنید! BONUS: Check Out My Other Courses!