MakeFirstStep· Frontend + зеҳни сунъӣ

Курс · Frontend + зеҳни сунъӣ

Харитаи курс

24 дарс аз аввалин функсия то аввалин барномаи React. Дарсро дар харита интихоб кунед — дарсҳои дастрас фавран кушода мешаванд, боқиро пешакӣ дар барнома омӯхтан мумкин аст.

Оғоз: Дарси 1 · Оғози курс ва танзими муҳит

Модули 1 · Дарсҳои 1–6

Пойдевори JS

  1. Дарси 1Шумо инҷоед

    Оғози курс ва танзими муҳит

    Дастрас

    Муфассал
    Мавзӯъҳо
    JS дар браузер чӣ тавр кор мекунад, пайваст кардани script, консол, DevTools
    Малакаи зеҳни сунъӣ
    Харитаи абзорҳои зеҳни сунъӣ: чат, пуркунии худкор (Copilot), агент. Ҳар кадом чӣ карда метавонад ва дар куҷо хато мекунад
    Кори синфӣ
    Насб кардани VS Code, васеъшавиҳо ва GitHub Copilot; иҷрои аввалин скрипт; кор бо консол
    Вазифаи хонагӣ
    Муҳитро танзим карда, скриншот фиристед; 5 вазифа оид ба console.log, prompt, alert
    Натиҷа
    Муҳити кории омода
    Кушодани дарс →
  2. Дарси 2

    Тағйирёбандаҳо, намудҳои маълумот, табдили намуд

    Дастрас

    Муфассал
    Мавзӯъҳо
    let/const, string, number, boolean, null, undefined, typeof, табдили возеҳ ва ғайривозеҳи намуд
    Малакаи зеҳни сунъӣ
    Анатомияи промпт: контекст → вазифа → маҳдудиятҳо → формати ҷавоб. Қолаби шахсии промпт
    Кори синфӣ
    15 вазифаи хурд оид ба намудҳо; хатоҳоро дар ҷавобҳои зеҳни сунъӣ меҷӯем
    Вазифаи хонагӣ
    10 вазифа; аз зеҳни сунъӣ хоҳиш кунед, 3-тоашро шарҳ диҳад ва нависед, ки дар куҷо хато кардааст
    Натиҷа
    tasks-02.js + конспект оид ба промптҳо
    Кушодани дарс →
  3. Дарси 3

    Шартҳо ва мантиқ

    Дастрас

    Муфассал
    Мавзӯъҳо
    Операторҳои муқоиса, == ва ===, &&, ||, !, if/else, оператори сегона, switch
    Малакаи зеҳни сунъӣ
    GitHub Copilot дар VS Code: пуркунии худкор, Tab, inline chat. Дар куҷо кӯмак мекунад ва дар куҷо ба омӯзиш халал мерасонад
    Кори синфӣ
    Калкулятори консолӣ; вазифаҳои мантиқӣ бо Copilot-и фаъол ва ғайрифаъол
    Вазифаи хонагӣ
    Калкулятор, муайянкунандаи соли кабиса, табдилдиҳандаи асъор
    Натиҷа
    3 барномаи консолӣ
    Кушодани дарс →
  4. Дарси 4

    Даврҳо

    Дастрас

    Муфассал
    Мавзӯъҳо
    for, while, do..while, for..of, break, continue, даврҳои дарунҷойгир
    Малакаи зеҳни сунъӣ
    Чӣ тавр аз зеҳни сунъӣ хоҳиш кардан, ки коди бегонаро сатр ба сатр шарҳ диҳад; усули «мисли навомӯз шарҳ деҳ»
    Кори синфӣ
    FizzBuzz, ҷадвали зарб, ададҳои сода, эҳроми аломатҳо
    Вазифаи хонагӣ
    8 вазифа оид ба даврҳо + таҳлили як ҳалли бегона бо зеҳни сунъӣ
    Натиҷа
    loops.js
    Кушодани дарс →
  5. Дарси 5

    Функсияҳо

    Дастрас

    Муфассал
    Мавзӯъҳо
    Declaration ва expression, функсияҳои тирчадор, параметрҳои пешфарз, return, ҳудуди эътибор
    Малакаи зеҳни сунъӣ
    Рефакторинг бо зеҳни сунъӣ: аз ӯ 3 варианти як функсияро металабем ва беҳтаринро аз рӯи меъёрҳо интихоб мекунем
    Кори синфӣ
    6 функсия менависем, баъд онҳоро бо зеҳни сунъӣ рефакторинг карда, натиҷаҳоро муқоиса мекунем
    Вазифаи хонагӣ
    Китобхонаи хурд аз 8 функсияи худӣ бо шарҳҳо
    Натиҷа
    utils.js — китобхонаи шахсии функсияҳо
    Кушодани дарс →
  6. Дарси 6Кори назоратии №1

    Массивҳо ва методҳои массив + кори назоратии №1

    Дастрас

    Муфассал
    Мавзӯъҳо
    Массивҳо, push/pop/splice/slice, map, filter, reduce, find, some, every, sort
    Малакаи зеҳни сунъӣ
    Тавлиди маълумоти санҷишӣ бо зеҳни сунъӣ (100 объект) ва санҷиши дурустии онҳо
    Кори синфӣ
    Таҳлили массиви фармоишҳо: ҷамъ, чеки миёна, топ-5, филтрҳо
    Вазифаи хонагӣ
    10 вазифа оид ба методҳои массив
    Натиҷа
    Кори назоратии №1 (30 дақиқа, бе зеҳни сунъӣ) + analytics.js
    Кушодани дарс →

