https://github.com/htmlacademy/accelerator-project-2
Второй проект Акселератора HTML Academy
https://github.com/htmlacademy/accelerator-project-2
Last synced: 5 months ago
JSON representation
Второй проект Акселератора HTML Academy
- Host: GitHub
- URL: https://github.com/htmlacademy/accelerator-project-2
- Owner: htmlacademy
- Created: 2024-08-05T08:11:11.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-08-21T05:00:48.000Z (almost 2 years ago)
- Last Synced: 2025-04-25T20:43:57.135Z (about 1 year ago)
- Language: JavaScript
- Size: 11.5 MB
- Stars: 1
- Watchers: 0
- Forks: 105
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# accelerator-first-project
Стартовый репозиторий для работы над первым проектом в «Акселераторе» профессии «Фронтенд-разработчик»
## Начало работы
1. Установите node.js
2. Проверьте версию node.js с помощью `node --version`
3. Поддерживаемая версия сборки 18 или 20
4. Установите зависимости с помощью
```shell
npm i
```
5. Запустите проект с помощью
```shell
npm run dev
```
6. Дополнительные команды для работы со сборкой
- `npm run convert-rastr`: создайте webp версии растровых изображений в папке `source/img/`;
- `npm run dev` запускает сервер для разработки;
- `npm run build` собирает оптимизированную версию проекта в папке `dist`;
- `npm run preview` запускает сервер с оптимизированной версией;
- спрайт с иконками собран из файлов в папке `source/img/sprite/`;
- для доступа к спрайту из `html` используйте путь `href="/__spritemap#sprite-{название файла иконки}"`;
7. В файле `index.html` в папке `source` описаны подсказки по структуре вашего проекта.
## Самопроверки
Тестирование Pixel Perfect
Запустить тестирование вашего проекта можно с помощью
```shell
npm run test
```
Тестовый фреймворк обращается к адресу `localhost:3000` поэтому сервер должен быть запущен с `npm run dev`, запускайте команду тестирования в новом терминале, не закрывая сервер с проектом.
В проекте используется множество дополнительных инструментов для самопроверки. Используйте их во время работы и перед отправкой вашего проекта:
- `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.