Skip to content

project-overview.md

Latest commit

 

History

History
57 lines (46 loc) · 1.94 KB

project-overview.md

File metadata and controls

57 lines (46 loc) · 1.94 KB
Raw

Project Overview

Architecture

Nuxtware is a Nuxt 4 project with TypeScript that's set up as a reusable component library/layer. The project integrates with Shopware for e-commerce functionality.

Key Technologies

  • Frontend Framework: Nuxt.js 4 with Vue.js
  • Language: TypeScript
  • Styling: Tailwind CSS
  • Internationalization: i18n (English and German)
  • E-commerce Integration: Shopware via @shopware/nuxt-module

Directory Structure

nuxtware/
├── .playground/       # Development sandbox
├── app/               # Main application code
│   ├── assets/        # Static assets and styles
│   ├── components/    # Vue components
│   ├── composables/   # Reusable composition functions
│   ├── layouts/       # Page layouts
│   └── pages/         # Route pages
├── i18n/              # Translation files
│   ├── de-DE/         # German translations
│   └── en-GB/         # English translations
└── server/            # Server-side code
    └── routes/        # API routes

Component Organization

Components are organized by feature/function:

  • cart/ - Shopping cart related components
  • category/ - Category-related components
  • component/ - Base UI component wrappers
  • context/ - Context providers (language, currency)
  • foundation/ - Core UI elements
  • mega-menu/ - Navigation menu components
  • notification/ - Global notification system components
  • product/ - Product display components
  • search/ - Search functionality
  • sidenav/ - Mobile navigation
  • structure/ - Layout structure components

I18n Structure

Translations are organized by feature in separate JSON files:

  • cart.json - Shopping cart translations
  • checkout.json - Checkout process translations
  • form.json - Form element translations
  • header.json - Header component translations
  • notification.json - Notification system translations
  • etc.