Lingua Atelier

Lingua Atelier is a multilingual React web application focused on language, culture, and education. It includes three content-rich pages with a warm, organic UI style and runtime language switching.

Tech Stack

• React 19
• React Router DOM
• i18next + react-i18next
• Tailwind CSS 4
• Vite
• ESLint

Features

• Three pages:
  • Home (/)
  • Culture (/culture)
  • Education (/education)
• Shared layout with:
  • Sticky navigation
  • Language switcher (AZ / EN / TR)
  • Footer
• Internationalization with local JSON resources:
  • Azerbaijani (az)
  • English (en)
  • Turkish (tr)
• Persisted language preference using localStorage (app-language)
• Clean router structure and modular page organization

Project Structure

src/
  App.jsx
  main.jsx
  index.css
  i18n/
    index.js
    locales/
      az/common.json
      en/common.json
      tr/common.json
  layout/
    index.jsx
  pages/
    home.jsx
    culture.jsx
    education.jsx
  router/
    index.jsx

Getting Started

1) Install dependencies

npm install

2) Start development server

npm run dev

or

npm run dev:frontend

3) Build for production

npm run build

4) Preview production build

npm run preview

Scripts

• npm run dev — start Vite development server
• npm run dev:frontend — start Vite development server (alias)
• npm run build — build production bundle
• npm run lint — run ESLint
• npm run preview — preview built app

Internationalization Notes

• Main i18n setup is in src/i18n/index.js.
• Active language is read from and saved to localStorage.
• Translation content is organized in common.json per language.

License

This project is licensed under the MIT License.