🔭 This template can be used as a default starting Repository for Vue-based App Development.
The following Functionality is built-in.
- Ni Package Manager - Smart, Automated Package Management.
- TypeScript - For Config & Dev Work.
- ESLint Power Linter.
- Prettier Code Formating.
- Vite Builder & Bundler.
- Pinia State Manager.
- Vitest - For Unit & Feature Tests.
- Playwright Testing Suite - For all tests Playwright can be used for.
- Cypress Testing Suite - For all tests Cypress can be used for.
- Tailwind CSS - A Utility CSS framework
- PostCSS - A tool for transforming CSS with JavaScript.
- Sass CSS - Syntactically Awesome Style Sheets
- Native CSS - MDN CSS reference
- Vue Router - The official Router for Vue.js
- Path Aliasing - Configure Path Alias maps to speed-up TS Dev Work
- Example Components - UI Agnostic
- Auto-import Functionality
- Authorization & Authentication
- REST API Composable
- GraphQL API Composable
The following recommended IDE Extensions are not exclusive nor inclusive, as it depends a great deal on personal preferences, actual IDE used, and the type of projects getting developed on said Dev Platform.
- GitLens — Supercharged - GitLens — Supercharge Git in VS Code
- ToDo Highlighting - Highlight
TODO,FIXMEand otherannotationswithin your code. - Vue - Official - Support for
create-vue, Vitesse, Petite-Vue, Volar. - Markdown All in One - Markdown Support for Visual Studio Code (GitHub Flavour)
- Markdown Preview Enhanced - Markdown Preview Enhanced is an open source project.
- Vue VSCode Snippets - These snippets were built to supercharge a workflow in the most seamless manner possible.
- Vue Ecosystem Snippets - Snippets for the modern Vue ecosystem - including Nuxt 3, Pinia, VueUse, Vue Router & Vue Macros.
- Tailwind CSS IntelliSense - Tailwind CSS IntelliSense enhances the Tailwind development experience.
- Quokka.js - Quokka.js is a developer productivity tool for rapid JavaScript / TypeScript prototyping.
- i18n Ally - Localization Tooling. Manage All Translations in One Place.
- CodebaseNotes
- Limitting Component Abstractions
- Apply Lazy-loading to FCP Bundle size
- Optimise Event Handling using Modifiers
- Optimise Media Assets
- Implement Server Side Rendering (SSR)
- Check the Core Web Vitals
Apart from using Vitest for entry-level testing, additional Test capabilities using Playwright's & Cypress' Platforms will be added as the template gets expanded with sample standard best-practise methods and features.
The intent is to add Acceptance and performance Testing Functionality entry-points as well. These tests should obviously expand to include API testing from a Frontend Framework's prespective as well.
This will also roll-over into a formal CI/CD pipeline getting added using Git-based workflows supported by a local Jenkins configuration.
Generic Forms, Components and other standard-use Design Elements will be added as this template gets expanded.
The aim is to provide a low-friction entry-point for easily adding popular Vue and Nuxt UI frameworks as a particular preference or requirement.
Tailwind CSS supported by PostCSS is built in, and configured to catering for cases where Sass CSS, Less, or vanilla CSS classes might be needed.
The template will be pre-configured to apply foundational security principles. Apart from the obvious Auth processes and access management considered a minimum "must-have" demonstrated by Vue Authenticate, and Nuxt Auth Utils, the template caters for a best-practise approach to HTTP2/3 secure header employment by building on good CSP practices, as well.
To cater for the evolution in Authentication technologies Cerbos's JS SDK and Auth Policy PDP approaches are included. These base-line Auth Policies will enable easy secure integration with REST and GraphQL APIs which might be employed by the Vue SPA only or when combined with a Backend framework of choice.
As a final part security related, the template will be adapted to include interfacing with Rust-based Web Assembly Modules for high quality Encryption | Decryption technology, aimed at surpassing the NIST standards. Options currently considered to achieve these goals are from Avarok Cybersecurity and Terra Quantum.
Depending on how a Vue Application is configured to run, either as SSR or Client-based, SEO and the required SERP results still remain a crucial Business focuspoint. The template allows for employing both static and dynamic Metadata management. Some example guidelines were gained from Vue Meta.