Все необходимые материалы с примерами кода, а также задания размещены в соответствующих разделах на WebPurple-Learn.
- Создаем аккаунт в github, логинимся;
- Fork'аем репозиторий с помощью кнопки "Fork" справа вверху;
- Переходим на страницу Fork'нутого репозитория на своем аккаунте;
- В настройках репозитория добавляем к репозиторию тренеров (Settings -> Collaborators);
- Открываем терминал
git bashв директории на локальном компьютере, где будет располагаться проект; - Клонируем свою копию репозитория на компьютер с помощью команды в терминале
git clone <url репозитория.git>(url репозитория можно скопировать из адресной строки или, нажав кнопку "clone or dowload", скопировать оттуда); - Устанавливаем модули с помощью команды
npm install.
В директории src размещены каталоги соответствующие темам практических работ. Каждая практическая работа выполняется в отдельной ветке.
Внутри директории, соответствующей теме практической работы, должны размещаться .js, .html, .css-файлы с выполненным заданием. Изначально директория содержит только файл README.md, в котором содержится описание для практической работы.
Каждое задание в практической работе должно быть выполнено в отдельном файле, который называется по имени задания, прим. task-01.js(task-01.html), где 01 - номер задания.
Если практическая работа подразумевает выполнение только одного задания, файл следует назвать task.js(task.html).
Для заданий .js:
Функция, являющаяся решением задания, должна быть экспортирована из файла решения с помощью инструкции module.exports = <имя_функции>.
Для заданий .html/.css:
HTML и CSS тестируется без каких-либо изменений.
Для того, чтобы протестировать CSS нужно описать его в теге <style /> и/или подключить .css-файл(ы) в HTML-документ соответствующего задания.
Для выполнения практической работы необходимо создать ветку (название соответствует теме практической работы) с помощью команды git checkout -b <название ветки> (переход в ветку осуществляется той же командой без ключа -b).
После выполнения задания необходимо выполнить commit изменений с помощью команды git commit -a -m "<комментарий>", после чего отправить изменения на GitHub с помощью команды git push origin <название ветки>.
На GitHub необходимо сделать pull request ветки задания в ветку master, а также запросить ревью у тренера (request review).
В случае подтверждения от тренера и успешного выполнения тестов тренеру необходимо подтвердить перенос кода из задания в ветку master. Успешно влитое ревью означает успешно завершённое задание. Таким образом, к концу обучения в репозитории должно быть 14 закрытых pull request, а также код всех выполненных заданий, распределённый по директориям, соответствующим темам, должен находиться в ветке master.
Для предварительной проверки правильности выполнения заданий используется система тестов, а для проверки правильности форматирования и оформления кода используется линтер. Тесты (если они есть) и линтер запускаются локально при выполнении commit, а также на стороне GitHub при создании pull request.
Для самопроверки тесты можно запустить из корневой папки командой npm test, линтер - npm run lint
В случае, если необходимо игнорировать замечания линтера, можно воспользоваться директивой отключения линтера eslint-disable-line (не рекомендуется). Директива оформляется в виде комментария в конце необходимой строки, после директивы лучше указать конкретное правило, которое нужно отключить, чтобы не упустить других замечаний.
console.log(a); // eslint-disable-line
console.log(b); // eslint-disable-line no-consoleВсе интересующие вопросы могут быть заданы тренеру, ниже представлено дополнение к некоторым моментам руководства в виде пошагового алгоритма.
Необходимо перейти на страницу своего репозитория на GitHub, кликнуть по пункту "Pull Request" в верхнем меню, далее нажать на кнопку "New pull request".
Слияние веток происходит по направлению, указанному стрелками в интерфейсе создания pull request, слева должна быть выбрана ветка "master" вашего репозитория, справа - ветка с практической работой, отправляемой на проверку.
После выбора веток в интерфейсе и нажатия кнопки Create pull request будет представлена форма создания pull request, в которой необходимо задать заголовок, соответствующий теме практической работы, а в поле комментария необходимо более развёрнуто описать проделанную работу и/или добавить текст задания. После заполнения формы необходимо нажать кнопку "Create pull request", после чего браузер выполнит перенаправление на страницу созданного pull request.
В случае, если тренер оставил замечания к pull request и не зачёл практическую работу, необходимо исправить замечания и выполнить push изменений в соответствующую ветку, после чего ответить на комментарии тренера, где описать результат проделанной работы.
Когда тренер зачёл практическую работу и все проверки тестов и линтера были выполнены, становится активной (зелёной) кнопка "Merge pull request", по нажатию на которую можно влить изменения из ветки практической работы в ветку master, что означает сдачу практической работы.
Подробнее про работу с Github тут - Как создать ветку, коммит, pull request с домашней работой в Github
Хорошая практика, особенно на начальных этапах, - придерживаться руководству по стилю программирования. Одним из таких руководств является Airbnb JavaScript Style Guide, с ним необходимо ознакомиться перед началом курса. Так же в заданиях установлен линтер от Airbnb, который будет проверять код на соответствие данным правилам и подсказывать что необходимо исправить.
Для разработки вам понадобится VS Code.
Необходимо установить следующие расширения:
Опционально:
Далее установите следующую конфигурацию VS Code: (F1 -> начните вводить Open setting (JSON)) и вставьте/добавьте конфигурацию ниже:
{
"files.autoSave": "onFocusChange",
"editor.codeActionsOnSave": {
"source.fixAll": true
},
"[css]": {
"editor.formatOnSave": true,
"editor.defaultFormatter": "aeschli.vscode-css-formatter",
},
"[html]": {
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true,
},
}Замечания и пожелания можно оформить в виде Issues в этом репозитории.