manuel12/django-expense-tracker

Expense Tracker is application that can help you track and list expenses, and also analyze charts and statistics about them.

👨‍💻 About Me :

Hello, I’m a QA Engineer with 10 years of experience in the QA and Test Automation field.

I believe understanding software from end-to-end is key to testing it effectively.

This is why I’ve been learning and creating Full-Stack Web Development projects in my free time. These projects include Front-end and Back-end, but are also supplemented with my extensive Test Automation knowledge.

For my current QA Engineer role I mostly use JS/Cypress, and for my personal projects I’ve generally used JS/Cypress(Automated tests), JS/React(Front-end) and Python/Django(Back-end).

Check out my Portfolio Page

---

🛠️ Languages and Tools :

                         

---

🔥 My Stats :

💻 Important Projects :

Productivity App:

           

Expense Tracker:

           

Motivation Vault:

           

Series Ratings:

             

🧑‍🔧 Other Projects:

django-expense-tracker's Issues

Re-create homepage.html in React.

Create a react page that has the same html structure as templates/homepage.html.

Install react-bootstrap package.

This will be needed as it is a dependency in the current template front-end.

All that needs to be added here the is the react-bootstrap package to package.json.

Re-create base.html page in React.

Create a page that has the same html structure of templates/base.html.

Make it sure it has a children section where base.html had a {% block content %} {% endblock content %} section.

Update to a React front-end.

Is your feature request related to a problem? Please describe.
The current template-based and bootstrap powered front-end could be switch to React to increase modularization and reuse of code.

Describe the solution you'd like
Do without the django templates and have a full react front-end.

Additional context
Will serve backend data using API functions rather than the standard django views.

Re-create chart.html in react

Create a react page that has the same html structure as templates/chart.html.

Install react-chart.js, if exists.

This will be needed in order to render the charts on the current template front-end.

All that needs to be added here the is the chart.js package to package.json.

Application Page Not Served

Describe the bug
I tried visiting the application page and it wasn't served

To Reproduce
Steps to reproduce the behavior:

1. Go to The App Page
2. You would see this Application error
   An error occurred in the application and your page could not be served. If you are the application owner, check your logs for details. You can do this from the Heroku CLI with the command
   heroku logs --tail

Expected behavior
The page should be served

Screenshots

Desktop (please complete the following information):

• OS: Windows
• Browser: Brave
• Version [e.g. 22]

Fix cypress installation requiring to run ```npm install --legacy-peer-deps```

When installing cypress by running npm install there are some dependency errors shown:

In order to being able to currently install cypress is necessary to run npm install --legacy-peer-deps. Fix this so it's enough with running npm install for installing cypress.

Fix cannot create an expense using date provided by app issue.

When trying to create an expense with the provided date, say 8/14/2023, after filling out all the other required fields (amount, category, content and source) and clicking Save the app shows "Enter a valid date/time." error.

Feedback for this app.

I'm looking to improve this expense tracker app, whether in design, UI, UX, functionality or performance.
Please let me know if anything can be changed or improved :)

Fix visual tests so they all pass.

At the moment when running visual tests only 2 tests run and the rest are skipped. Investigate why and fix this:

Fix "fetching * chart data failed"

When creating a new user without any expenses and visiting either Home or Charts & Statistics page we will get the following console errors:

The reason being that the front-end will make request to the back-end asking for expenses and charts data(which also use expenses data), since the user is new and has no expenses these functions return with errors.

Note: regardless of the fact the user has no expenses at this point also check since the error returned by these api calls is 401 unauthorized, so issue might be related to accessToken.

Fix "webpack compiled with 1 error" issue when starting react server.

Issues log:

"Starting the development server...
Failed to compile.

Module not found: Error: Can't resolve 'C:\Users\jrade\Desktop\Code\JS\Contributions#TEMP_REPOS\django-expense-tracker\front-end\node_modules\webpack-dev-server\client\index.js?protocol=ws%3A&hostname=0.0.0.0&port=3000&pathname=%2Fws&logging=none&overlay=%7B%22errors%22%3Atrue%2C%22warnings%22%3Afalse%7D&reconnect=10&hot=true&live-reload=true' in 'C:\Users\jrade\Desktop\Code\JS\Contributions#TEMP_REPOS\django-expense-tracker\front-end'
ERROR in Module not found: Error: Can't resolve 'C:\Users\jrade\Desktop\Code\JS\Contributions#TEMP_REPOS\django-expense-tracker\front-end\node_modules\webpack-dev-server\client\index.js?protocol=ws%3A&hostname=0.0.0.0&port=3000&pathname=%2Fws&logging=none&overlay=%7B%22errors%22%3Atrue%2C%22warnings%22%3Afalse%7D&reconnect=10&hot=true&live-reload=true' in 'C:\Users\jrade\Desktop\Code\JS\Contributions#TEMP_REPOS\django-expense-tracker\front-end'

webpack compiled with 1 error"

Happens after installing front-end folder packages and running npm run start.