Nuxt 3 Bootstrap Starter 🚀

A modern Nuxt 3 starter template configured with Bootstrap 5, featuring light/dark theme support and essential development tools.

Features 🌟

• ⚡️ Nuxt 3 - The Intuitive Vue Framework
• 🎨 Bootstrap 5 with SCSS support
• 🌓 Light/Dark theme switcher
• 🔍 ESLint flat config setup
• 📦 Yarn v4+ as the package manager
• 🎯 TypeScript
• 🖼️ Nuxt Image module
• 🎉 Bootstrap Icons
• 🔌 Built-in API implementation with CORS support

---

The Index page 🖼️

---

Prerequisites 📋

• Node.js (v18+)
• Corepack enabled

---

Setup 🛠️

1. Enable Corepack (if not already enabled):

   sudo corepack enable  # Linux/macOS
   corepack enable       # Windows

2. Clone the repository:

   git clone https://github.com/oooFreaKooo/nuxt3bs-starter.git
   cd nuxt3bs-starter

3. Install dependencies:

   yarn install

4. Start the development server:

   yarn dev

   Your app should now be running at http://localhost:3000

---

Build for Production 🏗️

1. Build the application:

   yarn build

2. Start the production server:

   yarn start

---

Development Tools 🔧

1. Lint your code:

   Run the linter:

   yarn lint

   Fix linting issues:

   yarn lint:fix

   For the best development experience, install the ESLint VSCode extension and configure it to format on save by adding this to your VSCode settings:

   {
     "editor.codeActionsOnSave": {
       "source.fixAll.eslint": true
     }
   }

---

Project Structure 📁

📦src
 ┣ 📂assets
 ┃ ┗ 📂scss
 ┃ ┃ ┗ 📜main.scss
 ┣ 📂components
 ┃ ┣ 📂Footer
 ┃ ┃ ┗ 📜AppFooter.vue
 ┃ ┣ 📂Header
 ┃ ┃ ┣ 📜AppHeader.vue
 ┃ ┃ ┗ 📜ThemeButton.vue
 ┃ ┗ 📜MainPage.vue
 ┣ 📂composables
 ┃ ┗ 📜usePage.ts
 ┣ 📂layouts
 ┃ ┗ 📜default.vue
 ┣ 📂pages
 ┃ ┗ 📜index.vue
 ┣ 📂plugins
 ┃ ┗ 📜useBootstrap.client.ts
 ┣ 📂public
 ┣ 📂server
 ┃ ┗ 📂api
 ┃ ┃ ┗ 📜page-data.get.ts
 ┣ 📂utils
 ┃ ┗ 📜theme.ts
 ┣ 📜app.vue
 ┗ 📜error.vue

License 📄

MIT

---

Feel free to contribute! 🤝