Модули 2 · Дарсҳои 7–12

DOM ва интерфейс

  1. Дарси 7

    Объектҳо ва JSON

    Дастрас

    Муфассал
    Мавзӯъҳо
    Объектҳо, дарунҷойгирӣ, методҳо, this (асосӣ), деструктуризатсия, spread/rest, JSON.parse/stringify
    Малакаи зеҳни сунъӣ
    Таҳлили JSON-и ношинос бо зеҳни сунъӣ: схемаи майдонҳо ва намудҳоро металабем ва бо маълумоти воқеӣ месанҷем
    Кори синфӣ
    Феҳристи маҳсулот ҳамчун массиви объектҳо: интихоб ва гурӯҳбандӣ
    Вазифаи хонагӣ
    JSON-и хомро ба сохтори қулай табдил диҳед + 5 интихоб
    Натиҷа
    data-model.js
    Кушодани дарс →
  2. Дарси 8

    DOM: ҷустуҷӯ ва тағйири элементҳо

    Дастрас

    Муфассал
    Мавзӯъҳо
    querySelector, textContent, innerHTML, classList, атрибутҳо, createElement, append, remove
    Малакаи зеҳни сунъӣ
    Тақсимоти кор: зеҳни сунъӣ разметка ва услубҳоро менависад, ту — мантиқро. Промпт барои қолаби HTML
    Кори синфӣ
    Аз массив кортаҳои маҳсулотро месозем ва дар саҳифа нишон медиҳем
    Вазифаи хонагӣ
    Нишон додани рӯйхат аз ҳадди аққал 10 корта + тугмаи тозакунӣ
    Натиҷа
    Саҳифае, ки бо JS ҷамъ карда шудааст
    Кушодани дарс →
  3. Дарси 9

    Рӯйдодҳо

    Дастрас

    Муфассал
    Мавзӯъҳо
    addEventListener, объекти рӯйдод, target ва currentTarget, preventDefault, боло баромадани рӯйдод (bubbling), делегатсия
    Малакаи зеҳни сунъӣ
    Чӣ тавр хатогиро барои зеҳни сунъӣ тасвир кардан: мисоли хурдтарин, натиҷаи интизоршуда ва воқеӣ
    Кори синфӣ
    Рӯйхат бо тугмаҳои «ҳазф» ва «дӯстдошта» тавассути делегатсия
    Вазифаи хонагӣ
    Рӯйхати интерактивӣ: илова, ҳазф, филтр бо тугмаҳо
    Натиҷа
    Компоненти интерактивӣ
    Кушодани дарс →
  4. Дарси 10

    Формаҳо ва санҷиши майдонҳо

    Дастрас

    Муфассал
    Мавзӯъҳо
    Формаҳо, input, submit, value, checked, санҷиши майдонҳо, намоиши хатогиҳо, FormData
    Малакаи зеҳни сунъӣ
    Тавлиди қоидаҳои санҷиш ва ифодаҳои регулярӣ тавассути зеҳни сунъӣ + санҷиш бо мисолҳои худӣ
    Кори синфӣ
    Формаи бақайдгирӣ бо санҷиши зинда
    Вазифаи хонагӣ
    Формаи 6 майдона бо санҷиши пурра ва матнҳои фаҳмои хатогиҳо
    Натиҷа
    Формаи бақайдгирӣ
    Кушодани дарс →
  5. Дарси 11

    Ҳолати барнома ва localStorage

    Дастрас

    Муфассал
    Мавзӯъҳо
    Ҳолат дар як объект, рендер аз рӯи ҳолат, localStorage, JSON, коркарди маълумоти холӣ
    Малакаи зеҳни сунъӣ
    Промпт барои меъморӣ: аз зеҳни сунъӣ сохтори ҳолатро пешниҳод кардан мехоҳем ва бо сохтори худамон муқоиса мекунем
    Кори синфӣ
    Нигоҳдорӣ ва барқарорсозии рӯйхат баъди аз нав бор кардани саҳифа
    Вазифаи хонагӣ
    Ба лоиҳаи дарси 9 нигоҳдории ҳолатро илова кунед
    Натиҷа
    Барнома бо нигоҳдории маълумот
    Кушодани дарс →
  6. Дарси 12Лоиҳаи хурд

    Лоиҳаи хурди №1 — ҷамъоварӣ ва ҳимоя

    Дастрас

    Муфассал
    Мавзӯъҳо
    Тамоми модул: DOM, рӯйдодҳо, формаҳо, localStorage, сохтори код
    Малакаи зеҳни сунъӣ
    Декомпозитсияи лоиҳа бо зеҳни сунъӣ: идеяро ба 10–15 вазифа тақсим кардан ва вақтро баҳо додан
    Кори синфӣ
    Такмили лоиҳа дар синф, code review дар ҷуфтҳо, ҳимоя
    Вазифаи хонагӣ
    Лоиҳаро аз рӯи шарҳҳо такмил диҳед ва ба GitHub бор кунед
    Натиҷа
    Лоиҳаи хурди 1: трекери вазифаҳо ё одатҳо (0–100)
    Кушодани дарс →

