12 Project: Build an expense tracker with Remix

 

This chapter covers

  • Defining the desired goal for a project
  • Figuring out how to use Remix to get to that goal

Congratulations. You’ve learned all I have to teach you. From here on out, you’re ready to dive deeper and expand your knowledge at an impressive pace.

You’re probably still early in your React developer career. The state of modern web development is such that you’ll experience continual new development, better libraries, new tools, changing paradigms, and general chaos. You have to keep adapting; you can’t rest on your laurels.

In these last three chapters, I’m going to give you some tougher challenges, all of which are going to involve a lot of self-study. You need to be good at reading online documentation and finding out how different bits go together. You’ll not only be using tools in ways I haven’t described in this book; you may use new tools that you haven’t even heard about.

That experience is what your career is going to look like from now on. You’ll rarely join a new project and instantly be familiar with every tool used in the stack. You’ll almost always have something new to learn (or maybe even something old), so you might as well start getting used to this situation. Over the years, you might use hundreds of frontend libraries across dozens of frameworks, mastering the skill of learning new things quickly so that you can use them in a new setting.

12.1 Creating the expense tracker

12.1.1 Choosing your own adventure

12.2 Starting from scratch

12.2.1 Creating the basic visual framework

12.2.2 Extending routes

12.3 Adding the backend

12.3.1 Extending the database

12.3.2 Defining ORM wrappers

12.3.3 Updating components

12.3.4 Adding server-side data to routes

12.4 Adding the frontend

12.4.1 Form library

12.4.2 Dashboard components

12.4.3 Income component

12.4.4 Expenses component

12.4.5 Add-expense component

12.5 Future work

12.5.1 Showing error messages

12.5.2 Editing and deleting objects

12.5.3 Making the pie chart interactive