How simplyvinay/vue-expenses works
Vue Expenses is a personal expense-tracking app: users manage expenses and their categories/types, then review dashboard and year/month statistics. The Vue client routes views through shared state and an API service to a .NET API; API controllers dispatch requests through MediatR feature handlers to application data. Authentication supports registration, login, profile/settings updates, and refresh tokens. The README documents SQLite, EF Core, and Dapper; sampled code confirms API dispatch and the EF context, but not individual handler-to-storage calls, so those links are not shown.
Main entry points: store/index.js Vuex state · App.vue Vue application · router/index.js Route views · Expenses.vue Expense and account views
Components 21
Vue client
- Vue application
vue-expenses-client/src/App.vue - Route views
vue-expenses-client/src/router/index.js - Expense and account views
vue-expenses-client/src/views/Expenses.vue - Dashboard and charts
vue-expenses-client/src/views/Dashboard.vue - Vuex state
vue-expenses-client/src/store/index.js - HTTP API service
vue-expenses-client/src/services/api.js
API features
- Account endpoints
vue-expenses-api/Features/Users/UsersController.cs - Account operations
vue-expenses-api/Features/Users - Expense endpoints
vue-expenses-api/Features/Expenses/ExpensesController.cs - Expense operations
vue-expenses-api/Features/Expenses - Category endpoints
vue-expenses-api/Features/ExpenseCategories/ExpenseCategoryController.cs - Category operations
vue-expenses-api/Features/ExpenseCategories - Type endpoints
vue-expenses-api/Features/ExpenseTypes/ExpenseTypeController.cs - Type operations
vue-expenses-api/Features/ExpenseTypes - Statistics endpoints
vue-expenses-api/Features/Statistics/StatisticsController.cs - Statistics queries
vue-expenses-api/Features/Statistics
Data and security
- EF data context
vue-expenses-api/Infrastructure/ExpensesContext.cs - SQLite database
- JWT and refresh tokens
vue-expenses-api/Infrastructure/Security/JwtTokenGenerator.cs
Other components
- User
- HTTP client
Connections 18
- User → Vue application: uses
- Vue application → Route views: renders routes
- Route views → Expense and account views: selects view
- Expense and account views → Vuex state: dispatches actions
- Dashboard and charts → Vuex state: reads statistics
- Vuex state → HTTP API service: requests data
- HTTP API service → HTTP client: sends HTTP
- HTTP client → Account endpoints: calls account API
- HTTP client → Expense endpoints: calls expense API
- HTTP client → Category endpoints: calls category API
- HTTP client → Type endpoints: calls type API
- HTTP client → Statistics endpoints: calls statistics API
- Account endpoints → Account operations: mediates requests
- Expense endpoints → Expense operations: mediates requests
- Category endpoints → Category operations: mediates requests
- Type endpoints → Type operations: mediates requests
- Statistics endpoints → Statistics queries: mediates queries
- EF data context → SQLite database: reads and writes