Модули 3 · Дарсҳои 13–18

Async ва API

  1. Дарси 13

    JavaScript-и ғайрисинхронӣ

    Дастрас

    Муфассал
    Мавзӯъҳо
    Синхронӣ ва ғайрисинхронӣ, setTimeout, callback, Promise, then/catch, async/await, event loop
    Малакаи зеҳни сунъӣ
    Аз зеҳни сунъӣ мепурсем, event loop-ро бо нақша ва мисол фаҳмонад, баъд фаҳмониши ӯро бо код месанҷем
    Кори синфӣ
    Тақлиди боркунии маълумот бо таъхир, занҷири promise-ҳо
    Вазифаи хонагӣ
    6 вазифа оид ба promise-ҳо ва async/await
    Натиҷа
    async-basics.js
    Кушодани дарс →
  2. Дарси 14

    fetch ва HTTP

    Дастрас

    Муфассал
    Мавзӯъҳо
    Усулҳои HTTP, рамзҳои ҳолат, сарлавҳаҳо, fetch, response.json(), try/catch, хатогиҳои шабака
    Малакаи зеҳни сунъӣ
    Тавлиди wrapper барои fetch бо зеҳни сунъӣ ва санҷиши дастии он бо ҷавобҳои хато
    Кори синфӣ
    Аввалин дархост ба API-и ҷамъиятӣ, нишон додани маълумот дар консол ва саҳифа
    Вазифаи хонагӣ
    Маълумотро аз 2 API-и гуногун гирифта, нишон диҳед
    Натиҷа
    api.js — wrapper-и худӣ барои fetch
    Кушодани дарс →
  3. Дарси 15

    Кор бо API-и воқеӣ

    Дастрас

    Муфассал
    Мавзӯъҳо
    Рендери рӯйхат аз API, ҷустуҷӯ, филтркунӣ, саҳифабандӣ, параметрҳои дархост
    Малакаи зеҳни сунъӣ
    Хондани ҳуҷҷатҳои API ҳамроҳи зеҳни сунъӣ: чӣ тавр зуд endpoint ва параметрҳои заруриро ёфтан
    Кори синфӣ
    Рӯйхат бо ҷустуҷӯ аз рӯи API: филмҳо, обу ҳаво ё криптовалютаҳо
    Вазифаи хонагӣ
    Ба барномаи худ ҷустуҷӯ ва саҳифабандӣ илова кунед
    Натиҷа
    Барномаи корӣ бар пояи API
    Кушодани дарс →
  4. Дарси 16Намоиш: Cursor

    Ҳолатҳои боркунӣ, хатогӣ, debounce

    Дастрас

    Муфассал
    Мавзӯъҳо
    Ҳолатҳои loading / empty / error, skeleton, debounce, AbortController
    Малакаи зеҳни сунъӣ
    Намоиши муаллим: Cursor — чӣ тавр агенти зеҳни сунъӣ кодро якбора дар якчанд файли лоиҳа тағйир медиҳад
    Кори синфӣ
    Се ҳолат ва debounce-ро ба барнома илова мекунем
    Вазифаи хонагӣ
    UX-и барномаро такмил диҳед: боркунӣ, натиҷаи холӣ, хатои шабака
    Натиҷа
    Барнома бо ҳолатҳои дуруст
    Кушодани дарс →
  5. Дарси 17Намоиш: Claude Code

    Модулҳо, npm ва ҷамъбасти Vite

    Дастрас

    Муфассал
    Мавзӯъҳо
    import/export, сохтори ҷузвдонҳо, package.json, скриптҳои npm, сохтани лоиҳа бо Vite
    Малакаи зеҳни сунъӣ
    Намоиши муаллим: Claude Code — гузоштани вазифа дар терминал ва таҳлили натиҷа
    Кори синфӣ
    Лоиҳаи дарси 16-ро ба Vite мебарем ва ба модулҳо тақсим мекунем
    Вазифаи хонагӣ
    Барномаи худро ба Vite ва модулҳо гузаронед ва ба репозиторий бор кунед
    Натиҷа
    Лоиҳаи Vite бо сохтори модулӣ
    Кушодани дарс →
  6. Дарси 18Лоиҳаи хурдКори назоратии №2

    Лоиҳаи хурди №2 — ҳимоя + кори назоратии №2

    Дастрас

    Муфассал
    Мавзӯъҳо
    Тамоми модул: async/await, fetch, ҳолатҳо, модулҳо, ҷамъбаст
    Малакаи зеҳни сунъӣ
    Таҳлил: дар куҷо зеҳни сунъӣ дар лоиҳа ба таври воқеӣ вақтро сарфа кард ва дар куҷо ба роҳи хато бурд
    Кори синфӣ
    Ҳимояи лоиҳа, таҳлили коди дигарон, фикру мулоҳиза
    Вазифаи хонагӣ
    Такмили лоиҳа аз рӯи шарҳҳо
    Натиҷа
    Лоиҳаи хурди 2 (0–100) + кори назоратӣ бе зеҳни сунъӣ
    Кушодани дарс →

