Проект "AndSmi":

Шаблон сайта:

Шаблон страницы сайта "Заглушка":

Шаблон страницы сайта "404":

---

Краткая инструкция по работе

0. Правила и методология

• BEM-naming
• ESLint
• Stylelint

1. Стилизация проекта

• Все стили пишутся при помощи препроцессора SCSS
• Стили компонентов находятся в папке app/components/
• Стили для вспомогательных функций и переменных хранятся в папке app/assets/scss/helpers
• Собирающие файлы хранятся в папке app/assets/scss/bundle
• Основной файл, который стоит всегда подключать, хранится в папке app/assets/scss (main.scss)

2. Фото проекта

• Все фото данного проекта лежат в папке app/assets/img и разбросаны по соответствующим папкам

3. Шрифты

• Все шрифты хранятся в папке app/assets/fonts

4. SVG

• Все svg для генерации спрайта хранятся в папке app/assets/svg

5. JS-модули (пользовательский код)

• Все пользовательские модули имеют свои названия через нижнее подчеркивание и лежат в папке app/assets/js

6. Pug

• Весь код HTML пишется при помощи шаблонизатора Pug (Мопс)
• Верстка для компонентов лежит в папке app/components и разбита по соответствующим папкам компонент
• Верстка для страниц (а именно подключение компонентов к странице и настройка SEO-мета-тегов) расположены в папке app/assets/views
• Верстка для шаблона (основной шаблон, на котором базируется макет) находится в папке app/assets/templates в файле _template.pug
• Миксины и переменные для верстки хрантся в папке app/templates/helpers в соответствующих файлах _mixins.pug

7. Данные для Pug (заместо БД)

• Данные для всего проекта хранятся в файле data.json в папке data/

8. Сборка Gulp

1. DevDependencies:
   • Babel
   • Browser-sync
   • cross-env
   • eslint
   • fs
   • autoprefixer
   • concat
   • csso
   • data
   • group-css-media-queries
   • pug
   • rename
   • sass/node-sass
   • sourcemaps
   • svg-sprite
   • ttf2woff2
   • uglify/uglify-es
   • stylelint

Frontend-разработчик: