{"id":43318994,"url":"https://github.com/alexsoin/pepelac","last_synced_at":"2026-02-01T22:11:18.994Z","repository":{"id":42555174,"uuid":"225056568","full_name":"alexsoin/pepelac","owner":"alexsoin","description":"PEPELAC - Современный инструментарий для вёрстки и создания статичных сайтов с использованием vitejs","archived":false,"fork":false,"pushed_at":"2024-11-16T20:56:54.000Z","size":2452,"stargazers_count":50,"open_issues_count":0,"forks_count":12,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-11-16T21:29:40.148Z","etag":null,"topics":["bootstrap","html","javascript","layout","scss","site-layout","starter","starter-kit","ts","twig","vite","vitejs","web-development"],"latest_commit_sha":null,"homepage":"","language":"Twig","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/alexsoin.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2019-11-30T18:54:27.000Z","updated_at":"2024-11-16T20:56:58.000Z","dependencies_parsed_at":"2023-12-11T21:28:40.615Z","dependency_job_id":"918d2295-c09f-470c-81b7-99a20ac7ae8a","html_url":"https://github.com/alexsoin/pepelac","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/alexsoin/pepelac","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexsoin%2Fpepelac","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexsoin%2Fpepelac/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexsoin%2Fpepelac/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexsoin%2Fpepelac/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/alexsoin","download_url":"https://codeload.github.com/alexsoin/pepelac/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexsoin%2Fpepelac/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28992769,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-01T22:01:47.507Z","status":"ssl_error","status_checked_at":"2026-02-01T21:58:37.335Z","response_time":56,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["bootstrap","html","javascript","layout","scss","site-layout","starter","starter-kit","ts","twig","vite","vitejs","web-development"],"created_at":"2026-02-01T22:11:18.361Z","updated_at":"2026-02-01T22:11:18.989Z","avatar_url":"https://github.com/alexsoin.png","language":"Twig","funding_links":[],"categories":[],"sub_categories":[],"readme":"![template engine - twig](https://img.shields.io/static/v1?label=template\u0026message=twig\u0026color=%2300A95C\u0026style=for-the-badge)\n![node.js](https://img.shields.io/badge/Node.js-339933?style=for-the-badge\u0026logo=nodedotjs\u0026logoColor=white)\n![vite](https://img.shields.io/badge/Vite-B73BFE?style=for-the-badge\u0026logo=vite\u0026logoColor=FFD62E)\n![bootstrap](https://img.shields.io/badge/Bootstrap-563D7C?style=for-the-badge\u0026logo=bootstrap\u0026logoColor=white)\n![sass](https://img.shields.io/badge/Sass-CC6699?style=for-the-badge\u0026logo=sass\u0026logoColor=white)\n![javascript](https://img.shields.io/badge/JavaScript-323330?style=for-the-badge\u0026logo=javascript\u0026logoColor=F7DF1E)\n\n# PEPELAC - frontend boilerplate\n\n![logo](https://user-images.githubusercontent.com/3787132/176785257-2fa84f95-acc2-4ecb-a5af-df0efaf571d3.svg)\n\nPEPELAC - Современный инструментарий для вёрстки и создания статичных сайтов.\n\nИспользуются современные инструменты для разработки сайтов, возможно использование как typescript, так и javascript кода. При использовании vscode будут предложены к установке дополнения, помогающие придерживаться единой стилистики кода при командной разработки.\n\n## Требования к окружению\n\n- node.js\n- git\n\n## Установка\n\n### 1. Клонирование и инициализация\n\nСкачайте файлы с github или клонируйте его c помощью команды:\n\n```bash\ngit clone https://github.com/alexsoin/pepelac.git\n```\n\nИнициализация проекта(Работает только в UNIX системах)\n\n```bash\n./init\n```\n\n### 2. Установки зависимостей проекта\n\nДля установки зависимостей проекта необходимо в командной строке ввести команды:\n\n```bash\nnpm i\n```\n\nЕсли требуются дополнительные пакеты, то для их установки нужно выполнить команду:\n\n- Установка пакета, при этом информация о нём, автоматически прописывается в секцию \"devDependencies\" файла \"\n  package.json\"\n\n```bash\nnpm i -D название_пакета\n```\n\n- Установка пакета, при этом информация о нём, автоматически прописывается в секцию \"dependencies\" файла \"package.json\"\n\n```bash\nnpm i название_пакета\n```\n\n## Как использовать окружение\n\n- `npm run dev` - запуск live-server\n- `npm run build` - сборка проекта\n- `npm run lint:script` - линтинг скриптов\n- `npm run lint:style` - линтинг стилей\n\n*Чтобы исправить ошибки линтинга запустите команду с дополнительным параметром `-- --fix`*\n\n## Список инструментов\n\nОкружение, предназначенное для разработки фронтенд проекта, построено на базе следующих инструментов:\n\n- **node.js** (среды, в которой будет выполняться окружение);\n- **npm** (пакетного менеджера, входящего в Node.js; будет использоваться для загрузки плагинов и фронтенд\n  пакетов);\n- **popover, bootstrap** (пакеты, которые будут использоваться для сборки css и js частей сайта);\n\n## Файловая структура проекта\n\n```bash\n├── .vscode/                   # дополнительная конфигурация редактора vs code\n│   ├── extensions.json        # список рекомендуемых дополнений\n│   └── settings.json          # настройки среды\n├── init                       # инициализатор проекта\n├── dist/                      # скомпилированный код проекта, готовый для размещения на сервере\n├── public/                    # статические файлы проекта (изображения, видео и т.д.)\n├── src/                       # исходники\n│   ├── assets/                # ресурсы, используемые в проекте (изображения, шрифты и т.д.)\n│   │   ├── fonts/             # шрифты\n│   │   └── img/               # изображения\n│   ├── data/                  # массивы данных для вывода значений в twig файлах\n│   │   └── site.js            # файл для вывода данных\n│   ├── scripts/               # js файлы\n│   │   ├── helpers/           # вспомогательные js файлы\n│   │   ├── index.js           # точка входа js файлов\n│   │   └── main/              # js файлы проекта\n│   ├── styles/                # scss файлы\n│   │   ├── helpers/           # вспомогательные scss файлы\n│   │   ├── index.scss         # точка входа scss файлов\n│   │   └── main/              # scss файлы проекта\n│   │       ├── base.scss      # пользовательские стили\n│   │       ├── fonts.scss     # подключение шрифтов\n│   │       └── variables.scss # переменные стилей\n│   ├── templates/             # шаблоны и куски кода\n│   │   ├── layouts/           # шаблоны страниц\n│   │   └── partials/          # подключаемые куски кода\n│   └── views/                 # twig файлы страниц проекта (преобразуются в html)\n│       ├── 404.twig           # страница ошибки 404\n│       ├── index.twig         # главная страница\n│       └── ui.twig            # список страниц сайта\n└── vite.config.ts             # конфигурационный файл vitejs\n```\n\n### `src/scripts/`\n\nВ папке `js` находится файл `index.js`, который является входной точкой для js файлов.\n\nПри сборке проекта, все импорты внешних зависимостей(таких как boostrap) будут собираться в единый файл `index.js` который после сборки будет находиться в папке `dist/assets/js/`.\n\n### `src/styles/`\n\nПапка `scss` отведена под стили. В данной папке находятся следующие файлы:\n\n- `index.scss` - импорты файлов, содержимое которых необходимо включить в итоговый файл стилей\n- `main/base.scss` - используется для написания своих стилей\n- `main/variables.scss` - содержит SCSS переменные, с помощью которых будем изменять стили bootstrap, а также использовать\n  его для создания своих переменных\n- `main/fonts.scss` - подключаются шрифты, используемые на сайте\n- `helpers/bootstrap.scss` - подключаются boostrap зависимости\n\n### `src/views/`\n\nВ данной папке находятся страницы проекта в формате `twig`, которые после сборки преобразуются в `html`.\n\nФайл `index.twig` - это главная страница создаваемого проекта, `404.twig` - шаблон страницы ошибки, а файл `ui.twig` используется для отображения списка всех страниц проекта с ссылками на них.\n\nКроме `index.twig` в данную директорию можно поместить и другие twig файлы из которых будут созданы html страницы.\n\n### `src/templates/`\n\nПапка `layouts/` содержит общие шаблоны, используемые в большинстве страниц приложения. Эти шаблоны определяют общую структуру страницы.\n\nВ папке `partials/` содержатся небольшие куски верстки, которые могут быть использованы и переиспользованы в различных частях сайта. Они включают в себя элементы пользовательского интерфейса, такие как кнопки, формы, меню, header, footer и т.д.\n\n---\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://vituum.dev/\" target=\"_blank\" rel=\"noopener noreferrer\"\u003e\n    \u003cimg width=\"60\" src=\"https://avatars.githubusercontent.com/u/109584961\" alt=\"Logo vituum\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\u003cp align=\"center\"\u003epowered by \u003ca href=\"https://vituum.dev/\" target=\"_blank\" rel=\"noopener noreferrer\"\u003evituum\u003c/a\u003e\u003c/p\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falexsoin%2Fpepelac","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falexsoin%2Fpepelac","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falexsoin%2Fpepelac/lists"}