Модули 4 · Дарсҳои 19–21

Абзорҳо ва марҳалаи ниҳоӣ

  1. Дарси 19

    Git ва GitHub + ислоҳи хатогиҳои код

    Дастрас

    Муфассал
    Мавзӯъҳо
    Шохаҳо, commit, push, pull request, merge, низоъҳо, .gitignore; try/catch, DevTools: breakpoints, Console, Network
    Малакаи зеҳни сунъӣ
    Тавлиди паёмҳои commit ва тавсифи PR бо зеҳни сунъӣ + промпти дурусти хатогӣ: мисоли хурдтарини такроршаванда ба ҷои «кор намекунад»
    Кори синфӣ
    Кор дар ҷуфтҳо: шоха → PR → баррасӣ → merge; се хатои андохташударо дар лоиҳаи ёр меёбем ва ислоҳ мекунем
    Вазифаи хонагӣ
    Репозиторийро оро диҳед: шохаҳо, 10+ commit-и бомаъно, README; се хаторо ёфта ислоҳ кунед, сабаби ҳар якро шарҳ диҳед
    Натиҷа
    Репозиторийи тоза бо таърих + ҳисобот оид ба хатогиҳо
    Кушодани дарс →
  2. Дарси 20

    Коди тоза, рефакторинг ва деплой

    Дастрас

    Муфассал
    Мавзӯъҳо
    Номгузорӣ, функсияҳои хурд, DRY, бозгашти барвақт, ҷудо кардани мантиқ аз намоиш; ҷамъбасти Vite, тағйирёбандаҳои муҳит, деплой ба Vercel / GitHub Pages
    Малакаи зеҳни сунъӣ
    Баррасии зеҳни сунъӣ дар коди худ аз рӯи чек-лист: кадом маслиҳатҳоро қабул кардан ва кадомро не + тавлиди README ва матн барои портфолио
    Кори синфӣ
    Рефакторинги лоиҳаи ҳамсоя аз рӯи чек-листи умумӣ, баъд деплойи ҳамаи лоиҳаҳои гурӯҳ
    Вазифаи хонагӣ
    Лоиҳаи хурди 2-ро рефакторинг кунед, 2 лоиҳаро деплой кунед, README-ро оро диҳед, истинодҳоро фиристед
    Натиҷа
    Чек-листи сифати код + истинодҳои зинда ба лоиҳаҳо
    Кушодани дарс →
  3. Дарси 21Лоиҳаи ниҳоӣ

    Лоиҳаи ниҳоӣ — ҳимоя + блоки касбӣ

    Дастрас

    Муфассал
    Мавзӯъҳо
    Таҳлили ҷамъбастии мавзӯъҳои курс, машваратҳои инфиродӣ оид ба меъморӣ
    Малакаи зеҳни сунъӣ
    Шпаргалкаи шахсии промптҳо: ҳар кас 10 промпти кории худро ҷамъ мекунад (варақи «Шпаргалкаи промптҳо») + резюме ва профили GitHub бо ёрии зеҳни сунъӣ
    Кори синфӣ
    Ҳимояи лоиҳаҳои ниҳоӣ, фикру мулоҳиза, таҳлили ҳалли дигарон
    Вазифаи хонагӣ
    Истинод ба лоиҳаи деплойшударо фиристед + ҳимояи 5-дақиқагиро омода кунед
    Натиҷа
    Лоиҳаи ҳимоёфта бо JS, портфолио, баҳо + шпаргалкаи шахсии промптҳо
    Кушодани дарс →

