Files
tp/main_dc/valitovgaziz/html/blog.html
T
valitovgaziz 815a47b9bb modified: main_dc/valitovgaziz/html/blog.html
add one aticle into blog valitovgaziz.ru site
2026-01-30 17:01:28 +05:00

590 lines
38 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!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>
<!-- Пятая запись (новая) -->
<article class="blog-post" id="post5">
<header class="blog-post-header">
<span class="blog-post-category">Мысли</span>
<h2 class="blog-post-title">Зачем я создаю YalArba: история и миссия</h2>
<div class="blog-post-meta">
<time datetime="2024-03-25">25 марта 2024</time>
<span></span>
<span>8 минут чтения</span>
</div>
</header>
<div class="blog-post-content">
<p>Эта история началась в 2017 году, когда я работал на заводе УМПО и параллельно учился в УКСиВТ.
Зимой
захотелось отдохнуть — съездить куда-нибудь на машине или просто развеяться в парке. Я, конечно,
полез в
интернет искать сайты и информацию. И ни на одном сайте не смог найти маршрут или место, куда
можно сходить
бесплатно.</p>
<p>Везде мне продавали туры, гостиницы, ещё много вариантов, которые для меня, простого рабочего,
совершенно не
имели никакой ценности. Пришлось искать через знакомых, через группы, куда можно поехать на
отдых с
корзинкой, бутербродами, на своей машине.</p>
<blockquote class="blog-quote">
«После этого случая мне сильно захотелось создать приложение, которое приводило бы людей к
простому и
быстрому решению по отдыху. Особенно это ценно для рабочих, у которых нет особой насмотренности,
много
возможностей и ресурсов для отдыха вдали от дома или за границей.»
</blockquote>
<h3>Социальность проекта</h3>
<p>Большая часть услуг будет бесплатной для всех, включая предпринимателей. Потому что я сам работал
на заводе и
был всегда (большую часть времени) за станком. Но остальная жизнь тогда больше походила на
несистематизированные пьянки и гулянки. В то время это было интересно, сейчас это совершенно не
вписывается
в моё мировоззрение.</p>
<p>Мне кажется, в те годы мне не хватало широты взгляда, в общем, некому было подсказать, что
отдыхать можно
по-другому. Что есть много исторических мест, памятников природы. Я просто не видел альтернативы
своему
образу отдыха.</p>
<h3>Миссия сегодня</h3>
<p>Сейчас я надеюсь, что смогу предоставить эту альтернативу. Зумеры, конечно, уже меньше подвержены
старым
способам отдыха (алкоголь употребляют меньше). Но я хочу добавить приложение (веб-портал),
которое сможет
подсказать, подкинуть идею, что отдых может быть более культурным, не таким дорогим. И главное —
недалеко от
дома. В рамках района, области или страны.</p>
<p>И я уверен, что это будет работать и в других странах. Ведь везде есть просто очень занятые люди,
всё
внимание которых направлено на работу и дом. В этом я вижу мейнстрим, большую цель для своего
приложения.
</p>
<h3>Международный потенциал</h3>
<p>Через это же приложение можно будет привлекать самостоятельных туристов в нашу страну — через
рекламу,
распространение в другие страны. Открывать наши места отдыха не только для внутреннего туриста,
но и для
иностранного (выборочно, конечно).</p>
<h3>Бизнес-модель</h3>
<p>Основная прибыль в этом проекте спрятана в количестве пользователей, которые будут пользоваться
порталом
(приложением). Конечно, приложение должно буквально делать за пользователя часть работы по
поиску, подбору,
исследованию и выбору маршрутов отдыха — чтобы получить наилучший результат.</p>
<h3>Личный путь</h3>
<p>Поставленная высокая цель помогает мне добиваться высоких результатов в жизни. Для реализации
проекта я
выучил несколько языков программирования, английский язык, добился от себя внятных установок на
жизнь,
развил в себе планирование и смог познакомиться с невероятным количеством людей. Каждый новый
рубль,
потраченный на этом пути, будет воздан.</p>
<h3>Инвестиции или самостоятельная разработка?</h3>
<p>Часто ловлю себя на мысли: а нужны ли мне инвестиции? И да, я часто и с большой уверенностью
говорю: да!
Нужны. На сервер, на человеко-часы, на заказные части программы. С другой стороны, передо мной
часто
возникает дилемма — хочется сделать всё самому.</p>
<p>Это, конечно, ошибка, которая уже стоила мне пары лет в разработке и ещё аукнется большим
количеством
времени, потраченным на разработку приложения самостоятельно. Я всё ещё на что-то надеюсь, что
как-то смогу
завершить приложение (я смогу). Просто это будет не так пафосно и круто, как хотелось бы. И
дальше, конечно,
встанет вопрос о том, как же его продавать (продвигать). Здесь уже заложены некоторые
маркетинговые фишки и
ходы для создания нового рынка и выхода на существующие.</p>
<p>В данный момент больше стараюсь уделять время семье и дому. Но часть моих усилий всегда
направлена на работу
над проектом. Конкретно сейчас работаю над блогом для проекта, хотя, казалось бы, должен
вгрызаться в
реализацию серверного приложения на Golang (gorm, chi).</p>
<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">#СоциальныйПроект</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="#post5">Зачем я создаю YalArba: история и миссия</a></li>
<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>
</ul>
</div>
</aside>
</main>
<!-- Пагинация -->
<div class="blog-pagination">
<a href="#" class="blog-pagination-btn blog-pagination-prev">← Назад</a>
<span class="blog-pagination-current">Страница 1 из 4</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>