Our Travels 🌍

🇩🇪 Deutsch

Our Travels ist eine mehrsprachige Webanwendung über Reisen, Kultur und Sehenswürdigkeiten. Das Projekt basiert auf einer strukturierten, hierarchischen Datenarchitektur und generiert Inhalte dynamisch für verschiedene Entitätsebenen (Länder, Regionen, Städte, Sehenswürdigkeiten).

🌐 Projektkonzept

Die Anwendung arbeitet mit einer datengetriebenen Architektur, bei der Inhalte als miteinander verbundene Entitäten organisiert sind. Auf dieser Grundlage werden Seiten und Navigation dynamisch im Frontend generiert.

⚙️ Implementierte Funktionen

• Mehrsprachigkeit (Deutsch / Ukrainisch / Russisch)
• Dynamische Generierung von Seiten basierend auf Datenstrukturen
• Hierarchische Datenstruktur (Länder → Regionen → Städte → Sehenswürdigkeiten)
• Suchfunktion innerhalb der Daten
• Filter- und Sortierlogik
• Interaktive SVG-Karten mit Navigation zwischen Entitäten
• Strukturierte Navigation innerhalb verknüpfter Inhalte

🧠 Architektur & Umsetzung

• Trennung von Daten- und Präsentationsschicht
• Routing-basiertes Rendering mit dynamischen Parametern
• Skalierbare Struktur zur Erweiterung neuer Entitäten ohne Anpassung der Kernlogik
• Zentrales Datenmanagement im Frontend

🚧 Aktuelle Weiterentwicklung (Fullstack Richtung)

Das Projekt wird aktuell zu einer Fullstack-Anwendung erweitert:

• Migration von statischen JavaScript-Daten in eine MySQL-Datenbank
• Entwicklung eines relationalen Datenmodells
• Aufbau einer REST API mit Node.js und Express
• Umstellung von statischen Datenstrukturen auf serverseitige Datenabfrage

⚙️ Verwendete Technologien

• React
• Redux Toolkit
• React Router
• SCSS (Sass)
• Vite
• JavaScript
• Node.js (in Entwicklung)
• Express.js (in Entwicklung)
• MySQL (in Entwicklung)

🌐 Deployment - https://our-travels.info/

🗂 Projektstruktur

/src /components – React-Komponenten /data – strukturierte Projektdaten /pages – Entitätsseiten (Länder, Städte, Sehenswürdigkeiten) /styles – SCSS Styles App.jsx main.jsx

🇷🇺 Русский

Our Travels — многоязычное веб-приложение о путешествиях, культуре и достопримечательностях. Проект построен на работе с иерархическими данными и динамической генерации контента для различных уровней сущностей (страны, регионы, города, достопримечательности).

🌐 Основная концепция

Приложение использует структурированную модель данных, где контент организован в виде связанных сущностей. На основе этих данных динамически формируются страницы и навигация внутри приложения.

⚙️ Реализованный функционал

• Многоязычность (RU / UA / DE)
• Динамическая генерация страниц на основе данных
• Иерархическая структура сущностей (страны → регионы → города → достопримечательности)
• Поиск по данным проекта
• Фильтрация и сортировка контента
• Интерактивные SVG-карты с переходами между сущностями
• Структурированная навигация между связанными объектами

🧠 Архитектурные особенности

• Разделение данных и UI-слоя
• Рендеринг страниц на основе маршрутов и параметров
• Масштабируемая структура для добавления новых сущностей без изменения логики компонентов
• Централизованное управление данными во фронтенде

🚧 Текущее развитие (Fullstack направление)

Проект развивается в сторону fullstack-архитектуры:

• перенос данных из статических JavaScript-объектов в MySQL
• проектирование структуры реляционной базы данных
• разработка REST API на Node.js и Express
• переход от локальных данных к серверной архитектуре

⚙️ Используемые технологии

• React
• Redux Toolkit
• React Router
• SCSS (Sass)
• Vite
• JavaScript
• Node.js (в разработке)
• Express.js (в разработке)
• MySQL (в разработке)

🌐 Деплой - https://our-travels.info/

🗂 Структура проекта

/src /components – React компоненты /data – структурированные данные проекта /pages – страницы сущностей (страны, города, достопримечательности) /styles – SCSS стили App.jsx main.jsx

🇺🇦 Українська

Our Travels — багатомовний вебзастосунок про подорожі, культуру та пам’ятки. Проєкт побудований на структурованій ієрархічній архітектурі даних і динамічно генерує контент для різних рівнів сутностей (країни, регіони, міста, пам’ятки).

🌐 Концепція проєкту

Застосунок використовує data-driven підхід, де контент організований як взаємопов’язані сутності. На основі цих даних динамічно формуються сторінки та навігація всередині застосунку.

⚙️ Реалізований функціонал

• Багатомовність (німецька / українська / російська)
• Динамічна генерація сторінок на основі структур даних
• Ієрархічна структура (країни → регіони → міста → пам’ятки)
• Пошук по даних застосунку
• Фільтрація та сортування контенту
• Інтерактивні SVG-карти з навігацією між сутностями
• Структурована навігація між пов’язаними об’єктами

🧠 Архітектура та підхід

• Розділення шарів даних і UI
• Роутинг на основі параметрів та динамічних сторінок
• Масштабована структура, яка дозволяє додавати нові сутності без зміни основної логіки
• Централізоване керування даними у фронтенді

🚧 Поточний розвиток (Fullstack напрямок)

Проєкт наразі розвивається у напрямку fullstack-архітектури:

• міграція статичних JavaScript-даних у MySQL базу даних
• проєктування реляційної структури даних
• розробка REST API на Node.js та Express
• перехід від локальних даних до серверного отримання даних

⚙️ Використані технології

• React
• Redux Toolkit
• React Router
• SCSS (Sass)
• Vite
• JavaScript
• Node.js (у розробці)
• Express.js (у розробці)
• MySQL (у розробці)

🌐 Деплой - https://our-travels.info/

🗂 Структура проєкту

/src /components – React компоненти /data – структуровані дані проєкту /pages – сторінки сутностей (країни, міста, пам’ятки) /styles – SCSS стилі App.jsx main.jsx