Модули 5 · Дарсҳои 22–24

React Lite (бонус)

  1. Дарси 22Бонус

    React: барои чӣ лозим аст. Vite + JSX + аввалин компонент

    Дастрас

    Муфассал
    Мавзӯъҳо
    Маҳдудиятҳои DOM-и дастӣ, тафаккури компонентӣ, npm create vite, JSX ва HTML, App.jsx, export/import-и компонентҳо
    Малакаи зеҳни сунъӣ
    Аз зеҳни сунъӣ мехоҳем блоки шиносои JS-ро ба компоненти React табдил диҳад ва тафовутро сатр ба сатр шарҳ медиҳем
    Кори синфӣ
    Лоиҳаи React-ро бо Vite месозем ва саҳифаи тайёрро ба 3–4 компонент ҷудо мекунем
    Вазифаи хонагӣ
    Саҳифаи худро аз 5 компоненти React ҷамъ кунед
    Натиҷа
    Аввалин лоиҳаи React + Vite
    Кушодани дарс →
  2. Дарси 23Бонус

    Props, рӯйхатҳо ва keys, useState

    Дастрас

    Муфассал
    Мавзӯъҳо
    props ва children, .map() ва keys, useState, коркардкунандагони рӯйдод, рендери шартӣ
    Малакаи зеҳни сунъӣ
    Зеҳни сунъӣ хатогиҳои React-ро шарҳ медиҳад: чаро ҳолат навсозӣ намешавад ва key барои чӣ лозим аст — дар коди худамон месанҷем
    Кори синфӣ
    Рӯйхати кортаҳо аз массив тавассути props + ҳисобкунак / like бо useState
    Вазифаи хонагӣ
    Todo-рӯйхат бо React: илова, ҳазф, қайд ҳамчун иҷрошуда
    Натиҷа
    Компоненти интерактивӣ бо useState + рӯйхат тавассути .map()
    Кушодани дарс →
  3. Дарси 24Бонус

    useEffect + fetch: барномаи хурд бо React + харитаи роҳ

    Дастрас

    Муфассал
    Мавзӯъҳо
    useEffect, боркунии маълумот аз API, ҳолатҳои loading / error, ҷустуҷӯ ва филтркунӣ; мухтасар — Next.js ва компонентҳои сервер минбаъд чӣ медиҳанд
    Малакаи зеҳни сунъӣ
    Чӣ тавр промпт барои компоненти React таҳия кардан: props, ҳолат, ҳолатҳои канорӣ — бо амалисозии дастӣ муқоиса мекунем
    Кори синфӣ
    Барномаи API-и дарсҳои 15–16-ро ба React мегузаронем, натиҷаҳои курс, таҳлили харитаи роҳ
    Вазифаи хонагӣ
    Барномаи React-ро бар пояи API анҷом диҳед, ба GitHub бор кунед + нақшаи омодагӣ ба Сатҳи 3
    Натиҷа
    Барномаи хурд бо React ва fetch + харитаи роҳ ба Сатҳи 3 (React Pro + Next.js)
    Кушодани дарс →

Марра

Сатҳи 3 — React Pro + Next.js

Курс дар ин ҷо ба анҷом мерасад — ва гуфтугӯи ҷиддӣ дар бораи касб оғоз мешавад.