Vuetify Starter Template

This is a starter template for a Vue.js project using Vuetify, TypeScript, Pinia, Vue Router, and Tailwind CSS. This template aims to provide a solid foundation for building modern web applications with a clean and maintainable codebase.

Features

• Vuetify: Material Design Component Framework
• TypeScript: Strongly typed programming language
• Pinia: State Management
• Vue Router: Routing for Vue.js applications
• Tailwind CSS: Utility-first CSS framework
• Vue I18n: Localization with support for English and Arabic, configurable via localStorage

Project Setup

Prerequisites

• Node.js (>= 14.x)
• npm (>= 6.x) or yarn (>= 1.x)

Installation

1. Clone the repository:

   git clone https://github.com/yousifvn/vuetify-starter-template.git
   cd vuetify-starter-template
   

2. Install dependencies:

   npm install
   

Running the Development Server

npm run dev

Folder Structure

vuetify-starter-template/
├── public/                 # Static assets
├── src/
│   ├── assets/             # Project assets (images, fonts, etc.)
│   ├── components/         # Vue components
│   ├── layouts/            # Layout components
│   ├── router/             # Vue Router configuration
│   ├── store/              # Pinia stores
│   ├── styles/             # Global styles (Tailwind CSS)
│   ├── views/              # View components
│   ├── App.vue             # Root component
│   ├── main.ts             # Entry point
│   └── shims-vue.d.ts      # TypeScript shims
├── .eslintrc.js            # ESLint configuration
├── .prettierrc             # Prettier configuration
├── tailwind.config.js      # Tailwind CSS configuration
├── tsconfig.json           # TypeScript configuration
├── package.json            # Project metadata and dependencies
└── README.md               # Project documentation

Contributing

Contributions are welcome! Please open an issue or submit a pull request for any changes.