Skip to content

Latest commit

 

History

History
103 lines (66 loc) · 4.74 KB

README.md

File metadata and controls

103 lines (66 loc) · 4.74 KB
Raw

Mortgage Expense Calculator

Mortgage Expense Calculator


Calculate the estimated mortgage expenses for buying a property in the Netherlands. Use it online by clicking the URL! Also, it's ready as a PWA, you can install it as an app! mortgageexpensecalculator.com

Motivation

When you want to buy a property with a mortgage in the Netherlands, you need to have some amount of money to afford the expenses of a mortgage.

These expenses could be too difficult to calculate on the paper because of many considerations affecting each other items.

These difficulties consist:

  • There are various cost items for getting a mortgage, and you need to organize them,

  • These different expense items have special conditions and special cost ranges,

  • There are also special conditions like compulsory expense or not which is affecting your total expense directly,

  • Special conditions are also including upper limits depending on the mortgage amount,

  • At the end of each calculation on the paper, you could be ending up with alternative scenarios of the expenses, and you could need to go over each item with optimistic and pessimistic scenarios.

So why not to automatically calculate it and help people to use it. 💡

Features

Mortgage Expense Calculator has been developed after a couple of one-on-one interview sessions with different financial advisors, and numerous research on the internet on related websites.

Calculation ranges in the application, are very accurate for those who want to use it.

All special conditions, like not compulsory expenses, maximum range condition depending on the mortgage amount, tax-return possible expenses, etc. were considered to calculate the best-estimated results. Also, all the expenses have special explanations.

Wireframe

I've created a wireframe to see the overall view of the application before development see the wireframe

Preview of the app

Will be updated soon...

Technologies used on the development process

  • Angular v14
  • Angular Material UI
  • PWA - Progressive Web Apps
  • Angular fxLayout
  • UX research and collecting remarks of users to shape UI
  • Responsive design integration
  • HTML5 semantic structure
  • SCSS - SCSS mixins
  • Custom SVG font-icons
  • Google Firebase
  • Google Analytics
  • Logo Scene web app to create splash screen mock and social share image variations
  • PWA Asset Generator for splash screen creations including dark mode splash screens

Installation on your local environment

This project was generated with Angular CLI version 14.0.2

Development server

Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the --prod flag for a production build.

Running unit tests

Run ng test to execute the unit tests via Karma.

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via Protractor.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI README.

References