Photo by Brett Jordan on Unsplash

What I built

Recurrer helps you track your recurring daily expenses / tasks like a pro. Once you add a "recur's" details, the app automatically updates it daily, giving you an instant idea about your recurring expenses.

Category Submission:

SaaS Superstars
Wacky Wildcard

App Link

http://170.187.249.74/

Screenshots

Landing Page

Sign In Page

Sign Up Page

Add Recur Page

Dashboard Page

Edit Recur Entry

Dashboard on Mobile

Description

Recurrer is a utility app to tackle your recurring expenses and tasks. After adding a "recur" the app automatically marks the occurrence everyday (along with the cost & quantity). The dashboard gives you a holistic view of all your recurs, the total quantity consumed and the cost per recur.

The same app can used by a seller as well who is selling a fixed quantity everyday (say a Milkman). They can use it to track their customers, and in future create & share bills using the app.

Current features

1. Sign up / Sign in
2. Create recurs (with optional quantity & cost)
3. Automatic daily entry creations (marking attendance / occurrence) for every recur
4. Edit a recur or a particular daily entry
5. Dashboard with a custom calendar view, showing the recurs' daily entries, up-to-date total quantity & cost incurred per recur

Link to Source Code

Permissive License

The source is licensed under MIT License.

Background

In our household there are many recurring expenses which happen on a fixed schedule, with fixed quantity and cost (say for example, milk purchase is a fixed quantity & price expense). We generally use a physical calendar or a notebook to mark the occurrence.

And then at the end of the month you need to count everyday manually, do the calculation and the whole shebang. i thought why not automate this using a simple interface. The app can be used by anyone in the house using an accessible device (say the TV browser).

How I built it

The app is built using the MERN stack. As the name implies, the frontend is built using the React framework along with vanilla CSS. The most fun part in building the application was the custom calendar month view which shows the daily recurs' entries.

The backend is using NodsJs with the Express framework and the MongoDB database. A cron job is run every 30 mins to manage the automatic daily entry creations. To interact with the database I'm using the Node mongodb client library without any ORM.

The backend (along with the database) & the frontend both are hosted on a Linode Nanode. Linode has been a breeze while working for this project. I created this project from scratch in the past couple of days, and I've never used Linode before. Clearly the documentation and resources on the Linode developer site are of great quality.

For preparing the Nanode, I used the MERN one click app from the Marketplace (this is truly one click :-)).

This automatically installs the needed resources, as well as sets up the system with UFW (Uncomplicated Firewall) and Fail2Ban. After the installation one can even see the CRA app on port 3000 (Yes, port 3000 is allowed in UFW by default with this installation).

Things to do afterwards:

1. Follow the guide given in #3 in additional resources to remove the default CRA app which comes with the installation.
2. Delete the port 3000 from UFW. Run sudo ufw status numbered. And then sudo ufw delete <the_entry_index>. We also need to allow the http & https ports for incoming requests. Run sudo ufw allow http & sudo ufw allow https.
3. Get our application code (frontend and backend), preferably using git which also comes preinstalled (though you could do scp as well, as port 22 is open). Build the frontend for it to be served by the Express app.
4. Install pm2 to run the Express app.
5. Install Nginx (if not installed already), and then configure it to proxy the incoming requests to our Express app.

Additional Resources/Info

I tried to find documentation on EdgeWorkers (one of the submission category), but found only one article on the website, that also not that helpful for development. Maybe once the Akamai & Linode integration is complete, we'll have more clarity on it.

Some of the resources which helped me:

1. MERN one click app documentation
2. How to create MERN stack manually on Linode
3. Transfer a MERN app to Linode

Further Enhancements

1. Currently the app only works for daily recurs. Need to add other recurrence options (weekly / monthly / custom)
2. Better error handling
3. Right now the user can only see the current month calendar. At the least they should be able to see the summary from past months.
4. Option to add holidays / vacations
5. Password reset
6. User edit and settings (currency / measurement system etc)

Conclusion

Overall it was a great experience to build this project and host it on Linode. Linode provides very good documentation and resources to make the journey smooth and enjoyable.

Best wishes to the Linode & Dev team for organizing the hackathon.

If you liked reading the article, show your love by commenting & sharing it. :-)