chore(i18n): sync translations with latest source changes (chunk 1/1, 6 changes)

pull/1690/head
localizeflow[bot] 3 weeks ago
parent 80abf535cf
commit 9115689a31

@ -493,7 +493,7 @@
},
"AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-02-06T10:01:47+00:00",
"translation_date": "2026-02-06T11:57:24+00:00",
"source_file": "AGENTS.md",
"language_code": "bg"
},

@ -2,46 +2,46 @@
## Преглед на проекта
Това е учебен репозиторий за преподаване на основите на уеб разработката на начинаещи. Учебната програма е изчерпателен 12-седмичен курс, разработен от Microsoft Cloud Advocates, включващ 24 практически урока, обхващащи JavaScript, CSS и HTML.
Това е образователно хранилище за учебна програма за обучението на начинаещи по основи на уеб разработката. Учебната програма представлява изчерпателен курс от 12 седмици, разработен от Microsoft Cloud Advocates, с 24 практически урока, обхващащи JavaScript, CSS и HTML.
### Основни компоненти
- **Учебно съдържание**: 24 структурирани урока, организирани в проектно базирани модули
- **Практически проекти**: Террариум, Игра за писане, Разширение за браузър, Космическа игра, Банково приложение, Редактор на код и AI чат асистент
- **Интерактивни куизове**: 48 куиза с по 3 въпроса всеки (оценки преди и след урока)
- **Поддръжка на много езици**: Автоматични преводи за 50+ езика чрез GitHub Actions
- **Образователно съдържание**: 24 структурирани урока, организирани в проекти по модули
- **Практически проекти**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor и AI Chat Assistant
- **Интерактивни викторини**: 48 викторини с по 3 въпроса всяка (предварителни/следурочни оценки)
- **Поддръжка на множество езици**: Автоматизирани преводи за 50+ езика чрез GitHub Actions
- **Технологии**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (за AI проекти)
### Архитектура
- Учебен репозиторий със структура, базирана на уроци
- Всяка папка с урок съдържа README, кодови примери и решения
- Самостоятелни проекти в отделни директории (quiz-app, различни проектни уроци)
- Система за преводи чрез GitHub Actions (co-op-translator)
- Документация обслужвана чрез Docsify и налична като PDF
- Образователно хранилище със структура, базирана на уроци
- Всяка папка с урок съдържа README, кодови примери и решения
- Самостоятелни проекти в отделни директории (quiz-app, различни проектни уроци)
- Система за превод с помощта на GitHub Actions (co-op-translator)
- Документация, обслужвана чрез Docsify и достъпна като PDF
## Команди за настройка
Този репозиторий е основно за потребление на учебно съдържание. За работа с конкретни проекти:
Това хранилище е основно за консумация на образователно съдържание. За работа със специфични проекти:
### Настройка на основния репозиторий
### Основна настройка на хранилището
```bash
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners
```
### Настройка на Quiz App (Vue 3 + Vite)
```bash
cd quiz-app
npm install
npm run dev # Стартиране на сървър за разработка
npm run build # Компилиране за продукция
npm run build # Създаване за продукция
npm run lint # Стартиране на ESLint
```
### API за банкова проект (Node.js + Express)
### API на банков проект (Node.js + Express)
```bash
cd 7-bank-project/api
@ -50,58 +50,58 @@ npm start # Стартиране на API сървър
npm run lint # Стартиране на ESLint
npm run format # Форматиране с Prettier
```
### Проекти за разширения за браузър
### Проекти за браузър разширения
```bash
cd 5-browser-extension/solution
npm install
# Следвайте инструкциите за зареждане на разширения, специфични за браузъра
```
### Проекти за космическа игра
### Проекти за Space Game
```bash
cd 6-space-game/solution
npm install
# Отворете index.html в браузър или използвайте Live Server
```
### Чат проект (Python бекенд)
### Проект Chat (Python Backend)
```bash
cd 9-chat-project/solution/backend/python
pip install openai
# Задайте променливата на средата GITHUB_TOKEN
# Задайте променлива на средата GITHUB_TOKEN
python api.py
```
## Работен процес за разработка
### За съдържателите на учебното съдържание
## Работен процес на разработка
### За допринасящите съдържание
1. **Направете fork на репозитория** във вашия GitHub акаунт
2. **Клонирайте вашия fork** локално
3. **Създайте нов клон** за вашите промени
4. Направете промени в съдържанието на уроците или кодовите примери
5. Тествайте всички промени по кода в съответните проектни директории
6. Изпратете pull request следвайки указанията за допринасяне
1. **Направете форк на хранилището** в акаунта си в GitHub
2. **Клонирайте вашия форк** локално
3. **Създайте нов клон** за вашите промени
4. Направете промени в съдържанието на урока или кодовите примери
5. Тествайте всякакви кодови промени в съответните проектни директории
6. Изпратете Pull Request следвайки указанията за принос
### За учащите
1. Направете fork или клонирайте репозитория
2. Отидете към директорийте с уроци последователно
3. Прочетете README файловете за всеки урок
4. Попълнете куизове преди урока на https://ff-quizzes.netlify.app/web/
5. Работете с кодовите примери в папките на уроците
6. Изпълнете задания и предизвикателства
7. Попълнете куизове след урока
1. Направете форк или клонирайте хранилището
2. Навигирайте послойно в директориите с уроци
3. Прочетете README файловете за всеки урок
4. Попълнете предварителните викторини на https://ff-quizzes.netlify.app/web/
5. Работете с кодовите примери в папките с уроци
6. Изпълнете задачи и предизвикателства
7. Попълнете следурочните викторини
### Живо развитие
### Живо разработване
- **Документация**: Стартирайте `docsify serve` от основната директория (порт 3000)
- **Quiz App**: Стартирайте `npm run dev` в директорията quiz-app
- **Проекти**: Използвайте разширението VS Code Live Server за HTML проекти
- **Документация**: Стартирайте `docsify serve` в корена (порт 3000)
- **Quiz App**: Стартирайте `npm run dev` в директорията quiz-app
- **Проекти**: Използвайте разширението VS Code Live Server за HTML проекти
- **API Проекти**: Стартирайте `npm start` в съответните API директории
## Инструкции за тестване
@ -110,10 +110,10 @@ python api.py
```bash
cd quiz-app
npm run lint # Проверете за проблеми със стила на кода
npm run build # Потвърдете, че компилацията е успешна
npm run lint # Проверка за проблеми със стила на кода
npm run build # Проверка дали изграждането е успешно
```
### Тестване на Bank API
```bash
@ -121,162 +121,162 @@ cd 7-bank-project/api
npm run lint # Проверете за проблеми със стила на кода
node server.js # Проверете дали сървърът стартира без грешки
```
### Обща стратегия за тестване
- Това е учебен репозиторий без комплексни автоматизирани тестове
- Ръчното тестване се фокусира върху:
- Изпълнение на кодовите примери без грешки
- Коректна работа на линковете в документацията
- Успешното завършване на билдове на проектите
- Примери, следващи добри практики
### Общ подход към тестването
- Това е образователно хранилище без изчерпателни автоматизирани тестове
- Ръчното тестване се фокусира върху:
- Кодови примери, които се изпълняват без грешки
- Връзки в документацията работят правилно
- Проектите се изграждат успешно
- Примерите следват най-добрите практики
### Проверки преди изпращане
- Стартирайте `npm run lint` в директории с package.json
- Проверете дали markdown линковете са валидни
- Тествайте кодовите примери в браузър или Node.js
- Проверете дали преводите запазват коректната структура
- Стартирайте `npm run lint` в директории с package.json
- Проверете дали линковете в markdown са валидни
- Тествайте кодовите примери в браузър или Node.js
- Проверете дали преводите запазват правилната структура
## Насоки за стил на кода
### JavaScript
- Използвайте съвременен ES6+ синтаксис
- Следвайте стандартни ESLint конфигурации в проектите
- Използвайте смислени имена на променливи и функции за учебна яснота
- Добавяйте коментари с обяснения за учащите
- Форматирайте с Prettier, където е конфигурирано
- Използвайте съвременен синтаксис ES6+
- Следвайте стандартните ESLint конфигурации в проектите
- Използвайте смислени имена на променливи и функции за яснота при учене
- Добавяйте коментари, обясняващи концепциите за учащите
- Форматирайте с Prettier, където е конфигуриран
### HTML/CSS
- Семантични HTML5 елементи
- Принципи на адаптивен дизайн
- Ясни конвенции за именуване на класове
- Семантични HTML5 елементи
- Принципи на адаптивен дизайн
- Ясни конвенции за именуване на класове
- Коментари, обясняващи CSS техники за учащите
### Python
- Следвайте PEP 8 стилови насоки
- Ясни, образователни кодови примери
- Типови подсказки, където спомагат за обучението
- Насоки за стил PEP 8
- Ясни образователни кодови примери
- Типови указания, където са полезни за учене
### Markdown документация
- Ясна йерархия на заглавията
- Блокове с код с посочен език
- Линкове към допълнителни ресурси
- Скрийншоти и изображения в папки `images/`
- Alt текст за изображения за достъпност
- Ясна йерархия на заглавия
- Кодови блокове с определен език
- Линкове към допълнителни ресурси
- Екранни снимки и изображения в директории `images/`
- Алтернативен текст за изображения за достъпност
### Организация на файловете
- Уроците са номерирани последователно (1-getting-started-lessons, 2-js-basics и др.)
- Всеки проект има `solution/` и често `start/` или `your-work/` папки
- Изображения съхранявани в папки `images/` към съответния урок
- Преводите са в структура `translations/{код-на-езика}/`
- Уроците са номерирани последователно (1-getting-started-lessons, 2-js-basics и др.)
- Всеки проект има директории `solution/` и често `start/` или `your-work/`
- Изображенията са съхранени в папки `images/`, специфични за всеки урок
- Преводите са в структура `translations/{language-code}/`
## Създаване и деплоймент
## Изграждане и разгръщане
### Деплой на Quiz App (Azure Static Web Apps)
### Разгръщане на Quiz App (Azure Static Web Apps)
quiz-app е конфигуриран за деплой на Azure Static Web Apps:
quiz-app е конфигуриран за разгръщане в Azure Static Web Apps:
```bash
cd quiz-app
npm run build # Създава папка dist/
# Извършва разгръщане чрез GitHub Actions workflow при push към main
# Публикува чрез GitHub Actions workflow при натискане към main
```
Конфигурация на Azure Static Web Apps:
- **Място на приложението**: `/quiz-app`
- **Изходна папка**: `dist`
- **Работен поток**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
Конфигурация на Azure Static Web Apps:
- **Местоположение на приложението**: `/quiz-app`
- **Местоположение на изхода**: `dist`
- **Работен процес**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Генериране на PDF документация
```bash
npm install # Инсталирайте docsify-to-pdf
npm run convert # Генерирайте PDF от docs
npm run convert # Генериране на PDF от документи
```
### Docsify документация
### Документация Docsify
```bash
npm install -g docsify-cli # Инсталирайте Docsify глобално
docsify serve # Сервирайте на localhost:3000
docsify serve # Стартирайте на localhost:3000
```
### Проекти със специфичен билд
Всяка проектна директория може да има собствен процес на билд:
- Vue проекти: `npm run build` създава продукционни пакети
- Статични проекти: Няма стъпка за билд, обслужват се директно файловете
### Изграждане, специфично за проект
Всяка проектна директория може да има собствен процес на изграждане:
- Vue проекти: `npm run build` създава продукционни пакети
- Статични проекти: Няма стъпка за изграждане, файловете се обслужват директно
## Насоки за Pull Request-и
## Насоки за Pull Request
### Формат на заглавието
Използвайте ясни, описателни заглавия показващи зоната на промяна:
- `[Quiz-app] Добавяне на нов куиз за урок X`
- `[Lesson-3] Корекция на печатна грешка в проекта terrarium`
- `[Translation] Добавяне на испански превод за урок 5`
- `[Docs] Актуализиране на инструкциите за настройка`
Използвайте ясни, описателни заглавия, указващи областта на промяна:
- `[Quiz-app] Добавяне на нова викторина за урок X`
- `[Lesson-3] Поправка на печатна грешка в проекта terrarium`
- `[Translation] Добавяне на испански превод за урок 5`
- `[Docs] Актуализиране на инструкции за настройка`
### Задължителни проверки
Преди изпращане на PR:
Преди изпращане на PR:
1. **Качество на кода**:
- Стартирайте `npm run lint` в засегнатите проектни директории
- Поправете всички грешки и предупреждения
1. **Качество на кода**:
- Стартирайте `npm run lint` в засегнатите проектни директории
- Поправете всички грешки и предупреждения
2. **Проверка на билд**:
- Стартирайте `npm run build` ако е приложимо
- Уверете се, че няма грешки при билд
2. **Проверка на изграждането**:
- Стартирайте `npm run build` ако е приложимо
- Осигурете, че няма грешки при изграждане
3. **Валидиране на линкове**:
- Тествайте всички markdown линкове
- Уверете се, че референциите към изображенията са валидни
3. **Проверка на линкове**:
- Тествайте всички markdown линкове
- Проверете работата на препратките към изображения
4. **Преглед на съдържанието**:
- Проверкa за правопис и граматика
- Уверете се, че кодовите примери са правилни и образователни
- Проверете преводите за съхранен оригинален смисъл
4. **Преглед на съдържанието**:
- Проверкa за правопис и граматика
- Осигурете, че кодовите примери са правилни и образователни
- Проверете дали преводите запазват оригиналния смисъл
### Изисквания за принос
- Съгласие с Microsoft CLA (автоматична проверка при първи PR)
- Спазване на [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Вижте [CONTRIBUTING.md](./CONTRIBUTING.md) за подробни насоки
- Позоваване на номера на issue в описанието на PR, ако е приложимо
- Съгласие с Microsoft CLA (автоматична проверка при първия PR)
- Спазвайте [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Вижте [CONTRIBUTING.md](./CONTRIBUTING.md) за подробни насоки
- Посочвайте номера на проблеми в описанието на PR, ако е приложимо
### Процес на преглед
- PR-ове преглеждани от поддържащите и общността
- Приоритизиране на образователната яснота
- Кодови примери трябва да следват текущи добри практики
- Преводи преглеждани за точност и културна уместност
- PR се преглеждат от поддръжници и общността
- Приоритет се дава на образователна яснота
- Кодови примери трябва да следват актуални най-добри практики
- Преводите се преглеждат за точност и културна съобразност
## Система за превод
### Автоматизиран превод
### Автоматичен превод
- Използва GitHub Actions с co-op-translator workflow
- Автоматично превежда на 50+ езика
- Изходни файлове в основните директории
- Преводни файлове в `translations/{код-на-езика}/` директории
- Използва GitHub Actions с workflow co-op-translator
- Автоматичен превод на 50+ езика
- Източникови файлове в основните директории
- Преведените файлове са в директории `translations/{language-code}/`
### Добавяне на ръчни подобрения на превода
### Добавяне на ръчни подобрения на преводи
1. Намерете файл в `translations/{код-на-езика}/`
2. Направете подобрения като запазвате структурата
3. Уверете се, че кодовите примери остават функционални
4. Тествайте всяко локализирано куиз съдържание
1. Намерете файл в `translations/{language-code}/`
2. Направете подобрения, запазвайки структурата
3. Осигурете функционалността на кодовите примери
4. Тествайте локализирано покритие на викторините
### Метаданни за превода
### Преводни метаданни
Преведените файлове включват метаданни:
Преведените файлове съдържат метаданни в заглавната част:
```markdown
<!--
CO_OP_TRANSLATOR_METADATA:
@ -288,121 +288,121 @@ CO_OP_TRANSLATOR_METADATA:
}
-->
```
## Отстраняване на грешки и проблеми
### Често срещани проблеми
### Чести проблеми
**Quiz app не стартира**:
- Проверете версията на Node.js (препоръчително v14+)
- Изтрийте `node_modules` и `package-lock.json`, стартирайте отново `npm install`
- Проверете за конфликт на портове (по подразбиране: Vite използва порт 5173)
**Quiz app не стартира**:
- Проверете версия на Node.js (препоръчва се v14+)
- Изтрийте `node_modules` и `package-lock.json`, пуснете отново `npm install`
- Проверете за конфликти на портове (по подразбиране Vite използва порт 5173)
**API сървърът не стартира**:
- Уверете се, че версията на Node.js е минимум (node >=10)
- Проверете дали портът вече не е зает
**Сървърът за API не стартира**:
- Проверете дали версията на Node.js е минимум (node >=10)
- Проверете дали портът не е вече зает
- Осигурете всички зависимости с `npm install`
**Разширението за браузър не се зарежда**:
- Проверете дали manifest.json е коректно форматиран
- Проверете конзолата на браузъра за грешки
- Следвайте специфичните инструкции за инсталиране на разширения за браузър
**Разширението за браузър не се зарежда**:
- Проверете дали manifest.json е правилно форматиран
- Проверете конзолата на браузъра за грешки
- Следвайте инструкции за инсталиране на разширения, специфични за браузър
**Проблеми с чат проект на Python**:
- Уверете се, че пакетът OpenAI е инсталиран: `pip install openai`
- Проверете дали променливата на средата GITHUB_TOKEN е зададена
- Проверете разрешения за достъп до GitHub Models
**Проблеми с Python чат проект**:
- Проверете дали OpenAI пакетът е инсталиран: `pip install openai`
- Проверете дали променливата на средата GITHUB_TOKEN е зададена
- Проверете разрешенията за достъп до GitHub Models
**Docsify не обслужва документацията**:
- Инсталирайте docsify-cli глобално: `npm install -g docsify-cli`
- Стартирайте от кореновата директория на репозитория
- Проверете дали `docs/_sidebar.md` съществува
**Docsify не обслужва документацията**:
- Инсталирайте docsify-cli глобално: `npm install -g docsify-cli`
- Стартирайте от корена на хранилището
- Проверете дали файлът `docs/_sidebar.md` съществува
### Съвети за развойна среда
- Използвайте VS Code с разширение Live Server за HTML проекти
- Инсталирайте ESLint и Prettier разширения за консистентно форматиране
- Използвайте DevTools в браузъра за отстраняване на грешки в JavaScript
- За Vue проекти инсталирайте разширението Vue DevTools в браузъра
- Използвайте VS Code с разширение Live Server за HTML проекти
- Инсталирайте ESLint и Prettier за консистентно форматиране
- Използвайте DevTools на браузъра за JavaScript отстраняване на грешки
- За Vue проекти инсталирайте Vue DevTools браузър разширение
### Съображения за производителността
### Съображения за производителност
- Голям брой файлове за превод (50+ езика) правят клонирането голямо
- Използвайте плитко клониране ако работите само със съдържание: `git clone --depth 1`
- Изключвайте преводите от търсения при работа върху английското съдържание
- Процесите на билд могат да са бавни при първо изпълнение (npm install, Vite build)
- Голям брой преведени файлове (50+ езика) означава големи пълни копия
- Използвайте shallow clone ако работите само върху съдържание: `git clone --depth 1`
- Изключвайте преводите от търсения при работа само с английско съдържание
- Изграждането може да е бавно при първо изпълнение (npm install, Vite build)
## Съображения за сигурност
### Променливи на средата
- API ключовете никога не трябва да се комитират в репозитория
- Използвайте `.env` файлове (вече в `.gitignore`)
- Документирайте необходимите променливи на средата в README файловете на проектите
- API ключове никога не трябва да се качват в хранилището
- Използвайте `.env` файлове (вече в `.gitignore`)
- Документирайте необходимите променливи на средата в README на проектите
### Python проекти
- Използвайте виртуални среди: `python -m venv venv`
- Поддържайте зависимости актуални
- GitHub токените трябва да имат минимално нужните права
- Използвайте виртуални среди: `python -m venv venv`
- Поддържайте зависимости актуализирани
- GitHub token-и трябва да имат минимални нужни разрешения
### Достъп до GitHub Models
- Необходими са лични достъпни токени (PAT) за GitHub Models
- Токените трябва да се съхраняват като променливи на средата
- Никога не комитвайте токени или данни за достъп
- За GitHub Models се изискват персонални токени за достъп (PAT)
- Токените трябва да се съхраняват като променливи на средата
- Никога не комитвайте токени или удостоверителни данни
## Допълнителни бележки
### Целева аудитория
- Напълно начинаещи в уеб разработката
- Студенти и самонаучаващи се
- Учители, използващи учебната програма в класните стаи
- Съдържанието е проектирано за достъпност и постепенно развитие на умения
- Пълни начинаещи в уеб разработката
- Студенти и самоучащи се
- Учители, използващи учебната програма в класна стая
- Съдържанието е проектирано за достъпност и постепенно натрупване на умения
### Образователна философия
- Подход на учене чрез проекти
- Чести проверки на знанията (куизове)
- Практически упражнения по кодиране
- Примери за приложение в реалния свят
- Фокус върху основите преди фреймуърковете
- Подход, базиран на проекти
- Чести проверки на знания (викторини)
- Практически упражнения по кодиране
- Примери за реални приложения
- Фокус върху основите преди фреймуъркове
### Поддръжка на репозитория
### Поддръжка на хранилището
- Активна общност от учащи и допринасящи
- Редовни актуализации на зависимости и съдържание
- Наблюдение на проблеми и дискусии от поддържащите
- Обновявания на преводи автоматизирани чрез GitHub Actions
- Активна общност от учащи и допринасящи
- Редовни актуализации на зависимости и съдържание
- Следене на проблеми и дискусии от поддръжниците
- Автоматизирани актуализации на преводи чрез GitHub Actions
### Свързани ресурси
- [Microsoft Learn модули](https://docs.microsoft.com/learn/)
- [Student Hub ресурси](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) препоръчан за учащи
- Допълнителни курсове: Генеративен AI, Data Science, ML, IoT учебни програми налични
- [Модули на Microsoft Learn](https://docs.microsoft.com/learn/)
- [Student Hub ресурси](https://docs.microsoft.com/learn/student-hub/)
- Препоръчва се [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) за учащи
- Допълнителни курсове: Генеративен AI, Data Science, ML, IoT учебни програми на разположение
### Работа с конкретни проекти
### Работа със специфични проекти
За подробни инструкции за отделни проекти, вижте README файловете в:
- `quiz-app/README.md` - Vue 3 приложение за куиз
- `7-bank-project/README.md` - Банково приложение с автентикация
- `5-browser-extension/README.md` - Разработка на разширения за браузър
- `6-space-game/README.md` - Разработка на игра с Canvas
За подробни инструкции за отделни проекти вижте README файловете в:
- `quiz-app/README.md` - Vue 3 викторина приложение
- `7-bank-project/README.md` - Банково приложение с автентикация
- `5-browser-extension/README.md` - Разработка на браузър разширения
- `6-space-game/README.md` - Разработка на игра базирана на Canvas
- `9-chat-project/README.md` - AI чат асистент проект
### Структура на монорепо
### Структура на монохранилище
Въпреки че не е традиционно монорепо, този репозиторий съдържа множество независими проекти:
- Всеки урок е самостоятелен
- Проектите не споделят зависимости
- Работете по отделните проекти без да засягате останалите
- Клонирайте целия репозиторий за пълно учебно изживяване
Въпреки че не е традиционно монохранилище, това хранилище съдържа множество независими проекти:
- Всеки урок е самостоятелен
- Проектите не споделят зависимости
- Работете по отделни проекти без да влияете на другите
- Клонирайте цялото хранилище за пълния учебен опит
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Отказ от отговорност**:
Този документ е преведен с помощта на AI преводаческа услуга [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи могат да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Не носим отговорност за никакви недоразумения или погрешни тълкувания, произтичащи от използването на този превод.
Този документ е преведен с помощта на AI преводаческа услуга [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля имайте предвид, че автоматизираните преводи могат да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Не носим отговорност за каквито и да е разбирателства или погрешни тълкувания, произтичащи от използването на този превод.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -493,7 +493,7 @@
},
"AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-02-06T10:00:32+00:00",
"translation_date": "2026-02-06T11:56:16+00:00",
"source_file": "AGENTS.md",
"language_code": "ro"
},

@ -2,29 +2,29 @@
## Prezentare generală a proiectului
Acesta este un depozit curricular educațional pentru predarea fundamentelor dezvoltării web începătorilor. Curriculum-ul este un curs cuprinzător de 12 săptămâni dezvoltat de Microsoft Cloud Advocates, care include 24 de lecții practice acoperind JavaScript, CSS și HTML.
Acesta este un depozit curricular educațional pentru predarea bazelor dezvoltării web începătorilor. Curriculumul este un curs cuprinzător de 12 săptămâni, dezvoltat de Microsoft Cloud Advocates, care cuprinde 24 de lecții practice ce acoperă JavaScript, CSS și HTML.
### Componente cheie
- **Conținut educațional**: 24 de lecții structurate organizate în module bazate pe proiecte
- **Proiecte practice**: Terrarium, Joc de tastare, Extensie de browser, Joc spațial, Aplicație bancară, Editor de cod și Asistent AI pentru chat
- **Chestionare interactive**: 48 de chestionare cu câte 3 întrebări fiecare (evaluări pre/post lecție)
- **Proiecte practice**: Terrarium, Joc de tastare, Extensie browser, Joc spațial, Aplicație bancară, Editor de cod și Asistent AI pentru chat
- **Teste interactive**: 48 de teste cu câte 3 întrebări fiecare (evaluări înainte și după lecție)
- **Suport multilingv**: Traduceri automate în peste 50 de limbi prin GitHub Actions
- **Tehnologii**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (pentru proiecte AI)
### Arhitectură
- Depozit educațional cu structură bazată pe lecții
- Fiecare folder de lecție conține README, exemple de cod și soluții
- Proiecte independente în directoare separate (quiz-app, diverse proiecte de lecție)
- Fiecare dosar de lecție conține README, exemple de cod și soluții
- Proiecte independente în directoare separate (quiz-app, diverse proiecte de lecții)
- Sistem de traducere folosind GitHub Actions (co-op-translator)
- Documentație servită prin Docsify și disponibilă ca PDF
- Documentație servită prin Docsify și disponibilă în format PDF
## Comenzi de configurare
Acest depozit este destinat în principal consumului de conținut educațional. Pentru a lucra cu proiecte specifice:
### Configurarea principală a depozitului
### Configurare depozit principal
```bash
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
@ -36,22 +36,22 @@ cd Web-Dev-For-Beginners
```bash
cd quiz-app
npm install
npm run dev # Pornește serverul de dezvoltare
npm run build # Construiește pentru producție
npm run lint # Rulează ESLint
npm run dev # Porniți serverul de dezvoltare
npm run build # Compilați pentru producție
npm run lint # Rulați ESLint
```
### Proiect API bancar (Node.js + Express)
### API Proiect bancar (Node.js + Express)
```bash
cd 7-bank-project/api
npm install
npm start # Pornire server API
npm start # Pornește serverul API
npm run lint # Rulează ESLint
npm run format # Formatează cu Prettier
```
### Proiecte Extensie de browser
### Proiecte extensie browser
```bash
cd 5-browser-extension/solution
@ -59,7 +59,7 @@ npm install
# Urmați instrucțiunile specifice browserului pentru încărcarea extensiilor
```
### Proiecte Joc spațial
### Proiecte joc spațial
```bash
cd 6-space-game/solution
@ -67,7 +67,7 @@ npm install
# Deschide index.html în browser sau folosește Live Server
```
### Proiect Chat (Backend Python)
### Proiect chat (backend Python)
```bash
cd 9-chat-project/solution/backend/python
@ -78,35 +78,35 @@ python api.py
## Flux de lucru pentru dezvoltare
### Pentru colaboratori de conținut
### Pentru contribuitori de conținut
1. **Fă fork la depozit** în contul tău de GitHub
2. **Clonează fork-ul** local
3. **Creează un nou branch** pentru modificările tale
4. Fă modificări în conținutul lecțiilor sau exemplele de cod
5. Testează orice modificări de cod în directoarele proiectelor relevante
6. Trimite pull requests respectând ghidul de contribuție
1. **Forkați depozitul** în contul dvs. GitHub
2. **Clonați fork-ul** local
3. **Creați un nou branch** pentru modificările dvs.
4. Faceți modificări în conținutul lecțiilor sau exemplele de cod
5. Testați orice modificări de cod în directoarele proiectelor relevante
6. Trimiteți pull request-uri urmând ghidul de contribuție
### Pentru cursanți
1. Fă fork sau clonează depozitul
2. Navighează secvențial în directoarele lecțiilor
3. Citește fișierele README pentru fiecare lecție
4. Completează chestionarele pre-lecție la https://ff-quizzes.netlify.app/web/
5. Parcurge exemplele de cod din folderul lecțiilor
6. Finalizează temele și provocările
7. Parcurge chestionarele post-lecție
1. Fork sau clonați depozitul
2. Navigați secvențial prin directoarele lecțiilor
3. Citiți fișierele README pentru fiecare lecție
4. Completați testele înainte de lecție la https://ff-quizzes.netlify.app/web/
5. Parcurgeți exemplele de cod din folderele lecțiilor
6. Finalizați temele și provocările
7. Susțineți testele post-lectie
### Dezvoltare live
- **Documentație**: Rulează `docsify serve` în rădăcină (port 3000)
- **Quiz App**: Rulează `npm run dev` în directorul quiz-app
- **Proiecte**: Folosește extensia VS Code Live Server pentru proiectele HTML
- **Proiecte API**: Rulează `npm start` în directoarele API corespunzătoare
- **Documentație**: Rulați `docsify serve` în rădăcină (port 3000)
- **Quiz App**: Rulați `npm run dev` în directorul quiz-app
- **Proiecte**: Folosiți extensia VS Code Live Server pentru proiectele HTML
- **Proiecte API**: Rulați `npm start` în directoarele API respective
## Instrucțiuni pentru testare
## Instrucțiuni de testare
### Testare Quiz App
### Testarea Quiz App
```bash
cd quiz-app
@ -114,86 +114,86 @@ npm run lint # Verifică problemele de stil de cod
npm run build # Verifică dacă compilarea reușește
```
### Testare API bancar
### Testarea API bancar
```bash
cd 7-bank-project/api
npm run lint # Verifică problemele de stil ale codului
npm run lint # Verifică problemele de stil de cod
node server.js # Verifică dacă serverul pornește fără erori
```
### Abordare generală pentru testare
- Acesta este un depozit educațional fără teste automate complete
- Acesta este un depozit educațional fără teste automate cuprinzătoare
- Testarea manuală se concentrează pe:
- Exemplele de cod rulează fără erori
- Exemple de cod care rulează fără erori
- Linkurile din documentație funcționează corect
- Construirile proiectelor se finalizează cu succes
- Exemplele respectă bune practici
- Proiectele se construiesc cu succes
- Exemplele urmează cele mai bune practici
### Verificări înainte de trimitere
- Rulează `npm run lint` în directoarele cu package.json
- Verifică dacă linkurile markdown sunt valide
- Testează exemplele de cod în browser sau Node.js
- Verifică dacă traducerile păstrează structura corectă
- Rulați `npm run lint` în directoarele cu package.json
- Verificați validitatea linkurilor markdown
- Testați exemplele de cod în browser sau Node.js
- Asigurați-vă că traducerile mențin structura corectă
## Ghid de stil pentru cod
### JavaScript
- Folosește sintaxa modernă ES6+
- Respectă configurațiile ESLint standard oferite în proiecte
- Folosește nume semnificative pentru variabile și funcții pentru claritate educațională
- Adaugă comentarii care explică conceptele pentru cursanți
- Formatează cu Prettier acolo unde este configurat
- Folosiți sintaxa modernă ES6+
- Urmați configurațiile standard ESLint din proiecte
- Folosiți nume semnificative pentru variabile și funcții pentru claritatea educațională
- Adăugați comentarii explicative pentru concepte
- Formatați folosind Prettier unde este configurat
### HTML/CSS
- Elemente semantice HTML5
- Principii de design responsive
- Convenții clare de denumire a claselor
- Comentarii care explică tehnici CSS pentru cursanți
- Comentarii care explică tehnicile CSS pentru cursanți
### Python
- Ghiduri de stil PEP 8
- Respectați ghidul de stil PEP 8
- Exemple de cod clare și educaționale
- Indicații de tip unde sunt utile pentru învățare
- Sugestii de tipuri de date acolo unde ajută la învățare
### Documentație Markdown
- Ierarhie clară a titlurilor
- Blocuri de cod cu specificare a limbajului
- Blocuri de cod cu specificație de limbaj
- Linkuri către resurse suplimentare
- Capturi de ecran și imagini în directoarele `images/`
- Text alternativ pentru imagini pentru accesibilitate
- Text alt pentru imagini pentru accesibilitate
### Organizarea fișierelor
- Lecții numerotate secvențial (1-getting-started-lessons, 2-js-basics, etc.)
- Fiecare proiect are directoare `solution/` și adesea `start/` sau `your-work/`
- Imaginile stocate în folderele `images/` specifice lecțiilor
- Imaginile stocate în foldere `images/` specifice lecțiilor
- Traducerile în structura `translations/{language-code}/`
## Construire și implementare
### Implementarea Quiz App (Azure Static Web Apps)
Quiz-app este configurat pentru implementare pe Azure Static Web Apps:
quiz-app este configurat pentru implementare în Azure Static Web Apps:
```bash
cd quiz-app
npm run build # Creează folderul dist/
# Publică prin fluxul de lucru GitHub Actions la push pe main
# Realizează implementarea prin workflow-ul GitHub Actions la împingerea pe main
```
Configurare Azure Static Web Apps:
- **Locația aplicației**: `/quiz-app`
- **Locația output-ului**: `dist`
- **Locația outputului**: `dist`
- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Generare PDF pentru documentație
### Generare PDF documentație
```bash
npm install # Instalează docsify-to-pdf
@ -203,80 +203,80 @@ npm run convert # Generează PDF din docs
### Documentație Docsify
```bash
npm install -g docsify-cli # Instalează Docsify global
docsify serve # Servește pe localhost:3000
npm install -g docsify-cli # Instalează Docsify la nivel global
docsify serve # Rulează pe localhost:3000
```
### Build-uri specifice proiectelor
### Construiri specifice proiectelor
Fiecare director de proiect poate avea propriul proces de build:
- Proiecte Vue: `npm run build` creează pachetele pentru producție
- Proiecte statice: Nu există pas de build, se servesc fișierele direct
- Proiecte Vue: `npm run build` creează bundle-uri pentru producție
- Proiecte statice: Nu au pas de build, se servesc fișierele direct
## Ghid pentru Pull Request-uri
## Ghid de pull request-uri
### Formatul titlului
Folosește titluri clare și descriptive care indică aria schimbării:
- `[Quiz-app] Adaugă chestionar nou pentru lecția X`
- `[Lesson-3] Corectează typo în proiectul terrarium`
- `[Translation] Adaugă traducere spaniolă pentru lecția 5`
Folosiți titluri clare și descriptive care indică aria de modificare:
- `[Quiz-app] Adaugă test nou pentru lecția X`
- `[Lecția-3] Corectează typo în proiectul terrarium`
- `[Traducere] Adaugă traducere spaniolă pentru lecția 5`
- `[Docs] Actualizează instrucțiunile de configurare`
### Verificări obligatorii
### Verificările necesare
Înainte de a trimite un PR:
1. **Calitatea codului**:
- Rulează `npm run lint` în directoarele proiectelor afectate
- Corectează toate erorile și avertismentele lintei
- Rulați `npm run lint` în directoarele proiectelor afectate
- Remediați toate erorile și avertismentele lint
2. **Verificarea build-ului**:
- Rulează `npm run build` dacă este cazul
- Asigură-te că nu există erori de build
- Rulați `npm run build` dacă este cazul
- Asigurați-vă că nu există erori la build
3. **Validarea linkurilor**:
- Testează toate linkurile markdown
- Verifică dacă referințele imaginilor funcționează
- Testați toate linkurile markdown
- Verificați funcționalitatea imaginilor
4. **Revizuire conținut**:
- Corectează ortografia și gramatica
- Asigură-te că exemplele de cod sunt corecte și educaționale
- Verifică dacă traducerile păstrează sensul original
4. **Revizuirea conținutului**:
- Corectați ortografia și gramatica
- Asigurați-vă că exemplele de cod sunt corecte și educaționale
- Verificați ca traducerile să păstreze sensul original
### Cerințe pentru contribuții
### Cerințe de contribuție
- Acceptă Microsoft CLA (verificare automată la primul PR)
- Respectă [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Vezi [CONTRIBUTING.md](./CONTRIBUTING.md) pentru ghiduri detaliate
- Referențiază numerele issue-urilor în descrierea PR-ului dacă este cazul
- Acceptați Microsoft CLA (verificare automată la primul PR)
- Urmați [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Consultați [CONTRIBUTING.md](./CONTRIBUTING.md) pentru ghid complet
- Referiți numerele de issue în descrierea PR-ului dacă este cazul
### Procesul de revizuire
- PR-urile sunt revizuite de menținători și comunitate
- Prioritizăm claritatea educațională
- Exemplele de cod trebuie să urmeze cele mai bune practici actuale
- Traducerile sunt revizuite pentru acuratețe și adecvare culturală
- PR-urile sunt revizuite de mentori și comunitate
- Claritatea educațională este prioritară
- Exemplele de cod trebuie să urmeze cele mai bune practici curente
- Traducerile sunt verificate pentru acuratețe și adecvare culturală
## Sistemul de traducere
## Sistem de traducere
### Traducere automată
- Folosește GitHub Actions cu workflow-ul co-op-translator
- Traduce în peste 50 de limbi automat
- Fișierele sursă în directoarele principale
- Fișierele traduse în directoarele `translations/{language-code}/`
- Traduce automat în peste 50 de limbi
- Fișiere sursă în directoare principale
- Fișiere traduse în directoarele `translations/{language-code}/`
### Adăugarea îmbunătățirilor manuale la traducere
### Adăugarea îmbunătățirilor manuale de traducere
1. Localizează fișierul în `translations/{language-code}/`
2. Fă îmbunătățiri păstrând structura
3. Asigură-te că exemplele de cod rămân funcționale
4. Testează eventual conținutul localizat al chestionarelor
1. Localizați fișierul în `translations/{language-code}/`
2. Faceți îmbunătățiri păstrând structura
3. Asigurați funcționalitatea exemplelor de cod
4. Testați orice conținut de quiz localizat
### Metadate pentru traduceri
Fișierele traduse includ un antet de metadate:
Fișierele traduse includ un header de metadate:
```markdown
<!--
CO_OP_TRANSLATOR_METADATA:
@ -294,115 +294,115 @@ CO_OP_TRANSLATOR_METADATA:
### Probleme comune
**Quiz app nu pornește**:
- Verifică versiunea Node.js (recomandat v14+)
- Șterge `node_modules` și `package-lock.json`, rulează din nou `npm install`
- Verifică conflictele de port (implicit: Vite folosește portul 5173)
- Verificați versiunea Node.js (recomandat v14+)
- Ștergeți `node_modules` și `package-lock.json`, rulați din nou `npm install`
- Verificați conflictele de port (implicit: Vite folosește port 5173)
**Serverul API nu pornește**:
- Asigură-te că versiunea Node.js este minim node >=10
- Verifică dacă portul este deja folosit
- Asigură-te că toate dependențele sunt instalate cu `npm install`
**Server API nu pornește**:
- Verificați dacă versiunea Node.js este minim (node >=10)
- Verificați dacă portul este deja folosit
- Asigurați-vă că toate dependențele sunt instalate cu `npm install`
**Extensia browserului nu se încarcă**:
- Verifică dacă manifest.json este formatat corect
- Verifică consola browserului pentru erori
- Urmează instrucțiunile specifice browserului pentru instalarea extensiei
**Extensia browser nu se încarcă**:
- Verificați formatul corect al fișierului manifest.json
- Consultați consola browserului pentru erori
- Urmați instrucțiunile specifice browserului pentru instalare
**Probleme proiect chat Python**:
- Asigură-te că pachetul OpenAI este instalat: `pip install openai`
- Verifică dacă variabila de mediu GITHUB_TOKEN este setată
- Verifică permisiunile de acces GitHub Models
- Asigurați instalarea pachetului OpenAI: `pip install openai`
- Verificați setarea variabilei de mediu GITHUB_TOKEN
- Verificați permisiunile de acces la GitHub Models
**Docsify nu servește documentația**:
- Instalează docsify-cli global: `npm install -g docsify-cli`
- Rulează din directorul rădăcină al depozitului
- Verifică dacă `docs/_sidebar.md` există
- Instalați global docsify-cli: `npm install -g docsify-cli`
- Rulați din directorul rădăcină al repo-ului
- Verificați existența fișierului `docs/_sidebar.md`
### Sfaturi pentru mediul de dezvoltare
- Folosește VS Code cu extensia Live Server pentru proiectele HTML
- Instalează extensiile ESLint și Prettier pentru formatări consistente
- Folosește DevTools din browser pentru depanarea JavaScript-ului
- Pentru proiectele Vue, instalează extensia Vue DevTools pentru browser
- Folosiți VS Code cu extensia Live Server pentru proiectele HTML
- Instalați extensiile ESLint și Prettier pentru formatare consistentă
- Folosiți DevTools din browser pentru depanarea JavaScript
- Pentru proiectele Vue, instalați extensia Vue DevTools în browser
### Considerații legate de performanță
### Considerații de performanță
- Numărul mare de fișiere traduse (peste 50 de limbi) face ca clonările întregi să fie mari
- Folosește shallow clone dacă lucrezi doar cu conținutul: `git clone --depth 1`
- Exclude traducerile din căutări când lucrezi pe conținutul în engleză
- Procesele de build pot fi lente la prima rulare (npm install, build cu Vite)
- Numărul mare de fișiere traduse (peste 50 de limbi) face clonele complete mari
- Folosiți shallow clone dacă lucrați doar pe conținut: `git clone --depth 1`
- Excludeți traducerile din căutări când lucrați pe conținut în limba engleză
- Procesele de build pot fi lente la prima rulare (npm install, build Vite)
## Considerații de securitate
### Variabile de mediu
- Cheile API nu trebuie niciodată comise în depozit
- Folosește fișiere `.env` (excluse deja din `.gitignore`)
- Documentează variabilele de mediu necesare în README-urile proiectelor
- Cheile API nu trebuie niciodată să fie comise în depozit
- Folosiți fișiere `.env` (inclus deja în `.gitignore`)
- Documentați variabilele de mediu necesare în README-urile proiectelor
### Proiecte Python
- Folosește medii virtuale: `python -m venv venv`
- Păstrează dependențele actualizate
- Tokenurile GitHub ar trebui să aibă permisiunile minime necesare
- Folosiți medii virtuale: `python -m venv venv`
- Mențineți dependențele actualizate
- Token-urile GitHub trebuie să aibă permisiunile minime necesare
### Acces GitHub Models
- Tokenuri de acces personal (PAT) sunt necesare pentru GitHub Models
- Tokenurile trebuie stocate ca variabile de mediu
- Nu comite niciodată tokenuri sau credentiale
- Token-uri personale de acces (PAT) necesare pentru GitHub Models
- Token-urile trebuie stocate ca variabile de mediu
- Nu comiteți niciodată token-uri sau credențiale
## Note suplimentare
### Public țintă
- Începători compleți în dezvoltarea web
- Începători absoluți în dezvoltarea web
- Studenți și autodidacți
- Profesori care folosesc curriculumul în clasă
- Conținut accesibil și construit pentru dezvoltare treptată a abilităților
- Profesori care folosesc curriculumul în săli de clasă
- Conținut proiectat pentru accesibilitate și dezvoltare graduală a competențelor
### Filosofia educațională
### Filosofie educațională
- Abordare bazată pe proiecte
- Verificări frecvente ale cunoștințelor (quiz-uri)
- Exerciții practice de programare
- Exemple din lumea reală
- Accent pe fundament înainte de framework-uri
- Abordare bazată pe învățare prin proiecte
- Verificări frecvente de cunoștințe (teste)
- Exerciții practice de codare
- Exemple reale de aplicare
- Accent pe fundamente înainte de framework-uri
### Mentenanța depozitului
- Comunitate activă de cursanți și colaboratori
- Comunitate activă de cursanți și contribuitori
- Actualizări regulate ale dependențelor și conținutului
- Probleme și discuții monitorizate de menținători
- Probleme și discuții monitorizate de mentori
- Actualizări automate ale traducerilor prin GitHub Actions
### Resurse conexe
### Resurse utile
- [Module Microsoft Learn](https://docs.microsoft.com/learn/)
- [Resurse Student Hub](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) recomandat pentru cursanți
- Cursuri suplimentare: AI generativă, Data Science, ML, curricula IoT disponibile
- Cursuri suplimentare: AI Generativ, Data Science, ML, IoT disponibile
### Lucrul cu proiecte specifice
Pentru instrucțiuni detaliate despre proiectele individuale, consultă fișierele README din:
Pentru instrucțiuni detaliate despre proiectele individuale, consultați fișierele README din:
- `quiz-app/README.md` - aplicație quiz Vue 3
- `7-bank-project/README.md` - aplicație bancară cu autentificare
- `5-browser-extension/README.md` - dezvoltare extensie browser
- `6-space-game/README.md` - dezvoltare joc bazat pe canvas
- `6-space-game/README.md` - dezvoltare joc pe canvas
- `9-chat-project/README.md` - proiect asistent AI pentru chat
### Structura Monorepo
Deși nu este un monorepo tradițional, acest depozit conține mai multe proiecte independente:
- Fiecare lecție este autocontenută
- Fiecare lecție este autonomă
- Proiectele nu împart dependențe
- Lucrează pe proiecte individuale fără a afecta altele
- Clonează întregul depozit pentru experiența completă a curriculumului
- Lucrați pe proiecte individuale fără a afecta altele
- Clonați întregul repo pentru experiența completă a curriculumului
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Declinare de responsabilitate**:
Acest document a fost tradus folosind serviciul de traducere automată AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă trebuie considerat sursa autorizată. Pentru informații critice, se recomandă traducerea profesională realizată de un traducător uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite cauzate de utilizarea acestei traduceri.
**Declinare de responsabilitate**:
Acest document a fost tradus folosind serviciul de traducere automată AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă trebuie considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru neînțelegeri sau interpretări eronate rezultate din utilizarea acestei traduceri.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -493,7 +493,7 @@
},
"AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-02-06T10:03:11+00:00",
"translation_date": "2026-02-06T11:58:48+00:00",
"source_file": "AGENTS.md",
"language_code": "sr"
},

@ -2,23 +2,23 @@
## Преглед пројекта
Ово је репозиторијум едукативног курса за учење основа веб развоја за почетнике. Курс је свеобухватан програм у трајању од 12 недеља, који су развили Microsoft Cloud Advocates, и садржи 24 практичне лекције које покривају JavaScript, CSS и HTML.
Ово је репозиторијум едукативног програма за подучавање основа веб развоја почетницима. Програм је свеобухватан курс у трајању од 12 недеља који је развио Microsoft Cloud Advocates, и садржи 24 практична часа који покривају JavaScript, CSS и HTML.
### Главне компоненте
### Кључне компоненте
- **Едукативни садржај**: 24 структуиране лекције организоване у модуле засноване на пројектима
- **Практични пројекти**: Терраријум, Игра куцања, Прегледачки екстензија, Свемирска игра, Банкарска апликација, Едитор кода и AI помоћник за разговор
- **Интерактивни квизови**: 48 квизова са по 3 питања (пре/после лекције)
- **Подршка за више језика**: Аутоматски преводи на преко 50 језика преко GitHub Actions
- **Едукативни садржај**: 24 структуирана часа организована у модуле базиране на пројектима
- **Практични пројекти**: Терраријум, Игра куцања, Прегледачки екстензија, Игрица у свемиру, Банкарска апликација, Уредник кода и AI помоћник за разговор
- **Интерактивни квизови**: 48 квизова са по 3 питања (пре и после часа)
- **Подршка за више језика**: Аутоматизовани преводи за 50+ језика преко GitHub Actions
- **Технологије**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (за AI пројекте)
### Архитектура
- Едукативни репозиторијум са структуром заснованом на лекцијама
- Свако фасцикле лекције садржи README, примерe кода и решења
- Самостални пројекти у посебним директоријумима (quiz-app, различити пројекти лекција)
- Систем превођења коришћењем GitHub Actions (co-op-translator)
- Документација се служи преко Docsify и доступна је као PDF
- Едукативни репозиторијум са структуром заснованом на часовима
- Свака фасцикла са часом садржи README, примере кода и решења
- Самостални пројекти у посебним директоријумима (quiz-app, различити пројекти часова)
- Систем за превођење користећи GitHub Actions (co-op-translator)
- Документација послужена преко Docsify и доступна као PDF
## Команде за подешавање
@ -31,22 +31,22 @@ git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners
```
### Подешавање Quiz App (Vue 3 + Vite)
### Подешавање Quiz апп-а (Vue 3 + Vite)
```bash
cd quiz-app
npm install
npm run dev # Покрени развојни сервер
npm run build # Направи продукцијски билд
npm run build # Направи продукцијску верзију
npm run lint # Покрени ESLint
```
### Bank Project API (Node.js + Express)
### API банкарског пројекта (Node.js + Express)
```bash
cd 7-bank-project/api
npm install
npm start # Покрени API сервер
npm start # Постави API сервер
npm run lint # Покрени ESLint
npm run format # Форматирај помоћу Prettier
```
@ -56,10 +56,10 @@ npm run format # Форматирај помоћу Prettier
```bash
cd 5-browser-extension/solution
npm install
# Пратите упутства за учитавање додатака специфичних за прегледач
# Пратите упутства за учитавање екстензија специфичних за прегледач
```
### Пројекти Свемирске игре
### Пројекти игре у свемиру
```bash
cd 6-space-game/solution
@ -67,7 +67,7 @@ npm install
# Отворите index.html у прегледачу или користите Live Server
```
### Chat пројекат (Python позадина)
### Пројекат разговора (Python Backend)
```bash
cd 9-chat-project/solution/backend/python
@ -80,147 +80,147 @@ python api.py
### За сараднике на садржају
1. **Форк-ујте репозиторијум** на свој GitHub налог
2. **Клонирајте свој форк** локално
1. **Направите fork** репозиторијума на вашем GitHub налогу
2. **Клонирајте свој fork** на локални рачунар
3. **Креирајте нову грану** за ваше измене
4. Направите измене у садржају лекција или примерима кода
5. Тестирајте измене кода у релевантним директоријумима пројеката
4. Извршите измене у садржају часова или примерима кода
5. Тестирајте измене кода у релевантним фасциклама пројеката
6. Пошаљите pull request-ове пратећи смернице за допринос
### За ученике
1. Форкујте или клонирајте репозиторијум
2. Крећите се секвенцијално кроз директоријуме лекција
3. Читајте README фајлове за сваку лекцију
4. Завршите квизове пре лекције на https://ff-quizzes.netlify.app/web/
5. Прођите кроз примере кода у фасциклама лекција
6. Урадите задатке и изазове
7. Полажите квизове након лекција
1. Направите fork или клон репозиторијума
2. Пратећи редослед приступајте фасциклама часова
3. Читајте README фајлове за сваки час
4. Завршите квизове пре часа на https://ff-quizzes.netlify.app/web/
5. Прођите кроз примере кода у фасциклама са часовима
6. Завршите задатке и изазове
7. Решеите квизове после часа
### Рад уживо
### Живи развој
- **Документација**: Покрените `docsify serve` у корену (порта 3000)
- **Quiz App**: Покрените `npm run dev` у директоријуму quiz-app
- **Документација**: Покрените `docsify serve` у корену (порт 3000)
- **Quiz Апликација**: Покрените `npm run dev` у директоријуму quiz-app
- **Пројекти**: Користите VS Code Live Server екстензију за HTML пројекте
- **API Пројекти**: Покрените `npm start` у одговарајућим API директоријумима
- **API пројекти**: Покрените `npm start` у одговарајућим API директоријумима
## Упутства за тестирање
### Тестирање Quiz App
### Тестирање Quiz App-а
```bash
cd quiz-app
npm run lint # Провери проблеме са стилом кода
npm run build # Верификуј да ли се израда успешно завршава
npm run lint # Провери проблеме стила кода
npm run build # Верификуј да ли је компилација успешна
```
### Тестирање Bank API
### Тестирање Bank API-ja
```bash
cd 7-bank-project/api
npm run lint # Провери проблеме стила кода
node server.js # Потврди да сервер почиње без грешака
npm run lint # Провери проблеме са стилом кода
node server.js # Потврди да сервер стартује без грешака
```
### Општи приступ тестирању
- Ово је едукативни репозиторијум без свеобухватних аутоматских тестова
- Манулано тестирање се фокусира на:
- Ово је едукативни репозиторијум без свеобухватних аутоматизованих тестова
- Ручно тестирање се фокусира на:
- Извршавање примера кода без грешака
- Провера исправности линкова у документацији
- Успешно компајлирање пројеката
- Праћење најбољих пракси у примерима
- Везе у документацији функционишу исправно
- Састављања пројеката успешно завршена
- Примери прате добре праксе
### Провере пре слања
- Покрените `npm run lint` у директоријумима са package.json
- Потврдите да су markdown линкови валидни
- Тестирајте примере кода у прегледачу или Node.js
- Провирите да преводи одржавају исправну структуру
- Покрените `npm run lint` у директоријумима који имају package.json
- Верификујте да markdown линкови важе
- Тестирајте примере кода у прегледачу или Node.js-у
- Проверите да преводи задржавају одговарајућу структуру
## Водич за стил кода
## Смјернице за стил кода
### JavaScript
- Користите модерни ES6+ синтакс
- Пратите стандардне ESLint конфигурације које су обезбеђене у пројектима
- Користите значајна имена променљивих и функција ради јасноће учења
- Додајте коментаре који објашњавају концепте ученицима
- Форматирајте код помоћу Prettier где је конфигурисано
- Користите савремени ES6+ синтакс
- Пратите стандардне ESLint конфигурације обезбеђене пројектима
- Користите значајна имена променљивих и функција ради едукативне јасноће
- Додајте коментаре који објашњавају концепте за ученике
- Форматирајте помоћу Prettier где је конфигурисано
### HTML/CSS
- Семантички HTML5 елементи
- Принципи респонзивног дизајна
- Јасна конвенција именовања класа
- Јасне конвенције именовања класа
- Коментари који објашњавају CSS технике за ученике
### Python
- Прате PEP 8 стилске смернице
- Поштујте PEP 8 стилске смернице
- Јасни, едукативни примери кода
- Типске наговештаје где су корисни за учење
- Типски савети где су корисни за учење
### Markdown документација
- Јасна хијерархија наслова
- Код блокови са назначеним језиком
- Линкови ка додатним ресурсима
- Снимци екрана и слике у директоријумима `images/`
- Алт текст за слике за приступачност
- Блокови кода са одређеним језиком
- Везе ка додатним ресурсима
- Снимци екрана и слике у `images/` фасциклама
- Alt текст за слике ради приступачности
### Организација фајлова
- Лекције су нумерисане секвенцијално (1-getting-started-lessons, 2-js-basics, итд.)
- Сваки пројекат има директоријуме `solution/` и често `start/` или `your-work/`
- Слике се чувају у специфику тих лекција у `images/` фасциклама
- Преводи су у `translations/{language-code}/` структури
- Часови су нумерисани секвенцијално (1-getting-started-lessons, 2-js-basics итд.)
- Сваки пројекат има `solution/` и често `start/` или `your-work/` фасцикле
- Слике су у фасциклама `images/` специфичним за час
- Преводи у структури `translations/{language-code}/`
## Састављање и објављивање
## Изградња и постављање
### Објављивање Quiz App (Azure Static Web Apps)
### Постављање Quiz апп-а (Azure Static Web Apps)
Quiz-app је подешен за објављивање на Azure Static Web Apps:
quiz-app је конфигурисан за постављање на Azure Static Web Apps:
```bash
cd quiz-app
npm run build # Креира фасциклу dist/
# Објављује путем GitHub Actions рада током пуша на main
npm run build # Креира фолдер dist/
# Поставља путем GitHub Actions workflow-а на пуш ка main-у
```
Конфигурација Azure Static Web Apps:
- **Локација апликације**: `/quiz-app`
- **Локација излаза**: `dist`
- **Ток рада**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Генерисање PDF документације
```bash
npm install # Инсталирајте docsify-to-pdf
npm run convert # Генеришите PDF из докса
npm install # Инсталирај docsify-to-pdf
npm run convert # Генериши PDF из докса
```
### Документација Docsify
### Docsify документација
```bash
npm install -g docsify-cli # Инсталирајте Docsify глобално
docsify serve # Послужите на localhost:3000
npm install -g docsify-cli # Инсталирајте Доксифи глобално
docsify serve # Покрените на localhost:3000
```
### Састављање специфично за пројекте
### Изградње специфичне за пројекат
Свако директоријум пројекта може имати свој процес израде:
- Vue пројекти: `npm run build` креира продукционе пакете
- Статички пројекти: нема корака састављања, постављају се директно
Сваки директоријум пројекта може имати свој процес изградње:
- Vue пројекти: `npm run build` креира производне пакете
- Статички пројекти: Нема корака изградње, датотеке се служе директно
## Правила за Pull Request-ове
## Смернице за Pull Request-ове
### Формат наслова
Користите јасне, описне наслове који указују на области измена:
- `[Quiz-app] Додај нови квиз за лекцију X`
- `[Lesson-3] Исправка типографске грешке у терраријум пројекту`
- `[Translation] Додај шпански превод за лекцију 5`
Користите јасне, описне наслове који указују на област измена:
- `[Quiz-app] Додај нови квиз за час X`
- `[Lesson-3] Исправи типо у терраријум пројекту`
- `[Translation] Додај шпански превод за час 5`
- `[Docs] Ажурирај упутства за подешавање`
### Обавезне провере
@ -228,55 +228,55 @@ docsify serve # Послужите на localhost:3000
Пре слања PR-а:
1. **Квалитет кода**:
- Покрените `npm run lint` у погођеним директоријумима пројеката
- Покрените `npm run lint` у погођеним пројектима
- Исправите све грешке и упозорења
2. **Верификација састављања**:
2. **Верификација изградње**:
- Покрените `npm run build` ако је применљиво
- Обезбедите да нема грешака у састављању
- Осигурајте да нема грешака у изградњи
3. **Провера линкова**:
3. **Валидација веза**:
- Тестирајте све markdown линкове
- Потврдите да референце слика раде
- Проверите да референце слика раде
4. **Преглед садржаја**:
- Прегледајте правопис и граматику
- Осигурајте да су примери кода тачни и едукативни
- Проверите да преводи одржавају оригинално значење
- Провера правописа и граматике
- Осигурати да су примери кода исправни и едукативни
- Проверити да преводи задржавају оригинално значење
### Захтеви за допринос
- Прихватите Microsoft CLA (аутоматска провера при првом PR-у)
- Прихватите Microsoft CLA (аутоматска провера при првом PR)
- Пратите [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Погледајте [CONTRIBUTING.md](./CONTRIBUTING.md) за детаљна упутства
- У опису PR-а наводите бројеве релевантних issue-јева ако је применљиво
- Погледајте детаљне смернице у [CONTRIBUTING.md](./CONTRIBUTING.md)
- Наведите бројеве issues у опису PR-а када је применљиво
### Процес прегледа
- PR-ове прегледају одржаваоци и заједница
- Приоритет је јасноћа едукације
- Примери кода треба да прате најбоље тренутне праксе
- Преводи се прегледају за тачност и културну прикладност
- PR-ови се прегледају од стране одржавалаца и заједнице
- Приоритет је едукативна јасноћа
- Примери кода треба да прате актуелне добре праксе
- Преводи се прегледају ради тачности и културне одговарајућости
## Систем превођења
### Аутоматизован превод
### Аутоматизовани превод
- Користи GitHub Actions са co-op-translator током рада
- Аутоматски преводи на више од 50 језика
- Изворне датотеке у главним директоријумима
- Преведене датотеке у директоријумима `translations/{language-code}/`
- Користи GitHub Actions са co-op-translator workflow-ом
- Аутоматски преводи на 50+ језика
- Изворне датотеке у главним директорijумима
- Преведене датотеке у `translations/{language-code}/` директорijумима
### Додавање ручних побољшања превода
1. Пронађите фајл у `translations/{language-code}/`
1. Пронађите датотеку у `translations/{language-code}/`
2. Направите побољшања уз очување структуре
3. Осигурајте да примерци кода и даље функционишу
4. Тестирајте локализовани квиз садржај
3. Осигурате да примери кода остају функционални
4. Тестирајте локализовани садржај квизова
### Мета подаци о преводу
Преведени фајлови садрже заглавље метаподатака:
Преведене датотеке садрже заглавље са мета подацима:
```markdown
<!--
CO_OP_TRANSLATOR_METADATA:
@ -293,116 +293,116 @@ CO_OP_TRANSLATOR_METADATA:
### Уобичајени проблеми
**Quiz app не почиње**:
- Проверите верзију Node.js (препоручено v14+)
- Обришите `node_modules` и `package-lock.json`, покрените поново `npm install`
- Проверите да ли је порт слободан (подразумевано: Vite користи порт 5173)
**Quiz app не успева да стартује**:
- Проверите Node.js верзију (препоручено v14+)
- Обришите `node_modules` и `package-lock.json`, поново покрените `npm install`
- Проверите да ли је порт у употреби (подразумевано: Vite користи порт 5173)
**API сервер не почиње**:
- Проверите да ли Node.js верзија испуњава услове (node >=10)
- Проверите да ли порт није у употреби
- Обезбедите да су све зависности инсталиране са `npm install`
**API сервер неће да се покрене**:
- Верификујте да Node.js верзија испуњава минимум (node >=10)
- Проверите да ли је порт већ у употреби
- Осигурајте да су све зависности инсталиране помоћу `npm install`
**Прегледачки екстензија се не учитава**:
- Проверите да ли је manifest.json правилно форматиран
- Проверите да је manifest.json исправно форматиран
- Погледајте конзолу прегледача за грешке
- Пратите упутства специфична за прегледач за инсталацију екстензије
- Пратите упутства за инсталацију специфична за прегледач
**Проблеми са Python chat пројектом**:
- Осигурајте да је OpenAI пакет инсталиран: `pip install openai`
- Проверите да ли је GITHUB_TOKEN постављен као променљива окружења
- Проверите дозволе приступа GitHub Models
- Проверите да је OpenAI пакет инсталиран: `pip install openai`
- Верификујте да је GITHUB_TOKEN променљива окружења подешена
- Проверите приступне дозволе за GitHub Models
**Docsify не служи документацију**:
- Инсталирајте docsify-cli глобално: `npm install -g docsify-cli`
- Покрените из корена репозиторијума
- Проверите да ли `docs/_sidebar.md` постоји
- Покрените из коренског директоријума репозиторијума
- Проверите да ли постоји `docs/_sidebar.md`
### Савети за развојно окружење
- Користите VS Code са Live Server екстензијом за HTML пројекте
- Инсталирајте ESLint и Prettier екстензије за доследно форматирање
- Користите DevTools прегледача за дебаговање JavaScript-а
- За Vue пројекте, инсталирајте Vue DevTools екстензију за прегледач
- Користите DevTools у прегледачу за дебаговање JavaScript-а
- За Vue пројекте инсталирајте Vue DevTools екстензију за прегледач
### Разматрања перформанси
### Перформансна разматрања
- Велики број преведених фајлова (50+ језика) чини да су цели клонирања велики
- Користите shallow clone ако радите само на садржају: `git clone --depth 1`
- Велики број преведених датотека (50+ језика) чини пуне клоне великим
- Користите shallow клонирање ако радите само на садржају: `git clone --depth 1`
- Искључите преводе из претрага када радите на енглеском садржају
- Процеси састављања могу бити спори при првом покретању (npm install, Vite build)
- Процеси изградње могу бити споро приликом првог покретања (npm install, Vite build)
## Безбедносна разматрања
## Безбедносне мере
### Променљиве окружења
- API кључеви никада не смеју бити комитовани у репозиторијум
- API кључеви никада не смеју бити послати у репозиторијум
- Користите `.env` фајлове (већ у `.gitignore`)
- Документујте потребне променљиве окружења у README-има пројеката
- Документирајте потребне променљиве окружења у README-има пројеката
### Python пројекти
- Користите виртуелна окружења: `python -m venv venv`
- Користите виртуална окружења: `python -m venv venv`
- Одржавајте зависности ажурним
- GitHub токени треба да имају минималне потребне дозволе
- GitHub токени требају имати минималне потребне дозволе
### Приступ GitHub Models
- За GitHub Models су потребни Personal Access Tokens (PAT)
- Токени треба да се чувају као променљиве окружења
- Никада не комитујте токене или акредитиве
- Потребни су Personal Access Tokens (PAT) за GitHub Models
- Токени треба да буду чувани као променљиве окружења
- Никада не шаљите токене или акредитиве у репозиторијум
## Додатне белешке
## Додатне напомене
### Циљна публика
- Потпуни почетници у веб развоју
- Студенти и самоуки изучавачи
- Наставници који користе курс у учионицама
- Апсолутни почетници у веб развоју
- Студенти и самоуки учесници
- Наставници који користе програм у учионицама
- Садржај је дизајниран за приступачност и постепено стицање вештина
### Едукативна филозофија
- Приступ заснован на пројектима
- Чести прегледи знања (квизови)
- Практичне вежбе кодирања
- Приступ учењу базиран на пројектима
- Често провере знања (квизови)
- Практичне вежбе програмирања
- Примери примене у стварном свету
- Фокус на основе пре оквира
- Фокус на основе пре приступа оквирима (frameworks)
### Одржавање репозиторијума
- Активна заједница ученика и сарадника
- Редовна ажурирања зависности и садржаја
- Пратите проблеме и дискусије од стране одржавалаца
- Аутоматизована ажурирања превода преко GitHub Actions
- Прати се проблеми и дискусије од стране одржавалаца
- Аутоматизација ажурирања превода преко GitHub Actions
### Повезани ресурси
- [Microsoft Learn модули](https://docs.microsoft.com/learn/)
- [Student Hub ресурси](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) препоручен за ученике
- Додатни курсеви: Generative AI, Data Science, ML, IoT курикулуми доступни
- Додатни курсеви: Generative AI, Data Science, ML, IoT програми доступни
### Рад са специфичним пројектима
За детаљна упутства о појединачним пројектима, погледајте README фајлове у:
- `quiz-app/README.md` - Vue 3 апликација за квиз
- `7-bank-project/README.md` - Банкарска апликација са аутентикацијом
- `5-browser-extension/README.md` - Развој екстензије за прегледач
- `6-space-game/README.md` - Развој игре на Canvas-у
- `quiz-app/README.md` - Vue 3 квиз апликација
- `7-bank-project/README.md` - Банкарска апликација са аутентификацијом
- `5-browser-extension/README.md` - Развој прегледачких екстензија
- `6-space-game/README.md` - Развој игре засноване на canvas-у
- `9-chat-project/README.md` - AI помоћник за разговор
### Монорепо структура
Иако није традиционални монорепо, овај репозиторијум садржи више независних пројеката:
- Свaka лекција је самостална
Иако није традиционално монорепо, овај репозиторијум садржи више независних пројеката:
- Сваки час је самосталан
- Пројекти не деле зависности
- Радите на појединачним пројектима без утицаја на друге
- Клонирајте цео репозиторијум за комплетно искуство курса
- Рад на појединачним пројектима без утицаја на остале
- Клонирајте цео репозиторијум за пун доживљај програма
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Одрицање од одговорности**:
Овај документ је преведен коришћењем АИ преводилачке услуге [Co-op Translator](https://github.com/Azure/co-op-translator). Иако настојимо да превод буде прецизан, молимо вас да имате у виду да аутоматизовани преводи могу садржати грешке или нетачности. Оригинални документ на његовом изворном језику треба сматрати ауторитетним извором. За критичне информације препоручује се професионални људски превод. Нисмо одговорни за било каква непоразумевања или погрешне тумачења која проистекну из коришћења овог превода.
**Одрицање од одговорности**:
Овај документ је преведен коришћењем АИ преводилачке услуге [Co-op Translator](https://github.com/Azure/co-op-translator). Иако тежимо прецизности, молимо вас да имате у виду да аутоматски преводи могу садржати грешке или нетачности. Првобитни документ на његовом изворном језику треба сматрати ауторитетним извором. За критичне информације препоручује се професионални људски превод. Нисмо одговорни за било каква неспоразума или погрешне интерпретације настале употребом овог превода.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->
Loading…
Cancel
Save