freeCodeCamp/how-to-setup-freecodecamp-locally.md at 6f405f70bc8ca3e7050f76b9164f3df1cf6e346b

Files

github-actions[bot] 84c5c641c3 chore(docs,i8n): processed translations from crowdin (#39769 )

Co-authored-by: Crowdin Bot <support+bot@crowdin.com>

2020-10-02 00:28:40 +05:30

37 KiB

Raw Blame History

Следуйте этим инструкциям для установки freeCodeCamp локально на вашей системе. Рекомендуется вносить регулярные взносы.

Для некоторых рабочих потоков вклада вам нужно запустить freeCodeCamp локально. Например, предварительный просмотр вызовов программирования или отладка и исправление ошибок в кодовой базе.

[!TIP] Если вы не заинтересованы в установке freeCodeCamp локально рассмотрите возможность использования Gitpod, бесплатного окружения для разработчиков.

(Начинает готовое к исходному коду окружение для freeCodeCamp в вашем браузере.)

Подготовить вашу локальную машину

Начните с установки необходимого программного обеспечения для вашей операционной системы.

В первую очередь мы поддерживаем разработку на системах *nix. Наши сотрудники и участники сообщества регулярно работают с кодом с помощью инструментов, установленных на Ubuntu и macOS.

Мы также поддерживаем Windows 10 через WSL2, который вы можете подготовить, прочитав это руководство.

Некоторые члены сообщества также разрабатываются на Windows 10 с Git для Windows (Git Bash) и другими инструментами, установленными в Windows. На данный момент у нас нет официальной поддержки такой установки, мы рекомендуем вместо этого использовать WSL2.

Требования:

Необходимые предпосылки	Версии	Примечания
Node.js	`12.x`	График LTS
npm (поставляется с узлом)	`6.x`	У вас нет LTS релизов, мы используем версию с узлами LTS
MongoDB Community Server	`3.6`	Примечания к выпуску, Примечание: в настоящее время мы на `3.6`, планируется обновление.

[!DANGER] Если у вас есть другая версия, пожалуйста, установите рекомендованную версию. Мы можем поддерживать только вопросы установки для рекомендованных версий. Смотрите устранения неполадок для деталей.

Если Node.js уже установлен на вашей машине, выполните следующие команды для проверки версий:

узел -v
npm -v

[!TIP] Мы настоятельно рекомендуем обновиться до последних стабильных версий программных продуктов, перечисленных выше, также известных как долговременная поддержка (LTS).

После установки необходимых предварительных условий вам нужно подготовить свою среду разработки. Это часто используется для многих процессов разработки, и вам нужно будет сделать это только один раз.

Выполните следующие шаги, чтобы ваше окружение было готово:

Установите Git или ваш любимый Git клиент, если вы еще этого не сделали. Обновление до последней версии; версия, поставляемая в комплекте с вашей операционной системой, может устареть.
(Необязательно, но рекомендуется) Настройка SSH ключа для GitHub.
Установите редактор кода по вашему выбору.

Мы настоятельно рекомендуем использовать Visual Studio Code или Atom. Это отличные, бесплатные и открытые исходные коды.
Настройте линию для редактора кода.

Вы должны иметь ESLint запущен в вашем редакторе, и он выделит все, что не соответствует бесплатному Руководству по стилю JavaScript.

[!TIP] Пожалуйста, не игнорируйте любые ошибки линейки. Они предназначены для помощи и обеспечения чистой и простой кодовой базы.

Форкнуть репозиторий на GitHub

Forking - это шаг, на котором вы получите свою собственную копию основного репозитория бесплатного CodeCamp (например repo) на GitHub.

Это важно, так как это позволяет работать на вашей собственной копии freeCodeCamp на GitHub, или скачать (клонировать) ваш репозиторий для работы на локальном компьютере. Позднее вы сможете запросить изменения для выгрузки их в основной репозиторий из вашего форка через pull request (PR).

[!TIP] Главный репозиторий на https://github.com/freeCodeCamp/freeCodeCamp часто называется исходным репозиторием.

Ваш форк на https://github.com/YOUR_USER_NAME/freeCodeCamp часто называется репозиторием origin.

Выполните следующие шаги, чтобы форкнуть https://github.com/freeCodeCamp/freeCodeCamp репозиторий:

Перейдите в репозиторий freeCodeCamp на GitHub: https://github.com/freeCodeCamp/freeCodeCamp
Нажмите кнопку "Форк" в правом верхнем углу интерфейса (подробности здесь)
После того, как репозиторий был форкнут, вы будете переданы в вашу копию репозитория freeCodeCamp на https://github.com/YOUR_USER_NAME/freeCodeCamp

Как форкнуть freeCodeCamp на GitHub (скриншот)

Клонируйте свой вилок из GitHub

Клонирование - это место, где вы загрузите копию репозитория с удаленного `` , принадлежащего вам или кому-либо другому. В вашем случае это удаленное местоположение - ваш форк репозиторий freeCodeCamp, который должен быть доступен на https://github.com/YOUR_USER_NAME/freeCodeCamp.

Выполните эти команды на вашей локальной машине:

Откройте терминал / Командный подсказка / Shell в каталоге проектов

например: /yourprojectsdirectory/
Клонируйте ваш форк свободного CodeCamp, заменив YOUR_USER_NAME на ваше имя пользователя GitHub
```
git clone --depth=1 https://github.com/YOUR_USER_NAME/freeCodeCamp.git
```

Это загрузит весь репозиторий freeCodeCamp в каталог ваших проектов.

Примечание: --depth=1 создает мелкий клон вилки с только последней историей/фиксацией.

Настроить синхронизацию от родителя

Теперь, когда вы скачали копию вашего форка, вам нужно будет настроить удаленный вверх в родительский репозиторий.

Как упоминалось ранее, основной репозиторий ссылается вверху репозитория. Ваш форк называется репозиторием origin.

Вам нужна ссылка из локального клона на исходный репозиторий в дополнение к происхождению репозиторию. Это позволяет синхронизировать изменения из основного репозитория без необходимости повторного клонирования и форкирования.

Изменить каталог на новый каталог freeCodeCamp:
```
cd freeCodeCamp
```
Добавить удаленную ссылку на основной репозиторий freeCodeCamp:
```
git удалённое добавление вверх https://github.com/freeCodeCamp/freeCodeCamp.git
```

Убедитесь, что конфигурация выглядит правильно:

git удалённый -v

Вывод должен выглядеть следующим образом:

origin https://github.com/YOUR_USER_NAME/freeCodeCamp.git (fetch)
origin https://github.com/YOUR_USER_NAME/freeCodeCamp.git (push)
upstream https://github.com/freeCodeCamp/freeCodeCamp.git (fetch)
upstream https://github.com/freeCodeCamp/freeCodeCamp.git (push)

Запуск freeCodeCamp локально

Теперь, когда у вас есть локальная копия freeCodeCamp, вы можете выполнить эти инструкции, чтобы запустить его локально. Это позволит вам:

Просмотреть редактирование страниц в том виде, в каком они будут отображаться на платформе обучения.
Работа над вопросами, связанными с пользовательским интерфейсом, и улучшениями.
Отладка и исправление проблем с серверами приложений и клиентскими приложениями.

Если вы столкнулись с проблемами, сначала выполните веб-поиск по вашей проблеме и посмотрите, что она уже была отвечена. Если вы не можете найти решение, пожалуйста, найдите на нашей странице GitHub проблемы и сообщите о проблеме, если она еще не была зарегистрирована.

Как всегда, не стесняйтесь прыгать в наш Чат участника на Gitter или наш сервер Discord, для быстрых запросов.

[!TIP] Вы можете пропустить запуск freeCodeCamp локально, если вы просто редактируете файлы. Например, выполнение перебазирования ``, или разрешение конфликтов слияния.

Вы всегда можете вернуться к этой части инструкций позже. Вам следует только пропустить этот шаг, если вам не нужно запускать приложения на компьютере.

Перейти к внесению изменений.

Настройка зависимостей

Шаг 1: Настройка файла переменной окружения

По умолчанию ключи API и переменные окружения хранятся в файле sample.env. Этот файл должен быть скопирован в новый файл с именем .env , который динамически доступен во время шага установки.

# Создайте копию "sample.env" и назовите его ".env".
# Запустите его необходимыми ключами API и секретами:

# macOS / Linux
cp sample. nv .env

# Windows
копировать sample.env .env

Ключи в файле .env не должны быть изменены для локального запуска приложения. Вы можете оставить скопированные значения по умолчанию из sample.env как есть.

[!TIP] Имейте в виду, если вы хотите использовать такие сервисы, как Auth0 или Algolia, вам придется получить свои собственные ключи API для этих сервисов и соответственно редактировать записи в . nv файл.

Шаг 2: Установка зависимостей

Этот шаг установит зависимости, необходимые для запуска приложения:

npm ci

Шаг 3: Запуск MongoDB и инициализация базы данных

Прежде чем вы сможете запустить приложение локально, вам нужно запустить службу MongoDB.

[!ПРИМЕЧАНИЕ] Если у вас не запущен MongoDB, отличный от настроек по умолчанию, URL, сохраненный как значение MONGOHQ_URL в . nv файл должен работать нормально. Если вы используете пользовательскую конфигурацию, измените это значение при необходимости.

Запустить сервер MongoDB в отдельном терминале:

На macOS & Ubuntu:
```
mongod
```
В Windows, вы должны указать полный путь к двоичному файлу
```
"C:\Program Files\MongoDB\Server\3.6\bin\mongod"
```
Обязательно замените 3.6 версией, которую вы установили

[!TIP] Вы можете избегать запуска MongoDB каждый раз, установив его в качестве фоновой службы. Вы можете узнать больше об этом в документации для вашей ОС

Далее, давайте раздадим базу данных. На этом этапе мы запускаем команду ниже, которая заполняет сервер MongoDB некоторыми первоначальными наборами данных, которые необходимы службам. Они включают в себя несколько схем, в том числе и другие.

seed npm

Шаг 4: Запустите клиентское приложение freeCodeCamp и API сервер

Теперь вы можете запустить сервер API и клиентские приложения.

разработка npm пробега

Эта единственная команда запустит все сервисы, включая API сервер и клиентские приложения, доступные для работы.

[!ПРИМЕЧАНИЕ] После готовности, откройте веб-браузер и посетите http://localhost:8000. Если приложение загружается, поздравляем – все готово! Теперь у вас есть копия бесплатной учебной платформы CodeCamp, работающей на локальной машине.

[!TIP] Сервер API обслуживает API по адресу http://localhost:3000. Приложение Gatsby обслуживает клиентское приложение на http://localhost:8000

Если вы посещаете http://localhost:3000/explorer , вы увидите доступные API.

Войти с помощью локального пользователя

Ваша локальная настройка автоматически заполняет локальный пользователь в базе данных. Нажатие кнопки Войти автоматически аутентифицирует вас в локальном приложении.

Однако, доступ к странице пользовательского портфолио немного сложный. В процессе развития, Gatsby берет на себя обслуживание клиентских страниц и, следовательно, вы получите 404 страницу для пользовательского портфолио при работе локально.

Просто нажмите кнопку "Предварительный просмотр пользовательской страницы переведет вас на правильную страницу.

Как войти при локальной работе (скриншот)

Как войти в систему при локальной работе

Создание локальных изменений

Теперь вы можете внести изменения в файлы и подтвердить изменения в локальный клон вашего форка.

Выполните следующие шаги:

Проверьте, что вы находитесь на главной ветке:
```
git status
```
Вы должны получить вывод следующим образом:
```
На ветке хозяин
Ваша ветка обновлена до версии 'origin/master'.

ничего для фиксации, рабочий каталог очищает
```
Если вы не владеете мастер-каталогом или ваш рабочий каталог нечистый, исправьте все оставшиеся файлы/коммиты и просмотрите мастер-:
```
Мастер проверки git
```
Синхронизировать последние изменения из freeCodeCamp вверху мастер- ветки к вашей локальной ветке:

[!ВНИМАНИЕ] Если у вас есть выдающийся запрос на слияние, который вы сделали из главной ветки вашего форка, вы потеряете их в конце этого шага.

Перед выполнением этого шага вы должны убедиться, что запрос на слияние будет принят модератором. Чтобы избежать этого сценария, вы должны всегда работать с веткой , отличной от master.

Этот шаг синхронизирует последние изменения с основного репозитория freeCodeCamp. Важно перебазировать свою ветку поверх последних вверх/мастер как можно чаще, чтобы избежать конфликтов позже.

Обновите вашу локальную копию freeCodeCamp исходного репозитория:
```
git выгрузить вверх
```
Тяжелый сброс вашей ветки мастера с помощью мастера freeCodeCamp:
```
git сброс --hard upstream/master
```
Отправьте вашу главную ветку в исходную среду, чтобы иметь чистую историю на ветке GitHub:
```
git толкайте отправителя --force
```
Вы можете проверить соответствие вашего текущего мастера выше/мастер путём дифференцирования:
```
git diff вверх/мастер
```
Результирующий вывод должен быть пустым.
Создать новую ветку:

Работа над отдельной веткой по каждой проблеме поможет вам сохранить чистоту локальной копии работы. Вы никогда не должны работать на мастер-. Это почтит вашу копию FreeCodeCamp, и вам придется начать с свежих клонов или вилок.

Проверьте, что вы на мастер- как объяснялось ранее, и оттуда ветка:
```
git checkout -b fix/update-guide-for-xyz
```
Имя вашей ветки должно начинаться с fix/, feat/, docs/, и т.д. Избегайте использования номеров замечаний в ветвях. Избегайте использования номеров замечаний в ветвях. Держите их короткими, значимыми и уникальными.

Примерами хороших названий филиалов являются:
```
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-spanish-basic-html
```
Редактируйте страницы и работайте с кодом в Вашем любимом текстовом редакторе.
После того, как вы будете довольны изменениями, вы должны запускать freeCodeCamp локально для просмотра изменений.
Убедитесь, что вы исправили ошибки и проверьте форматирование ваших изменений.

Проверьте и подтвердите обновления файлов:

git status

Это должно показывать список неизмененных файлов файлов, которые вы редактировали.

В ветке feat/documentation
Ваша ветка актуальна с 'upstream/feat/documentation'.

Изменения:
(используйте "git reset HEAD <file>..." на unstage)

    изменено: CONTRIBUTING.md
    изменено: docs/README.md
    изменено: docs/how-to-setup-freecodecamp-locally.md
    изменено: docs/how-to-work-on-guide-articles.md

Этап изменений и исправление:

На этом шаге вы должны отметить только те файлы, которые вы отредактировали или добавили сами. Вы можете выполнить сброс и разрешить файлы, которые вы не намерены изменять, если это необходимо.
```
git добавить путь к/мю/изменен/файл.ext
```
Или вы можете добавить все неразбитые файлы в промежуточную область:
```
git add .
```
Только файлы, которые были перемещены в промежуточную область, будут добавлены при создании коммита.
```
git status
```
Выход:
```
В ветке feat/documentation
Ваша ветка актуальна с 'upstream/feat/documentation'.

d
    изменено: docs/README.md
    изменено: docs/how-to-setup-freecodecamp-locally. d
    изменено: docs/how-to-work-on-guide-articles.md
```

...


Теперь вы можете зафиксировать изменения с коротким сообщением так:

```console
git commit -m "fix: my short commit message"

Некоторые примеры:

исправления : статья руководства по обновлению Java - для циклической функции
: добавьте статью руководства для alexa навыков

Дополнительно:

Мы настоятельно рекомендуем делать обычные коммиты. Это хорошая практика, которую вы увидите на некоторых популярных репозиториях с открытым исходным кодом. Как разработчик, это побуждает вас следовать стандартным практикам.

К некоторым примерам обычных обязательств относятся:

исправление: обновить статью HTML-руководства
исправлено: обновить сценарии сборки для функции Travis-CI
: добавить статью для JavaScript-hoisting
документа: обновить рекомендации

Держите эти короткие, не более 50 символов. Вы всегда можете добавить дополнительную информацию в описание сообщения.

Это займет какое-либо дополнительное время, чем нестандартное сообщение, например 'update file' или 'add index.md'

Вы можете узнать больше о том, почему использовать обычные коммиты здесь.

Если вы понимаете, что вам нужно изменить файл или обновить сообщение о коммите, вы можете сделать это после редактирования файлов:
```
git commit --change
```
Это откроет текстовый редактор по умолчанию, например nano или vi , где вы можете редактировать заголовок сообщения фиксации и добавить/редактировать описание.
Далее, вы можете перенести свои изменения в ваш форк:
```
git push ветка/имя отправителя-здесь
```

Предложение Pull Request (PR)

После того, как вы зафиксировали изменения, проверьте здесь , как открыть Pull Request.

Ссылка на быстрые команды

Быстрая ссылка на команды, которые вам понадобятся при работе на месте.

команда	описание
`npm ci`	Установки / переустановка всех зависимостей и загрузок различных служб.
`seed npm`	Обрабатывает все вызовы markdown файлы и вставляет их в MongoDB.
`разработка npm пробега`	Запускает сервер API freeCodeCamp и клиентские приложения.
`тест npm`	Запустите все тесты JS в системе, включая клиент, сервер, lint и тестирование тестов.
`запуск npm тест:client`	Запустите клиентский тестовый набор.
`тест npm:curriculum`	Запустите набор тестов по учебной программе.
`npm запустить тест:учебный план --block='Основы HTML и HTML5'`	Тест конкретного блока.
`npm запуск test:curriculum --superblock='responsive-web-design'`	Тест конкретного SuperBlock.
`запуск npm теста-учебная программа полномасштабной работы`	Запустите тестовый набор для обучения, без исправления после первой ошибки
`запуск npm тест:server`	Запустите набор тестовых приложений.
`запуск npm e2e`	Для завершения тестов запустите Cypress find.
`очистка npm`	Удаление всех зависимостей и очистка кэша.

Устранение проблем

Проблемы с установкой рекомендованных предпосылок

Мы регулярно разрабатываем на последних или наиболее популярных операционных системах, таких как macOS 10.15 или позже, Ubuntu 18.04 или более поздней и Windows 10 (с WSL2).

Рекомендуется изучить ваш конкретный вопрос о ресурсах, таких как Google, Stack Overflow и Stack Exchange. Есть шанс, что кто-то столкнулся с такой же проблемой и уже есть ответ на ваш конкретный запрос.

Если вы используете другую ОС и/или до сих пор испытываете проблемы, см. получение помощи.

[!ВНИМАНИЕ]

Пожалуйста, не создайте GitHub проблемы для необходимых проблем. Они выходят за рамки этого проекта.

Проблемы с пользовательским интерфейсом, шрифтами, ошибками сборки и т.д.

Если вы столкнулись с проблемами с интерфейсом, шрифтами или увидели ошибки сборки, то очистка может быть полезна:

запуск npm очистить
npm ci
npm запустить seed
npm запустить develop

ИЛИ

Использовать ярлык

npm запуск чисто-и-разработка

Если вы продолжаете сталкиваться с проблемами со сборкой, рекомендуется очистить рабочую область.

Используйте git clean в interative режиме:

git очистить -ifdX

Как очистить git неотслеживаемые файлы (скриншот)

Проблемы с API, Вход, Вызовы и т.д.

Если вы не можете войти в систему, и вместо этого вы увидите баннер с сообщением об ошибке, о нем будет сообщено freeCodeCamp, убедитесь, что ваш локальный порт 3000 не используется другой программой.

На Linux / macOS / WSL на Windows - От терминала:

netstat -ab | grep "3000"

tcp4 0 0 0.0.0:3000 ПОЛУЧЕНО

На Windows - с высочайшего уровня PowerShell:

netstat -ab | Выборочная строка "3000"

TCP 0.0.0:3000 ПОЛУЧЕНИЕ

Проблемы установки зависимостей

Если вы получаете ошибки при установке зависимостей, Убедитесь, что вы не находитесь в ограниченной сети или настройки брандмауэра не мешают вам получить доступ к ресурсам.

Первая настройка может занять некоторое время в зависимости от вашей пропускной способности сети. Будьте терпеливы, и если вы все еще запомним с помощью GitPod вместо автономной настройки.

Получение помощи

Если вы застряли и нуждаетесь в помощи, Сообщите нам, попросив в категории "Участники" на нашем форуме или чат авторов на Gitter.

Возникла ошибка в консоли вашего браузера или Bash / Terminal / Command Line которая поможет идентифицировать проблему. Предоставьте это сообщение об ошибке в описании проблемы, чтобы другие могли легко идентифицировать проблему и помочь вам найти решение.

37 KiB Raw Blame History Unescape Escape