https://github.com/tyronejosee/prototype_vuejs
Web calendar prototype built with Vue 3, Vite, Pinia, and TailwindCSS, allowing users to manage events, filter them by tags, and toggle between light and dark modes.
https://github.com/tyronejosee/prototype_vuejs
javascript pinia pnpm tailiwindcss typescript vercel vite vuejs
Last synced: 4 months ago
JSON representation
Web calendar prototype built with Vue 3, Vite, Pinia, and TailwindCSS, allowing users to manage events, filter them by tags, and toggle between light and dark modes.
- Host: GitHub
- URL: https://github.com/tyronejosee/prototype_vuejs
- Owner: tyronejosee
- License: mit
- Created: 2025-06-27T23:08:46.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-06-28T03:15:07.000Z (12 months ago)
- Last Synced: 2025-09-17T07:00:23.993Z (9 months ago)
- Topics: javascript, pinia, pnpm, tailiwindcss, typescript, vercel, vite, vuejs
- Language: Vue
- Homepage: https://prototype-vuejs.vercel.app/
- Size: 40 KB
- Stars: 2
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
This is a Vue 3 + Vite calendar prototype.
```mermaid
flowchart TD
A[CalendarView.vue] -->|uses| B[CalendarGrid.vue]
B -->|renders| C[DayCell.vue]
A -->|sidebar| D[EventList.vue]
A -->|modal| E[EventModal.vue]
A -->|filter| F[TagFilter.vue]
A -->|theme| G[ThemeToggle.vue]
B -->|composable| H[useCalendar.ts]
A -->|store| I[eventStore.ts]
subgraph Components
B
C
D
E
F
G
end
subgraph Store & Logic
I
H
end
```
## ✨ Features
- Month grid calendar with event dots per day
- Event creation, editing, and deletion (modal)
- Tag filtering for events
- Light/Dark theme toggle
- Persistent storage (localStorage)
- Import/Export events as JSON
## ⚙️ Installation
Install dependencies
```bash
pnpm install
```
Start the development server at `http://localhost:3000/`
```bash
pnpm run dev
```
Build the application for production.
```bash
pnpm build
```
Start the server in production mode.
```bash
pnpm start
```
Run the linter to check the code quality.
```bash
pnpm lint
```
## ⚖️ License
This project is under the [MIT License](https://github.com/tyronejosee/project_prototype_vuejs/blob/main/LICENSE).
Enjoy! 🎉