Исходный код персонального сайта-резюме radif.ru — живой пример Full Stack
и DevOps под ключ. Главная страница (index.html) — резюме; стили и скрипты вынесены в assets/
(style.css, app.js на нативном ES6), структурированные данные (JSON-LD @graph) встроены
в <head>. Разворачивается в Docker за Nginx.
- Frontend: семантический HTML5, доступность (skip-link, ARIA-лендмарки, навигация с
клавиатуры), адаптивная вёрстка на нативном CSS (переменные,
clamp(), Grid, вложенность) и фоновая canvas-анимация «нейросети» на нативном JavaScript (ES6) с учётом энергосбережения иprefers-reduced-motion. - SEO: OpenGraph / Twitter Cards, canonical,
robots.txt,sitemap.xml, расширенный JSON-LD (@graph:Person,WebSite,ProfilePage,SoftwareSourceCode). - PWA:
manifest.webmanifest, SVG-фавиконка и иконки 192/512 (в т.ч. maskable),theme-color. - DevOps: Docker + Nginx, TLS 1.2/1.3, HTTP/2 (
http2 on;), строгий Content-Security-Policy (script-src 'self'), security-заголовки, gzip, кэш-заголовки, healthcheck. - Качество: Prettier, ESLint, Stylelint, html-validate и CI на GitHub Actions (+ Lighthouse).
Этот репозиторий используется вместе с
radif-ru/linux_settings —
там хранятся настройки рабочего окружения Linux. Каталог www в linux_settings
соответствует содержимому данного репозитория (radif-ru/www).
index.html— главная страница-резюме.assets/— вынесенные стили (style.css) и скрипты (app.js, ES6).manifest.webmanifest,favicon.svg,icon-*.png— PWA-манифест и иконки.robots.txt,sitemap.xml— файлы для поисковых систем.files/— файлы сайта (изображения, документы).etc/nginx/— конфигурация nginx для продакшена.Dockerfile,docker-compose.prod.yml— сборка и деплой.package.json,.stylelintrc.json,eslint.config.mjs,.htmlvalidate.json,.prettierrc.json,.editorconfig— инструменты качества кода..github/workflows/ci.yml,lighthouserc.json— CI (линтеры + Lighthouse).- Подмодули — отдельные учебные и pet-проекты (см. ниже).
Деплой: прод в
docker-compose.prod.ymlмонтирует конкретные файлы/папки в/var/www. Каталогassets/,robots.txt,sitemap.xml,manifest.webmanifest,favicon.svgиicon-*.pngуже добавлены в тома nginx — при добавлении новых внешних ассетов не забудьте примонтировать их и пересоздать контейнер (docker compose -f docker-compose.prod.yml up -d, а не reload).
npm install # установить dev-зависимости
npm run lint # Stylelint (CSS) + ESLint (JS) + html-validate (HTML)
npm run format # автоформатирование конфигов/доков (Prettier)
npm run format:checkЛокальный предпросмотр статики (сборка не нужна):
npx --yes http-server . -p 8080 -c-1
# затем открыть http://localhost:8080/Хендмейд-файлы сайта (index.html, assets/style.css, assets/app.js) намеренно
отформатированы вручную и добавлены в .prettierignore, поэтому Prettier их не трогает.
CI на GitHub Actions (.github/workflows/ci.yml) прогоняет те же линтеры и Lighthouse
на каждый push и pull request.
Учебные и демонстрационные проекты подключены как git-подмодули (см. .gitmodules).
Каждый подмодуль — самостоятельный репозиторий, а в этом репозитории фиксируется
лишь ссылка на конкретный коммит.
| Подмодуль | Краткое описание |
|---|---|
| Django_optimization_tools | Инструменты и практики оптимизации Django: кэширование, профилирование, оптимизация запросов. |
| Full_Stack_Django_REST_React | Fullstack-приложение: backend на Django REST Framework + frontend на React, контейнеризация Docker. |
| HTML-CSS-Base | Базовая вёрстка HTML/CSS (лендинг и каталог). |
| HTML-CSS-Prof | Профессиональная вёрстка HTML/CSS, несколько макетов. |
| Intergalactic_Entertainment | Проект на Django с авторизацией и вёрсткой страниц. |
| JavaScriptProfessional | Продвинутый JavaScript: сборка через Gulp/Bower, интерактивный интерфейс. |
| JavaScriptProfessional-v2 | Вторая версия проекта JavaScript Professional. |
| html-css_interactive | Интерактивная вёрстка HTML/CSS на основе Bootstrap. |
git clone --recurse-submodules https://github.com/radif-ru/www.gitЕсли репозиторий уже склонирован:
git submodule update --init --recursivegit submodule update --remote --mergeИсходный код сайта (разметка, стили, скрипты, конфигурация) — под лицензией MIT.
Текст резюме, персональные данные и материалы в files/ — © Радиф Рашитович Илалтдинов,
использование только с разрешения автора.