Виконайте ці рекомендації для безкоштовного CodeCamp локально у вашій системі. Наполегливо рекомендується, якщо ви хочете регулярно вносити свій внесок.
Для деяких з успішних учасників вам необхідно мати вільний CodeCamp місцево. Наприклад, перегляд завдань з кодування або налагодження та виправлення помилок у кодовій базі.
> [!TIP] Якщо вам не цікаві налаштування безкоштовного CodeCamp локально розгляньте можливість використання Gitpod, безкоштовного онлайн середовища.
>
> [](https://gitpod.io/#https://github.com/freeCodeCamp/freeCodeCamp)
>
> (Для безкоштовного CodeCamp у вашому браузері)
## Підготувати ваш локальний комп'ютер
Почніть з встановлення передумового програмного забезпечення для вашої операційної системи.
Ми в першу чергу підтримуємо розробку на **\*nix** системах. Співробітники та учасники спільноти регулярно працюють з базою коду використовуючи інструменти, встановлені на Ubuntu та macOS.
Ми також підтримуємо Windows 10 через WSL2, який ви можете підготувати [інструкцію](/how-to-setup-wsl).
Деякі члени спільноти також розробляють у Windows 10 належним чином з Git для Windows (Git Bash) та інших інструментів, встановлених на Windows. Наразі ми не маємо офіційної підтримки для таких налаштувань, натомість радимо використовувати WSL2.
| npm (приходить в комплект з вузлом) | `6.х` | Не має LTS релізів, ми використовуємо версію, зібрану з Node LTS |
| [Сервер спільноти MongoDB](https://docs.mongodb.com/manual/administration/install-community/) | `3.6` | [Примітки до релізу](https://docs.mongodb.com/manual/release-notes/), Примітка: на сторінці `3.6`, [оновлення заплановано.](https://github.com/freeCodeCamp/freeCodeCamp/issues/18275). |
> [!DANGER] Якщо у вас інша версія, будь ласка, встановіть рекомендовану версію. Ми можемо підтримувати лише для рекомендованих версій. Перегляньте [усунення неполадок](#troubleshooting) для подробиць.
Якщо Node.js вже встановлено на вашому пристрої, виконайте наступні команди для перевірки версій:
```console
вузол -v
npm -v
```
> [!TIP] Ми наполегливо рекомендуємо оновити до останніх стабільних релізів програмного забезпечення, що перераховані вище, також відомих як довготермінова підтримка (LTS) релізів.
Після встановлення передумов, необхідно підготувати середовище розробки. Це звично для багатьох робочих процесів розвитку, і вам потрібно це зробити лише один раз.
**Виконайте наступні кроки, щоб продовжити роботу вашого середовища розробки:**
1. Встановіть [Git](https://git-scm.com/) або ваш улюблений клієнт Git, якщо ви ще цього не зробили. Оновлення до останньої версії; версія, що пов'язана з вашою ОС, може бути застаріла.
2. (Не обов'язково, але рекомендовано) [Налаштуйте SSH ключ](https://help.github.com/articles/generating-an-ssh-key/) для GitHub.
3. Встановіть редактор коду на ваш вибір.
Ми наполегливо рекомендуємо використовувати [Visual Studio Code](https://code.visualstudio.com/) or [Atom](https://atom.io/). Вони є чудовими, вільними та відкритими програмами для редагування кодів.
4. Налаштуйте підкладку для свого редактора коду.
Вам слід мати [ESLint запущений у вашому редакторі](http://eslint.org/docs/user-guide/integrations.html), і він буде виділяти усе, що не співвідноситься з [freeCodeCamp's Style Guide](http://forum.freecodecamp.org/t/free-code-camp-javascript-style-guide/19121).
> [!TIP] Будь ласка, не ігноруйте жодних помилок невірності. Вони призначені для **допомоги** вам та забезпечення чистої та простої бази коду.
## Розгалуження репозиторію на GitHub
[Forking](https://help.github.com/articles/about-forks/) is a step where you get your own copy of freeCodeCamp's main repository (a.k.a _repo_) on GitHub.
Це важливо, оскільки воно дозволяє працювати над власною копією безкоштовного CodeCamp на GitHub, або для завантаження (клонувати) свій репозиторій для роботи локально. Пізніше, ви зможете надіслати зміни в основний репозиторій з вашого форку через pull request (PR).
> [!TIP] Основний репозиторій `https://github.com/freeCodeCamp/freeCodeCamp` часто називають репозиторієм `upstream`.
>
> Ваш форк на `https://github.com/YOUR_USER_NAME/freeCodeCamp` часто називають репозиторієм `origin`.
**Дотримуйтесь цих кроків, щоб зробити форк репозиторію `https://github.com/freeCodeCamp/freeCodeCamp`:**
1. Перейдіть до freeCodeCamp репозиторію на GitHub: <https://github.com/freeCodeCamp/freeCodeCamp>
2. Click the "Fork" Button in the upper right-hand corner of the interface ([More Details Here](https://help.github.com/articles/fork-a-repo/))
3. Після того, як сховище буде пророблено, ви будете переміщені до своєї копії freeCodeCamp репозиторію на `https://github.com/YOUR_USER_NAME/freeCodeCamp`
<details>
<summary>
Як зробити форк freeCodeCamp на GitHub (скріншот)
</summary>
<br>
<imgsrc="https://raw.githubusercontent.com/freeCodeCamp/freeCodeCamp/master/docs/images/github/how-to-fork-freeCodeCamp.gif"alt="Як зробити форк freeCodeCamp на GitHub"/>
</details>
## Клонуйте ваш форк з GitHub
[Клонування](https://help.github.com/articles/cloning-a-repository/) це місце, де ви **завантажити** копію репозиторію з `віддаленого` місця, яке належить вам або іншим іншим. На вашому випадок, це ваше віддалене місце `форк` довільного репозиторію CodeCamp, яке має бути доступне на `https://github.com/YOUR_USER_NAME/freeCodeCamp`.
Запустіть ці команди на вашому локальному комп’ютері:
1. Відкрити термінал / командний рядок в каталозі проектів
Це дозволить завантажити весь безкоштовний CodeCamp репозиторій до ваших проектів каталогу.
Примітка: `--depth=1` створює невеликий клон вашого форку, лише останній історія/коміт.
## Налаштуйте синхронізацію з батьківського об'єкту
Тепер, коли ви завантажили копію вашого форку, вам потрібно встановити `файл upstream` на батьківський репозиторій.
[Як згадано раніше](#fork-the-repository-on-github), основний репозиторій згадується на `upstream` репозиторій. Ваш форк називають репозиторієм `походженням`.
Вам необхідно вказати на локальний клон на репозиторій `upstream` на додаток до репозиторію `origin`. Це так що ви можете синхронізувати зміни з основного сховища без повторного використання форку та клонування.
1. Змінити каталог на каталог freeCodeCamp:
```console
cd freeCodeCamp
```
2. Додати віддалене посилання на основний репозиторій freeCodeCamp:
Тепер, коли у вас є локальна копія freeCodeCamp, ви можете дотримуватися цих інструкцій щоб запустити її локально. Це дозволить Вам:
- Попередній перегляд змін до сторінок, як це показано на навчальній платформі.
- Робота з питаннями, пов'язаними з інтерфейсом, і розширеннями.
- Налагодження і виправлення проблем з серверами програм і клієнтами.
Якщо у вас виникли проблеми, спочатку виконайте пошук по вашій задачі та переконайтесь, що на нього вже є відповідь. Якщо ви не можете знайти рішення, будь ласка, знайдіть сторінку [GitHub задач](https://github.com/freeCodeCamp/freeCodeCamp/issues) для вирішення і повідомте про проблему, якщо про неї ще не повідомлено.
І як завжди, не соромтеся заходити на наш [чат чату учасників Gitter](https://gitter.im/FreeCodeCamp/Contributors) або [наш сервер Discord](https://discord.gg/pFspAhS)для швидкого запиту.
> [!TIP] Ви можете пропустити запуск freeCodeCamp локально, якщо ви просто редагуєте файли. Наприклад, виконання `rebase`, або розв'язання `об'єднання` конфліктів.
>
> Ви завжди можете повернутися до цієї частини інструкцій пізніше. Ви маєте **лише** пропустити цей крок, якщо не хочете запускати програми на вашому комп'ютері.
>
> [Пропустити зміни](#making-changes-locally).
### Налаштування залежностей
#### Крок 1: Налаштуйте файл змінної середовища
API ключі та змінні середовища за замовчуванням зберігаються у файлі `sample.env`. Цей файл повинен бути скопійований до нового файлу з назвою `.env` , який отримав динамічний доступ під час встановлення кроку.
```console
# Створити копію "sample.env" і назвати його ".env".
# Заповніть його за допомогою необхідних ключів API і секретів:
# macOS / Linux
cp зразку. nv .env
# Windows
скопіюват .env .env
```
Ключі у файлі `.env`_не вимагаються_ зміни додатку локально. Ви можете залишити значення за замовчуванням, скопійовані від `sample.env` як є.
> [!TIP] Майте на увазі, якщо ви хочете використовувати такі послуги, як Auth0 або Algolia, вам необхідно отримати свої власні ключі API для цих сервісів та редагувати матеріали, відповідний до у `. nv` файл.
#### Крок 2: Встановлення залежностей
Цей крок встановить залежності для того, щоб додаток запустився:
```console
npm ci
```
#### Крок 3: Почати Монгольську БД і заготовити базу даних
Щоб запустити програму локально, вам потрібно буде запустити службу MongoDB.
> [!NOTE] Поки ви не повинні MongoDB працює в налаштуваннях, відмінних від дефолту, URL-адреса зберігається як значення `MONGOHQ_URL` у `. nv` файл повинен добре працювати. Якщо ви використовуєте користувацьку конфігурацію, змініть це значення за необхідності.
Запустити сервер MongoDB в окремому терміналі:
-На macOS & Ubuntu:
```console
mongod
```
-На Windows ви повинні вказати повний шлях до `mongod` виконуваного файлу
```console
"C:\Program Files\MongoDB\Server\3.6\bin\mongod"
```
Переконайтеся, що замість `3.6` встановлена вами версія
> [!TIP] Ви можете уникнути запуску MongoDB кожного разу, встановивши його як фоновий сервіс. Ви можете [дізнатися більше про це в документації для вашої ОС](https://docs.mongodb.com/manual/administration/install-community/)
Далі, давайте відправляємо базу даних. На цьому кроці ми запускаємо наступну команду, яка заповнює сервер MongoDB з деякими початковими наборами даних, які потрібні послугами. До них належать кілька схем, серед іншого.
```console
npm запустити насіння
```
#### Крок 4: Запуск клієнтського додатку freeCodeCamp та сервера API
Тепер ви можете запустити сервер API та клієнтські програми.
```console
розробка роботи npm
```
Єдина ця команда запустить всі сервіси, включаючи сервер API та клієнтські додатки, доступні для роботи.
> [!NOTE] Після того, відкрийте веб-браузер і **відвідайте <http://localhost:8000>**. Якщо застосунок завантажується, вітаю вас із – ви всі налаштовані! Тепер ми маємо копію безкоштовної навчальної платформи CodeCamp, яка працює на вашій локальній машині.
> [!TIP] Сервер API служить API на `http://localhost:3000`. Додаток Gatsby служить клієнтському додатку на `http://localhost:8000`
> Якщо ви відвідаєте <http://localhost:3000/explorer> ви повинні побачити наявні API.
## Увійдіть за допомогою локального користувача
Ваші локальні налаштування автоматично заповнюють локального користувача у базі даних. Натискання на кнопку `Увійдіть` автоматично автентифікує вас в локальній програмі.
Однак, доступ до сторінки портфеля користувача є трохи загадковим. У розробці Gatsby захоплює сторінки клієнта, і, отже, ви отримаєте сторінку `404` для портфеля користувача під час роботи локально.
Просто натисніть кнопку **"Перегляд сторінок 404"** переведе вас на правильну сторінку.
<details>
<summary>
Як увійти в систему під час роботи локального (скріншот)
</summary>
<br>
<imgsrc="https://user-images.githubusercontent.com/29990697/71541249-f63cdf00-2923-11ea-8a85-cefb6f9c9977.gif"alt="Як увійти в локальний робочий стіл"/>
</details>
## Введення змін локально
Тепер ви можете вносити зміни до файлів та закомітити зміни до вашого локального клону вашого форку.
Виконайте наступні дії:
1. Перевіряйте, що ви знаходитесь на `головній гілці`:
```console
git status
```
Ви повинні отримати результат наступним чином:
```console
На якійсь гілці
Ваша гілка оновлена з 'origin/master'.
нічого для коміту, робочий каталог чистий
```
Якщо ви не в Майстері або директорії які ви використовуєте не чисті, вирішити будь-які непогашені файли/коміти та перевірити `основний`:
```console
git перевірити головний код перевірки
```
2. Sync the latest changes from the freeCodeCamp upstream `master` branch to your local master branch:
> [!УВАГА] Якщо у вас є будь-який видатний пулл-реквест, який ви зробили з `майстер-` вашої гілки, ви втратите їх в кінці цього кроку.
>
> Ви повинні переконатися, що ваш запит на злиття буде злитий модератором перед виконанням цього кроку. Щоб уникнути цього сценарію, ви маєте **завжди** працювати на гілці, відмінну від `головного`.
Цей крок **буде синхронізувати останні зміни** з головного репозиторію freeCodeCamp. Важливо, щоб ви перегенерувати гілку на вершині останнього `верхнього потоку/майстра` якомога частіше, щоб уникнути конфліктів пізніше.
Жорстко скиньте гілку master за допомогою майстра freeCodeCamp майстра:
```console
git reset --hard upstream/master
```
Натисніть на головну гілку вашого походження, щоб мати чисту історію на GitHub:
```console
git push origin master - force
```
Ви можете перевірити свої поточні основні збіги з оновленням/майстром, виконавши відмінність:
```console
git diff вгору поток/майстер
```
Отримані результати повинні бути порожніми.
3. Створити нову гілку:
Робота над окремою гілкою для кожного питання допоможе зберегти локальну роботу в чистому режимі. Ви ніколи не повинні працювати над `майстром`. Це буде ґрунт вашої копії безкоштовного Кодуму і вам, можливо, доведеться почати з нового клона або виделки.
Check that you are on `master` as explained previously, and branch off from there:
```console
git оформити замовлення -b фікс/update-guide-for-xyz
```
Назва гілки має починатися з `виправлення/`, `функції/`, `документації/`і т. д. Уникати за допомогою номерів задач в гілках. Тримайте їх короткими, значущими та унікальними.
Деякі приклади добрих назв філій:
```md
fix/update-challenges-for-react
fix/update-guide-for-html-css
fix/platform-bug-sign-in-issues
feat/add-guide-article-for-javascript
translate/add-span-basic-html
```
4. Редагуйте сторінки та працюйте над кодом у вашому улюбленому текстовому редакторі.
5. Після того, як ви задоволені змінами, вам слід вибірково запускати freeCodeCamp локально для перегляду змін.
6. Переконайтеся, що ви виправили будь-які помилки та перевірте форматування ваших змін.
7. Перевірте та підтвердіть оновлення файлів:
```console
git status
```
Це повинно показати список `неіндексованих` файлів, які ви відредагували.
```console
Про філіал функції/документацію
Ваша гілка є найновішою з 'upstream/feat/documentation'.
Зміни не проіндексовані у коміті:
(використовуйте "git add/rm <file>... щоб оновити що буде комітовано)
(використовуйте "git checkout -- <file>. ."Скасувати зміни в робочому каталозі)
Змінено: CONTRIBUTING. d
змінено: docs/README.md
змінено: docs/how-to-setup-freecodecamp-локально. d
змінено: docs/how-to-work-on-guide-articles.md
...
```
8. Проіндексувати зміни і робити коміт:
У цьому кроці ви повинні лише відзначити файли, які ви редагували або додавали самі себе. Ви можете виконати скидання та вирішення файлів, які ви не маєте наміру змінювати при необхідності.
```console
git додати шлях/до/мій/змін/file.ext
```
Або ви можете додати всі `неіндексовані` файли в постановку файлу:
```console
git add .
```
Тільки файли, які були переміщені в старінгову зону, будуть додані після створення коміту.
```console
git status
```
Вихід:
```console
Про філіал функції/документацію
Ваша гілка є найновішою з 'upstream/feat/documentation'.
Зміни що будуть змінено:
(використати "git reset HEAD <file>..." на unstage)
модифіковано: CONTRIBUTING.md
модифіковано: docs/README.md
змінено: docs/how-to-set-freecodecamp-locally.md
modified: docs/how-to-work-on-guide-articles.md
```
Тепер ви можете затвердити зміни за допомогою короткого повідомлення так:
```console
git commit -m "виправлення: моє коротке повідомлення коміту"
```
Деякі приклади:
```md
фіксувати: оновлення довідкової статті для Java - для циклу
feat: додавайте статтю посібника для alexa skills
```
Необов'язково:
Ми наполегливо рекомендуємо створювати звичайне повідомлення комітів. Це хороша практика, яку ви побачите в деяких популярних репозиторіях з відкритим вихідним кодом. Як розробник, це спонукає вас стежити за стандартними практиками.
Деякі приклади звичайних повідомлень фіксації:
```md
виправляє: оновлення статті HTML посібника
що: оновлення скриптів збірки для функції Travis-CI
: додавання статті для приховування JavaScript
docs: оновлення керівних принципів розробки
```
Утримуйте їх коротко, не більше 50 символів. Ви завжди можете додати додаткову інформацію в опис повідомлення коміту.
Це займе не більше часу ніж нетрадиційне повідомлення, наприклад, 'файл оновлення' чи 'додати index.md'
Ви можете дізнатися більше про те, чому ви повинні використовувати звичайні коміти [тут](https://www.conventionalcommits.org/en/v1.0.0-beta.2/#why-use-conventional-commits).
9. Якщо ви перечитуєте, що вам необхідно редагувати файл або оновити повідомлення коміту після внесення змін до файлу, наприклад:
```console
git commit - amend
```
Це відкриє текстовий редактор за замовчуванням, як `nano`або`vi` , де можна редагувати заголовок повідомлення для комітів і додавати/редагувати опис.
10. Далі, ви можете перемістити свої зміни на свій форк:
```console
git push origin гілки/name-тут
```
## Запрошення запит на злиття (PR)
Після того, як ви вносили свої зміни, будь ласка, перевірте [як відкрити Pull Request](how-to-open-a-pull-request.md).
## Посилання на швидкі команди
Швидке посилання до тих команд, які вам знадобляться на локально.
| `npm ci` | Installs / переінсталювати всі залежності та завантажувачі різних служб. |
| `npm запустити насіння` | Аналізує всі файли тестів стрілянини та вставляє їх в MongoDB. |
| `розробка роботи npm` | Запускає freeCodeCamp API та клієнтські програми. |
| `тест npm` | Запускає всі тести JS в системі, включаючи клієнт, сервер, з'єднання і тести викликів. |
| `npm run test:client` | Запустити клієнтський тестовий набір. |
| `npm запускати тест:curriculum` | Запустити набір тестів для навчальної програми. |
| `npm запускати тест:curriculum --block='Basic HTML і HTML5'` | Перевірте певний блок. |
| `запущено npm test:curriculum --superblock='responsive-web-design'` | Перевірте особливий суперблок. |
| `npm запускати тестові навчальні програми` | Запустити набір тестів навчальних програм без переплавок після першої помилки |
| `npm запуск тесту:server` | Запустити тестовий набір серверів. |
| `npm бігає e2e` | Запускає Кіпру до кінця тестів. |
| `npm бігла чиста` | Видаляє всі залежності та очищує кеш. |
## Виправлення несправностей
### Проблеми з інсталяцією рекомендованих передумов
Ми регулярно розробляємо новіші та найпопулярніші операційні системи, такі як macOS 10.15 або пізніше, Ubuntu 18.04 або Windows 10 (з WSL2).
Рекомендується досліджувати конкретні питання щодо таких ресурсів, як Google, Stack Overflow та Stack Exchange. Є хороший шанс, що хтось зіткнувся з тією ж проблемою, і вже існує відповідь на ваш конкретний запит.
Якщо ви працюєте на іншій ОС та/або використовуєте проблеми, перегляньте [отримання довідки](#getting-help).
> [!УВАГА]
>
> Будь ласка, уникайте створення проблем GitHub для проблем з передумовами. Вони поза межами цього проекту.
### Проблеми з UI, шрифтами, збіркою помилок і т.д.
Якщо у вас виникають проблеми з UI, шрифти або дивіться помилки очищення збірки, можуть бути корисними:
```console
запускається npm чистий
npm ci
npm run seed
npm run
```
АБО
Використовувати ярлик
```
npm запустити чисть-розробку
```
Якщо ви продовжите стикатися з проблемами з збиранням, то рекомендується прибрати робочу область.
### Проблеми з API, увійдом, викликами сабмітів та ін.
Якщо ви не можете ввійти, а замість цього ви бачите банер з повідомленням про помилку, що про нього повідомлять до freeCodeCamp, будь ласка, двічі перевірте, чи не використовується ваш локальний порт `3000` іншою програмою.
**На Linux / macOS / WSL в Windows - З терміналу:**
```console
netstat -ab | зелені "3000"
tcp4 0 0.0.0:3000 DESKTOP LISTEN
```
**На Windows - з покращеної PowerShell:**
```powershell
netstat -ab | Select-String "3000"
TCP 0.0.0.0:3000 DESKTOP LISTENING
```
### Встановлення залежних проблем
Якщо у вас помилки при встановленні залежностей, будь ласка, переконайтеся, що ви не в обмеженій мережі або налаштування брандмауера не заважають вам отримати доступ до ресурсів.
Вперше налаштування може зайняти деякий час, в залежності від ширини вашої мережі. Потерпляче, якщо ви досі застрягли ми рекомендуємо використовувати GitPod замість автономної установки.
## Отримати допомогу
Якщо ви застрягли і потребуєте допомоги, дайте нам знати з запитом категорії ['учасників' на нашому форумі](https://forum.freecodecamp.org/c/contributors) або в чаті [учасників](https://gitter.im/FreeCodeCamp/Contributors) на Gitter.
Можливо, в консолі вашого браузера або в Bash / Terminal / командний рядок допоможе визначити проблему. Надайте це повідомлення про помилку в описі проблеми, щоб інші могли легше визначити проблему, і допомогти вам знайти роздільну здатність.
