Tech Stack

• ⚡️ Vue 3, Vite 2
• 🍍 State Management via Pinia
• 🌍 I18n ready
• 🎨 Tailwind CSS - Rapidly build modern websites without ever leaving your HTML.
• 🔥 Use the new <script setup> syntax
• 📥 APIs auto importing - use Composition API and others directly

Feature & shortcuts

MindMap

• Story Management
  • Add Story Kanban
  • Delete Story Kanban
  • Switch Story Kanban by Story sidebar
• Story Kanban
  • create task
  • delete task
  • DnD task in different kinds of panel and even Kanban
• Story state persist in LocalStorage
• Colorful Themes

Pre-packed

UI Frameworks

• TailwindCSS
  • TailwindCSS Typography
  • TailwindCSS Forms
  • TailwindCSS Aspect Ratio
  • DaisyUI

Plugins

• Vue Router
  • vite-plugin-pages - file system based routing
  • vite-plugin-vue-layouts - layouts for pages
• Pinia - Intuitive, type safe, light and flexible Store for Vue using the composition api
• unplugin-vue-components - components auto import
• unplugin-auto-import - Directly use Vue Composition API and others without importing
• VueUse - collection of useful composition APIs
• @vueuse/head - manipulate document head reactively
• Vue I18n - Internationalization
  • vite-plugin-vue-i18n - Vite plugin for Vue I18n

Coding Style

• Use Composition API with <script setup> SFC syntax

Dev tools

• TypeScript
• VS Code Extensions
  • Vite - Fire up Vite server automatically
  • Volar - Vue 3 <script setup> IDE support
  • Iconify IntelliSense - Icon inline display and autocomplete
  • TailwindCSS Intellisense - IDE support for Tailwind CSS
  • i18n Ally - All in one i18n support

Usage

Development

Just run and visit http://localhost:3000

yarn dev

Preview in Https

Just run and visit https://localhost

yarn build && yarn https-preview

Build

To build the App, run

yarn build

And you will see the generated file in dist that ready to be served.