456 lines
27 KiB
HTML
456 lines
27 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<meta name="description"
|
||
content="Блог Валитова Газиза - мысли, проекты, обновления и размышления о разработке и предпринимательстве">
|
||
<title>Блог | ValitovGaziz - Мысли и обновления</title>
|
||
<link rel="icon" href="./images/favicon/code_orange.png">
|
||
<link rel="stylesheet" href="style/blog.css" />
|
||
</head>
|
||
|
||
<body>
|
||
<!-- Кнопка переключения темы -->
|
||
<button class="theme-toggle" onclick="toggleTheme()">
|
||
🌙 Темная тема
|
||
</button>
|
||
|
||
<!-- Навигация -->
|
||
<nav class="blog-nav">
|
||
<div class="blog-nav-container">
|
||
<a href="index.html" class="blog-nav-logo">ValitovGaziz</a>
|
||
<a href="index.html" class="blog-nav-link">← На главную</a>
|
||
</div>
|
||
</nav>
|
||
|
||
<!-- Заголовок блога -->
|
||
<header class="blog-header">
|
||
<div class="blog-header-content">
|
||
<h1 class="blog-title">Блог</h1>
|
||
<p class="blog-subtitle">Мысли, проекты и обновления из мира разработки и предпринимательства</p>
|
||
<div class="blog-meta">
|
||
<span class="blog-meta-item">📝 Личный блог</span>
|
||
<span class="blog-meta-item">🔄 Регулярные обновления</span>
|
||
<span class="blog-meta-item">🎯 Фокус на содержании</span>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<main class="blog-container">
|
||
<!-- Кнопка для мобильного меню (скрыта на десктопе) -->
|
||
<button class="blog-sidebar-toggle" onclick="toggleSidebar()">
|
||
📂 Меню блога
|
||
</button>
|
||
|
||
<!-- Основное содержание блога - ЛЕВАЯ КОЛОНКА (70%) -->
|
||
<div class="blog-content">
|
||
<!-- Пример записи блога -->
|
||
<article class="blog-post" id="post1">
|
||
<header class="blog-post-header">
|
||
<span class="blog-post-category">Проекты</span>
|
||
<h2 class="blog-post-title">Новый этап развития Yalarba.ru</h2>
|
||
<div class="blog-post-meta">
|
||
<time datetime="2024-03-15">15 марта 2024</time>
|
||
<span>•</span>
|
||
<span>5 минут чтения</span>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="blog-post-content">
|
||
<p>Сегодня хочу поделиться важным обновлением по проекту Yalarba.ru. Мы завершили переход на новую
|
||
архитектуру и готовимся к запуску нескольких ключевых функций, которые существенно улучшат
|
||
пользовательский опыт.</p>
|
||
|
||
<h3>Что изменилось:</h3>
|
||
<ul>
|
||
<li>Полностью переработанный интерфейс поиска маршрутов</li>
|
||
<li>Интеграция с картографическими сервисами</li>
|
||
<li>Улучшенная система рекомендаций</li>
|
||
<li>Подготовка к мобильному приложению</li>
|
||
</ul>
|
||
|
||
<p>Этот этап занял больше времени, чем планировалось, но результат того стоит. Особенно горжусь тем,
|
||
как команда справилась с техническими вызовами.</p>
|
||
|
||
<blockquote class="blog-quote">
|
||
"Технологии должны решать реальные проблемы людей, а не создавать новые"
|
||
</blockquote>
|
||
|
||
<p>В ближайших планах — запуск бета-тестирования новых функций и привлечение первых партнеров из
|
||
туристической отрасли.</p>
|
||
</div>
|
||
|
||
<footer class="blog-post-footer">
|
||
<div class="blog-post-tags">
|
||
<a href="#" class="blog-tag">#Yalarba</a>
|
||
<a href="#" class="blog-tag">#TravelTech</a>
|
||
<a href="#" class="blog-tag">#Разработка</a>
|
||
</div>
|
||
<button onclick="sendMessageTelegram()" class="blog-comment-btn">
|
||
💬 Обсудить
|
||
</button>
|
||
</footer>
|
||
</article>
|
||
|
||
<!-- Вторая запись -->
|
||
<article class="blog-post" id="post2">
|
||
<header class="blog-post-header">
|
||
<span class="blog-post-category">Разработка</span>
|
||
<h2 class="blog-post-title">Переход с Vue 2 на Vue 3: опыт и выводы</h2>
|
||
<div class="blog-post-meta">
|
||
<time datetime="2024-03-10">10 марта 2024</time>
|
||
<span>•</span>
|
||
<span>7 минут чтения</span>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="blog-post-content">
|
||
<p>После нескольких месяцев работы с Vue 3 в продакшене хочу поделиться наблюдениями о переходе с
|
||
Vue 2.</p>
|
||
|
||
<h3>Основные преимущества:</h3>
|
||
<ol>
|
||
<li><strong>Composition API</strong> — действительно улучшает переиспользование кода</li>
|
||
<li><strong>Улучшенная производительность</strong> — заметный прирост в больших приложениях</li>
|
||
<li><strong>TypeScript поддержка</strong> — наконец-то полноценная интеграция</li>
|
||
<li><strong>Меньший размер бандла</strong> — tree-shaking работает лучше</li>
|
||
</ol>
|
||
|
||
<h3>Сложности перехода:</h3>
|
||
<p>Не всё прошло гладко. Некоторые библиотеки ещё не обновились, пришлось искать альтернативы или
|
||
писать собственные решения. Также Composition API требует изменения мышления, особенно для
|
||
разработчиков, долго работавших с Options API.</p>
|
||
|
||
<p>В целом, переход оправдан. Особенно для новых проектов — рекомендую сразу начинать с Vue 3.</p>
|
||
</div>
|
||
|
||
<footer class="blog-post-footer">
|
||
<div class="blog-post-tags">
|
||
<a href="#" class="blog-tag">#Vue3</a>
|
||
<a href="#" class="blog-tag">#Frontend</a>
|
||
<a href="#" class="blog-tag">#JavaScript</a>
|
||
</div>
|
||
<button onclick="sendMessageTelegram()" class="blog-comment-btn">
|
||
💬 Обсудить
|
||
</button>
|
||
</footer>
|
||
</article>
|
||
|
||
<!-- Третья запись -->
|
||
<article class="blog-post" id="post3">
|
||
<header class="blog-post-header">
|
||
<span class="blog-post-category">Мысли</span>
|
||
<h2 class="blog-post-title">О важности сообщества в разработке</h2>
|
||
<div class="blog-post-meta">
|
||
<time datetime="2024-03-05">5 марта 2024</time>
|
||
<span>•</span>
|
||
<span>4 минуты чтения</span>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="blog-post-content">
|
||
<p>В последнее время всё чаще задумываюсь о том, насколько важно окружение для профессионального
|
||
роста. Особенно в IT, где технологии меняются так быстро.</p>
|
||
|
||
<p>Когда работаешь один, легко застрять в своих паттернах, не замечать новые подходы или повторять
|
||
одни и те же ошибки. Сообщество — это не только нетворкинг, это:</p>
|
||
|
||
<ul>
|
||
<li><strong>Обратная связь</strong> — свежий взгляд на твои решения</li>
|
||
<li><strong>Совместное обучение</strong> — каждый знает что-то, чего не знаешь ты</li>
|
||
<li><strong>Поддержка</strong> — особенно важна в сложные периоды</li>
|
||
<li><strong>Вдохновение</strong> — видеть успехи других мотивирует</li>
|
||
</ul>
|
||
|
||
<p>Именно поэтому я решил больше инвестировать в развитие сообщества вокруг своих проектов. Если вы
|
||
читаете это — возможно, нам стоит пообщаться :)</p>
|
||
</div>
|
||
|
||
<footer class="blog-post-footer">
|
||
<div class="blog-post-tags">
|
||
<a href="#" class="blog-tag">#Сообщество</a>
|
||
<a href="#" class="blog-tag">#Развитие</a>
|
||
<a href="#" class="blog-tag">#IT</a>
|
||
</div>
|
||
<button onclick="sendMessageTelegram()" class="blog-comment-btn">
|
||
💬 Присоединиться
|
||
</button>
|
||
</footer>
|
||
</article>
|
||
|
||
<article class="blog-post" id="post4">
|
||
<header class="blog-post-header">
|
||
<span class="blog-post-category">Проекты</span>
|
||
<h2 class="blog-post-title">EasySite & YalArba: Текущее состояние и роадмап развития</h2>
|
||
<div class="blog-post-meta">
|
||
<time datetime="2024-03-20">20 марта 2024</time>
|
||
<span>•</span>
|
||
<span>6 минут чтения</span>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="blog-post-content">
|
||
<p>С момента запуска первых версий <strong>EasySite102.ru</strong> и <strong>YalArba.ru</strong>
|
||
прошло
|
||
несколько месяцев интенсивной разработки. Хочу поделиться текущим состоянием проекта,
|
||
достигнутыми
|
||
результатами и планами на ближайшее будущее.</p>
|
||
|
||
<h3>🎯 Суть проекта сегодня</h3>
|
||
<p>Мы строим полноценную экосистему для туристического рынка:</p>
|
||
<ul>
|
||
<li><strong>EasySite (B2B)</strong> — конструктор сайтов для владельцев отелей, санаториев,
|
||
ресторанов и
|
||
достопримечательностей</li>
|
||
<li><strong>YalArba (B2C)</strong> — агрегатор для туристов с поиском, отзывами, маршрутами и
|
||
системой
|
||
бронирования</li>
|
||
</ul>
|
||
|
||
<h3>✅ Что уже работает (стабильно в продакшене)</h3>
|
||
<ul>
|
||
<li><strong>JWT-аутентификация</strong> — безопасный вход для всех типов пользователей</li>
|
||
<li><strong>Полностью контейнеризованная инфраструктура</strong> — Docker, Docker Compose</li>
|
||
<li><strong>SSL шифрование</strong> — HTTPS на всех доменах через Let's Encrypt</li>
|
||
<li><strong>Базовая аналитика</strong> — отслеживание посещений и пользовательского поведения
|
||
</li>
|
||
</ul>
|
||
|
||
<h3>🛠️ Технологический стек (актуальный)</h3>
|
||
<div class="tech-stack">
|
||
<div class="tech-item">
|
||
<strong>Frontend:</strong> Nuxt.js 3 (EasySite), Vue 3 + Composition API (YalArba)
|
||
</div>
|
||
<div class="tech-item">
|
||
<strong>Backend:</strong> Go (Golang) с использованием GORM, Chi
|
||
</div>
|
||
<div class="tech-item">
|
||
<strong>База данных:</strong> PostgreSQL (раздельные инстансы для разных сервисов)
|
||
</div>
|
||
<div class="tech-item">
|
||
<strong>Инфраструктура:</strong> Docker, Nginx, система автоматического обновления SSL
|
||
</div>
|
||
</div>
|
||
|
||
<h3>📊 API-архитектура</h3>
|
||
<p>Проект построен по микросервисной архитектуре:</p>
|
||
<ul>
|
||
<li><strong>EasySite API:</strong> <code>localhost:8088/docs</code> (управление сайтами)</li>
|
||
<li><strong>YalArba API:</strong> <code>localhost:8888/docs</code> (поиск и бронирование)</li>
|
||
<li><strong>Auth Service:</strong> централизованная аутентификация</li>
|
||
</ul>
|
||
|
||
<blockquote class="blog-quote">
|
||
"Статус проекта на 20.03.2026: 🟢 Активная разработка. Основная функциональность работает, идёт
|
||
наполнение
|
||
контентом и привлечение первых пользователей."
|
||
</blockquote>
|
||
|
||
<h3>📅 Роадмап развития (2026 год)</h3>
|
||
<p>Приоритеты на ближайшие месяцы:</p>
|
||
|
||
<h4>Q3 2026 (Июль–Сентябрь)</h4>
|
||
<ul>
|
||
<li><strong>Платежная система</strong> — интеграция с ЮKassa, Tinkoff</li>
|
||
<li><strong>Мультиязычность</strong> — поддержка английского и башкирского языков</li>
|
||
<li><strong>API для партнеров</strong> — возможность интеграции сторонних сервисов</li>
|
||
<li><strong>Система кэширования</strong> — Redis для повышения производительности</li>
|
||
</ul>
|
||
|
||
<h4>Q4 2026 (Октябрь–Декабрь)</h4>
|
||
<ul>
|
||
<li><strong>Мобильные приложения</strong> — iOS и Android (React Native)</li>
|
||
<li><strong>Система рекомендаций</strong> — AI-based подборки на основе поведения</li>
|
||
<li><strong>Масштабирование инфраструктуры</strong> — переход на Kubernetes</li>
|
||
<li><strong>Реферальная программа</strong> — для владельцев и туристов</li>
|
||
</ul>
|
||
|
||
<h3>👥 Командная ситуация</h3>
|
||
<p>Сейчас проект развивается силами небольшой команды (2 человека). Мы активно ищем:</p>
|
||
<ul>
|
||
<li><strong>Frontend-разработчиков</strong> (Vue 3, Nuxt.js)</li>
|
||
<li><strong>Дизайнеров UI/UX</strong></li>
|
||
<li><strong>Маркетологов</strong> для продвижения в туристической нише</li>
|
||
<li><strong>Контент-менеджеров</strong> для наполнения платформы</li>
|
||
</ul>
|
||
|
||
<h3>🎯 Когда ждать полноценного запуска?</h3>
|
||
<p><strong>Бета-версия с основной функциональностью</strong> уже доступна по адресам:</p>
|
||
<ul>
|
||
<li><a href="https://easysite102.ru" target="_blank">easysite102.ru</a> (для владельцев)</li>
|
||
<li><a href="https://yalarba.ru" target="_blank">yalarba.ru</a> (для туристов)</li>
|
||
</ul>
|
||
|
||
<p><strong>Полноценный запуск</strong> с платежами и мобильным приложением планируется на
|
||
<strong>сентябрь
|
||
2026</strong>.</p>
|
||
|
||
<p><strong>Масштабирование на весь Урал и Поволжье</strong> — цель на <strong>2026 год</strong>.</p>
|
||
|
||
<h3>💬 Как можно поучаствовать?</h3>
|
||
<p>Проект открыт для сотрудничества в разных форматах:</p>
|
||
<ul>
|
||
<li><strong>Технические специалисты</strong> — присоединяйтесь к разработке (удаленно)</li>
|
||
<li><strong>Владельцы туристических объектов</strong> — создайте свой сайт на EasySite</li>
|
||
<li><strong>Инвесторы и партнеры</strong> — обсуждаем стратегическое сотрудничество</li>
|
||
<li><strong>Тестировщики</strong> — помогайте улучшать пользовательский опыт</li>
|
||
</ul>
|
||
|
||
<p>Если вас заинтересовал проект — давайте обсудим возможности сотрудничества!</p>
|
||
</div>
|
||
|
||
<footer class="blog-post-footer">
|
||
<div class="blog-post-tags">
|
||
<a href="#" class="blog-tag">#EasySite</a>
|
||
<a href="#" class="blog-tag">#YalArba</a>
|
||
<a href="#" class="blog-tag">#Туризм</a>
|
||
<a href="#" class="blog-tag">#Разработка</a>
|
||
<a href="#" class="blog-tag">#Стартап</a>
|
||
</div>
|
||
<button onclick="sendMessageTelegram()" class="blog-comment-btn">
|
||
💬 Обсудить проект
|
||
</button>
|
||
</footer>
|
||
</article>
|
||
</div>
|
||
|
||
<!-- Боковая панель - ПРАВАЯ КОЛОНКА (30%) -->
|
||
<aside class="blog-sidebar">
|
||
<div class="blog-sidebar-section">
|
||
<h3>О блоге</h3>
|
||
<p>Здесь я делюсь мыслями о разработке, обновлениями проектов и размышлениями о технологическом
|
||
предпринимательстве.</p>
|
||
</div>
|
||
|
||
<div class="blog-sidebar-section">
|
||
<h3>Категории</h3>
|
||
<ul class="blog-categories">
|
||
<li><a href="#" class="blog-category">Проекты</a></li>
|
||
<li><a href="#" class="blog-category">Разработка</a></li>
|
||
<li><a href="#" class="blog-category">Предпринимательство</a></li>
|
||
<li><a href="#" class="blog-category">Мысли</a></li>
|
||
<li><a href="#" class="blog-category">Обновления</a></li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="blog-sidebar-section">
|
||
<h3>Последние записи</h3>
|
||
<ul class="blog-recent">
|
||
<li><a href="#post4">EasySite & YalArba: состояние и планы от Январь 2026</a></li>
|
||
<li><a href="#post1">Новые возможности Yalarba.ru</a></li>
|
||
<li><a href="#post2">Переход на Vue 3</a></li>
|
||
<li><a href="#post3">О важности сообщества</a></li>
|
||
</ul>
|
||
</div>
|
||
</aside>
|
||
</main>
|
||
|
||
<!-- Пагинация -->
|
||
<div class="blog-pagination">
|
||
<a href="#" class="blog-pagination-btn blog-pagination-prev">← Назад</a>
|
||
<span class="blog-pagination-current">Страница 1 из 3</span>
|
||
<a href="#" class="blog-pagination-btn blog-pagination-next">Вперед →</a>
|
||
</div>
|
||
|
||
<!-- Футер блога -->
|
||
<footer class="blog-footer">
|
||
<div class="blog-footer-content">
|
||
<p>© 2024 Блог Валитова Газиза. Все записи — личные размышления и опыт.</p>
|
||
<p>
|
||
<a href="index.html">На главную</a> •
|
||
<a href="https://t.me/valitovgaziz">Telegram</a> •
|
||
<a href="mailto:valitovgaziz@yandex.ru">Email</a>
|
||
</p>
|
||
</div>
|
||
</footer>
|
||
|
||
<script>
|
||
// Функция для переключения темы
|
||
function toggleTheme() {
|
||
document.body.classList.toggle('dark-mode');
|
||
const btn = document.querySelector('.theme-toggle');
|
||
|
||
if (document.body.classList.contains('dark-mode')) {
|
||
btn.textContent = '☀️ Светлая тема';
|
||
localStorage.setItem('blog-theme', 'dark');
|
||
} else {
|
||
btn.textContent = '🌙 Темная тема';
|
||
localStorage.setItem('blog-theme', 'light');
|
||
}
|
||
}
|
||
|
||
// Загрузка сохраненной темы
|
||
document.addEventListener('DOMContentLoaded', function () {
|
||
const savedTheme = localStorage.getItem('blog-theme');
|
||
const btn = document.querySelector('.theme-toggle');
|
||
|
||
if (savedTheme === 'dark') {
|
||
document.body.classList.add('dark-mode');
|
||
btn.textContent = '☀️ Светлая тема';
|
||
} else {
|
||
btn.textContent = '🌙 Темная тема';
|
||
}
|
||
|
||
// Адаптация для мобильных устройств
|
||
if (window.innerWidth < 768) {
|
||
const sidebar = document.querySelector('.blog-sidebar');
|
||
const toggleBtn = document.querySelector('.blog-sidebar-toggle');
|
||
|
||
toggleBtn.style.display = 'block';
|
||
sidebar.style.display = 'none';
|
||
}
|
||
});
|
||
|
||
// Функция для отправки сообщения в Telegram
|
||
function sendMessageTelegram() {
|
||
window.open('https://t.me/valitovgaziz', '_blank');
|
||
}
|
||
|
||
// Функция для переключения сайдбара на мобильных
|
||
function toggleSidebar() {
|
||
const sidebar = document.querySelector('.blog-sidebar');
|
||
sidebar.style.display = sidebar.style.display === 'block' ? 'none' : 'block';
|
||
}
|
||
|
||
// Обработчик изменения размера окна
|
||
window.addEventListener('resize', function () {
|
||
const sidebar = document.querySelector('.blog-sidebar');
|
||
const toggleBtn = document.querySelector('.blog-sidebar-toggle');
|
||
|
||
if (window.innerWidth >= 768) {
|
||
sidebar.style.display = 'block';
|
||
toggleBtn.style.display = 'none';
|
||
} else {
|
||
toggleBtn.style.display = 'block';
|
||
sidebar.style.display = 'none';
|
||
}
|
||
});
|
||
|
||
// Плавная прокрутка для якорных ссылок
|
||
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||
anchor.addEventListener('click', function (e) {
|
||
e.preventDefault();
|
||
const targetId = this.getAttribute('href');
|
||
if (targetId === '#') return;
|
||
|
||
const targetElement = document.querySelector(targetId);
|
||
if (targetElement) {
|
||
window.scrollTo({
|
||
top: targetElement.offsetTop - 100,
|
||
behavior: 'smooth'
|
||
});
|
||
|
||
// Закрываем сайдбар на мобильных
|
||
if (window.innerWidth < 768) {
|
||
const sidebar = document.querySelector('.blog-sidebar');
|
||
sidebar.style.display = 'none';
|
||
}
|
||
}
|
||
});
|
||
});
|
||
</script>
|
||
</body>
|
||
|
||
</html> |