Мавзу 1: HTML ва CSS асослари (2 ҳафта)

1. HTMLнинг асосий теглари: <div>, <span>, <a>, <img>, <form>, ва ҳ.к.
2. HTML5 семантик теглари: <header>, <footer>, <article>, <section>, ва ҳ.к.
3. CSS асослари: селекторлар, класслар, идентификаторлар, каскадлилик, мерос олиш.
4. Flexbox ва Grid: мослашувчан ва адаптив макетлар яратиш.

Мавзу 2: JavaScript асослари (2 ҳафта)

Ҳафта 1: JavaScript синтаксининг асослари ва бошқарув конструкциялари

1. JavaScript синтаксининг асослари (3 кун)

1. Ўзгарувчилар ва маълумот турлари:
   • var, let, const
   • Примитив маълумот турлари: number, string, boolean, null, undefined, symbol
   • Мураккаб маълумот турлари: object, array, function
2. Операторлар:
   • Арифметик операторлар: +, -, *, /, %
   • Таққослаш операторлари: ==, ===, !=, !==, <, >, <=, >=
   • Мантиқий операторлар: &&, ||, !
   • Тенглик ва таъриф операторлари: =, +=, -=, ва ҳ.к.

2. Бошқарув конструкциялари (3 кун)

1. Шарт операторлари:
   • if, else if, else
   • Тернар оператор: ? :
2. Цикллар:
   • for
   • while
   • do...while
   • Массивлар ва объектлар билан for...in ва for...of

Ҳафта 2: JavaScript функциялари ва DOM билан ишлаш

3. Функциялар (3 кун)

1. Функцияларни эълон қилиш:
   • Оддий функциялар: function
   • Ифодали функциялар: const myFunction = function() {...}
   • Ўқ функциялари: const myArrowFunction = () => {...}
2. Функция параметрлари ва қайтариш қиймати:
   • Параметрларни бериш
   • Қайтариш қиймати: return
3. Замонавий функция хусусиятлари:
   • Ҳамёнига ҳар қандай сонидаги параметрларни олиш: ...rest
   • Мажбурий параметрлар ва стандарт қийматлар

4. DOM билан ишлаш асослари (4 кун)

1. Элементларни танлаш:
   • document.getElementById
   • document.querySelector ва document.querySelectorAll
2. Элементларни ўзгартириш:
   • Мазмунни ўзгартириш: textContent, innerHTML
   • Стилларни ўзгартириш: style
   • Атрибутлар билан ишлаш: setAttribute, getAttribute
3. Ҳодисаларни бошқариш:
   • Ҳодиса тингловчилар: addEventListener
   • Оддий ҳодисалар: click, mouseover, input, ва ҳ.к.
   • Ҳодисаларни бошқариш функциялари

Амалий вазифалар

Ҳафта 1:

1. Ўзгарувчилар ва операторлар:
   • Ёшни ҳисобловчи дастур яратиш: фойдаланувчининг туғилган йилини олиб, ҳозирги ёшини ҳисоблаш.
2. Шартлар ва цикллар:
   • Устунлар тўлиқ квадратлари билан массив яратиш.
   • Фойдаланувчи киритган сонлар орасида енг катта сонни топиш.

Ҳафта 2:

1. Функциялар:
   • Рақамларнинг факториалини ҳисобловчи функция яратиш.
   • Фойдаланувчининг исмини ва ёшини киритиш ва уларни қайтарувчи функция яратиш.
2. DOM билан ишлаш:
   • Веб-саҳифага тўғри келадиган текст майдони ва тугмани яратиш, тугма босилганда текстни ўзгартириш.
   • Ҳодисаларни бошқариш: чекбокслар билан ишлаш, қанча чекбокс белгиланганлигини кўрсатиш.

Мавзу 3: Vue 3 билан танишув (3 ҳафта)

1. Ўрнатиш ва созлаш:
   • Node.js ва npm ўрнатиш.
   • Vue CLI ўрнатиш ва янги Vue лойиҳасини яратиш.
   • Vue лойиҳасининг тузилиши.
2. Vue 3нинг асосий тушунчалари:
   • Оддий компонент яратиш.
   • Vue директивалари: v-bind, v-model, v-for, v-if, ва ҳ.к.
   • Реактивлик: маълумотлар ва усуллар, ўзгаришларни кузатиш.
   • Шаблонлар билан ишлаш ва маълумотлар боғланиши.

Мавзу 4: Vue 3 да компонентлар ўртасида ўзаро алоқа (2 ҳафта)

1. Компонентларни яратиш:
   • Компонентларни эълон қилиш ва рўйхатдан ўтказиш.
   • Пропслар орқали маълумотларни узатиш.
   • Чақириқ ҳодисаларини эмиссия қилиш ва болалар компонентларидан ҳодисаларни бошқариш.
2. Комплекс компонентлар ва слотлар:
   • Комплекс ва динамик компонентлар.
   • Слотлар билан ишлаш: асосий, номланган ва стандарт слотлар.

Мавзу 5: Vue Router билан ишлаш (2 ҳафта)

1. Vue Router ўрнатиш ва созлаш:
   • Маршрутлар ва маршрут компонентларини аниқлаш.
   • Динамик маршрутлар ва параметрли маршрутлар.
   • Дастурий навигация.

Мавзу 6: Vuex билан ҳолатни бошқариш (2 ҳафта)

1. Vuex ўрнатиш ва созлаш:
   • Vuexнинг асосий тушунчалари: ҳолат, геттерлар, мутациялар, ҳаракатлар.
2. Vuex модуллари ва улардан фойдаланиш.

Мавзу 7: Vue дастурларини тест қилиш (2 ҳафта)

1. Тест муҳитини созлаш.
2. Jest ва Vue Test Utils билан компонентларни модулли тест қилиш.
3. Маршрутлар ва Vuex тест қилиш.

Мавзу 8: Оптимизация ва диплой (2 ҳафта)

1. Ижро самарадорлигини оптимизация қилиш:
   • Компонентларни оқимли юклаш, кодни бўлиш.
2. Vue Devtoolsни созлаш ва фойдаланиш.
3. Vue дастурини турли платформаларга (Netlify, Vercel, ва ҳ.к.) диплой қилиш.

Манбалар ва амалий вазифалар

1. Манбалар:
   • Vue 3 расмий ҳужжатлари: https://v3.vuejs.org/
   • Китоблар: "Vue.js Up and Running" by Callum Macrae, "Fullstack Vue" by Hassan Djirdeh et al.
   • Онлайн курслар: Vue Mastery, Vue School.
2. Амалий вазифалар:
   • Оддий To-Do дастурини яратиш.
   • Vue Router ва Vuexдан фойдаланиб, SPA (Single Page Application) ишлаб чиқиш.
   • Тўлиқ функционалликка эга блог ёки интернет дўкони лойиҳасини амалга ошириш.