Planning Our First TypeScript Application: FinanceMe

Planning Our First TypeScript Application: FinanceMe#

Building FinanceMe#

You have been hired to build FinanceMe, a program that helps users manage their finances. Users of FinanceMe are able to create budgets, manage expenses, and view trends in their spending.

FinanceMe can be used via the commandline (we'll use a nifty tool, ts-node, to run our program). We'll build it in the form of a library that can be imported from other TypeScript and JavaScript projects.

By the end of the chapter, you'll be familiar with the headline features of TypeScript. Hopefully this chapter will spark your curiosity to learn more about the topics discussed, which will be covered in-depth throughout the rest of the book (along with so much more!).

For starters, we will make sure your development environment is set up correctly. Then we will devise a high-level plan for FinanceMe before we begin coding.

Planning FinanceMe#

Before we start coding, we should devise a high-level plan for FinanceMe. We'll refer to this plan as we build the various components of our application.

The first thing we should consider is how our program will be used from the user's perspective. Our client only needs FinanceMe to run on the command-line via ts-node, so we don't have to worry about configuring any compiler output settings.

A FinanceMe user will be able to do the following:

  • Create a user

  • Create budgets

  • Manage expenses

To fulfill these requirements, we decide to take an object-oriented approach and determine that our program will consist of four classes: User, TrackedMonth, Budget, and Expense.

Example Usage#

Below is a long block of code that shows how the finished product will work. We are about to dive into explaining it with diagrams and digging into the code. So go ahead and skim this code block to get an idea of where we're going, but if it seems a bit overwhelming, know that we will cover each step in detail!

We envision the finished product match the usage below: