Skip to content

oooFreaKooo/nuxt3-bs-starter

Repository files navigation

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 🖼️

template-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! 🤝

About

A Nuxt 3 starter template with Bootstrap 5, light/dark theme support, TypeScript, and essential development tools. Designed to streamline the setup of your next project.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors