Skip to content

simplyvinay/vue-expenses

Repository files navigation

Table Of Contents

Vue Expenses

A simple expenses tracking application built with VueJs and .NET

### Demo

Vue Expenses

- Username: [email protected]

- Password: test

Please note that you can change the theme in the settings page and the data on the demo website will be reset at regular intervals

Tech Stack

Server Side

Client Side

Screenshots

Dashboard

Vue Expenses Dashnoard

Expense Listing

Vue Expenses Listing

Stats

Vue Expenses Stats

Settings

Vue Expenses Settings

Profile

Vue Expenses Profile

Mobile View

Local Building

Server

  • Install .NET Core SDK
  • Go to vue-expenses-api folder and run dotnet restore and dotnet build
  • Run dotnet run to start the server at http://localhost:5000/
  • You can view the API reference at http://localhost:5000/swagger

Client

  • Go to vue-expenses-client folder and run npm install
  • Run npm run serve to start the client at http://localhost:8080/
  • Included database is seeded with dummy data and you can use email: [email protected] and password: test to login

Config

Server

ConnectionStrings

  • DefaultConnection: Data Source=App_Data/expenses.db
    • Where the sqlite db file is located, this can be changed in appsettings.json file

JwtSettings

  • SecurityKey: A super secret long key to encrypt and decrypt the token
  • Issuer: Issuer
  • Audience: Audience
    • The key, issuer and audience values to generate a jwt token, this can be changed in appsettings.json file

PasswordHasher

  • Key: Secret key to encrypt passwords
    • The key to encrypt the passwords, this can be changed in appsettings.json file

Client

  • VUE_APP_BASE_URL: http://localhost:5000/

    • Base url to connect to the API, this can be changed in the .env file
  • productionSourceMap: false

    • Generates source map file when building for production, this can be changed in vue.config.js file
  • outputDir: commented out by default

    • Where the built files will be copied over, this can be changed in vue.config.js file
  • assetsDir: commented out by default

    • Where the built minified css/js files will be copied over, this path is relative path from the outputDir, this can be changed in vue.config.js file

Future Enhancements

How to Contribute

  1. Clone repo git clone https://github.com/simplyvinay/vue-expenses.git
  2. Create a new branch: git checkout -b new_branch_name
  3. Make changes and test
  4. Submit Pull Request with description of changes

License

MIT