Стартовый репозиторий для работы над первым проектом в «Акселераторе» профессии «Фронтенд-разработчик»
- Установите node.js
- Проверьте версию node.js с помощью
node --version
- Поддерживаемая версия сборки 18+
- Установите зависимости с помощью
npm i
- Запустите проект с помощью
npm run dev
- Дополнительные команды для работы со сборкой
npm run convert-rastr
: создайте webp версии растровых изображений в папкеsource/img/
;npm run dev
запускает сервер для разработки;npm run build
собирает оптимизированную версию проекта в папкеdist
;npm run preview
запускает сервер с оптимизированной версией;- спрайт с иконками собран из файлов в папке
source/img/sprite/
; - для доступа к спрайту из
html
используйте путьhref="/__spritemap#sprite-{название файла иконки}"
;
- В файле
index.html
в папкеsource
описаны подсказки по структуре вашего проекта.
Тестирование Pixel Perfect
Запустить тестирование вашего проекта можно с помощью
npm run test
Тестовый фреймворк обращается к адресу localhost:3000
поэтому сервер должен быть запущен с npm run dev
, запускайте команду тестирования в новом терминале, не закрывая сервер с проектом.
На windows масштаб дисплея в системе 100%
В проекте используется множество дополнительных инструментов для самопроверки. Используйте их во время работы и перед отправкой вашего проекта:
npm run w3c
: проверяет валидность HTML;npm run linthtml
: проверяет разметку по правилам linthtml;npm run html-validate
: проверяет HTML;npm run lint-bem
: проверяет БЭМ;npm run stylelint
: проверяет стили по правилам stylelint;npm run lint-js
: проверяет скрипты по правилам eslint;npm run ls-lint
: проверяет именование файлов и папок;npm run editorconfig
: проверяет editorconfig.