Страницы свёрстаны с помощью сборщика Gulp. Перед использованием прочтите инструкцию.

Перед запуском нужно установить следующие программы:

В папке проекта выполните команду (с помощью CMD, PowerShell или любого другого терминала):

npm i

Далее установим Gulp глобально:

npm i gulp -g

Запуск Gulp (запустится сервер, который откроет локальную страницу и будет синхронизировать её, так же много других автоматизаций):

gulp

Создание билда для продакшн (находится в папке "dist"):

gulp build

Деплой (загрузка вёрстки на хостинг):

gulp deploy

HTML разделён на разны компоненты, которые находятся по пути:

app/parts

Они встраиваются в корневых файлах, которые вы видите папке "app".

Но так как бессмысленно создавать кучу компонентов в вёрстке, чтобы отвечать за каждый компонент как в CMS, я для примера скопировал файлы в папку "production", которая никак не трогается Gulp'ом. После билда тут можно спокойно менять текст. А если требуется заменить стили - просто копируем в папку "app/css" этот файл:

dist/css/app.min.css

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

Они добавляются в папке:

app/images/src

После этого они сжимаются и копируются в соседнюю папку:

app/images/dist

Главный CSS в проекте написан через предпроцессор Sass, находится в пути:

app/styles/sass/main.sass

Рядом с ним находится конфиг с переменными:

app/styles/sass/_config.sass

JS находится по пути:

app/js/app.js

Скопируйте содержимое папки "dist" на хостинг.

В корневом файле gulpfile.js, строке 124 есть функция:

    function deploy() {
        return src('dist/')
            .pipe(rsync({
                root: 'dist/',
                hostname: '[email protected]',
                destination: 'yousite/public_html/',
                clean: true, // Mirror copy with file deletion
                include: [/* '*.htaccess' */], // Included files to deploy,
                exclude: [ '**/Thumbs.db', '**/*.DS_Store' ],
                recursive: true,
                archive: true,
                silent: false,
                compress: true
    }))
}

В ней мы изменяем данные для FTP подключения, чтобы автоматически копировать файлы на хост с помощью команды:

gulp deploy