Building a management software for Caterers

2022 March Update - Story of Oota

Challenge #3 - March 2022 : Oota - Catering Software

Time taken : 2nd March to 15th April 2022

Amount Earned : 0 dollars

Status: V1 Complete

So another month, another challenge, this time I focused on finished something which I had been working on for quite some time.

If you are a reader of my blogs, you might know that I’m currently working with my cousins on a secret project. That project is called Oota. This is logistic tool for caterers. It helps in tracking orders, items using which a caterer can figure out if she/he will profit or loss from an order.

Using this tool, a caterer can basically track orders, invoices, menus and get a count of how many items are there in inventory and whats the current status of it.

This project is something we started during August 2021. Basically the project stack is as follows

  1. Back-end → Spring boot, PostGres SQL, Google GCP, Heroku
  2. Front-end → Angular 11, Tailwind Css, Cloudfare Pages

For past 6 months, i have been spending an hour everyday working on Back-end for Oota. This project was challenging to say the least, because we went straight ahead to build something very complicated instead of building something simple. By sheer determination by February end, I had brought the Back-end to some stable state.

Now for March challenge I decided to focus on Oota. Goal was to finish to building a simple front-end application.

To achieve building the front-end within a month, I decided to spend 2 hrs for 6 days a week., basically finish the entire front-end in 48hrs within the month. This was big challenge for me.

As I had mentioned earlier , front-end was not my strong suit, but I wanted to to build a simple website which looked beautiful and was minimalist in design.

After a bit of research(checking twitter basically 😅), I stumbled upon tailwindCSS(https://tailwindcss.com) and decided to use the same. Tailwind is a CSS utility framework, that helps in building beautiful websites fast. After a bit of research and googling, I was able to learn tailwind CSS and start incorporating it into Oota.

Using tailwindCSS was a game changer. It helped me reduce the time and effort it took to build a beautiful front-end. I was starting to build the front-end rather quickly. It got so engrossing that instead of using pre-build components from angular material or prime ng, I was able to build everything using tailwind and create my own custom components. This freed up my creativity and helped in creating beautiful front-end pages.

Something I had not mentioned earlier was, that the back-end DB was deployed in Heroku utilizing their free tier. Heroku free tier DB is very limiting , you can have only 20 connections and it doesn’t release connections quickly enough. My connections were frequently exceeding limit.

To resolve this, I planned to migrate to Google Cloud Platform(GCP). Learning GCP took me some time and finally I was able to setup the DB using a 90 day free tier version and migrated the DB to GCP.

After getting the back-end and it was time to deploy the front-end. I follows many indie developers in twitter and one of the people I follow is Tony Dinh, and he had put up his tech stack in twitter.

https://twitter.com/tdinh_me/status/1490871838247112705?ref_src=twsrc%5Etfw%7Ctwcamp%5Etweetembed&ref_url=https%3A%2F%2Ftdinh.notion.site%2FMy-Twitter-journey-from-100-30K-followers-498af3a642124927817247ca0ca4647f

From his tweet, I found out about Cloud Flare pages. This was amazing, it was free for 10,000 requests and deploying Angular in Cloud Flare was a breeze. I quickly deployed my front-end to CloudFlare, my application Oota, was now available at https://oota-frontend-base.pages.dev/

Now coming to the part of connecting Back-end to Front-end. In local, I was able to connect quite easily and quickly and development was progressing well, but when deployed to CloudFlare , I was getting CORS error. This error ended up taking alot of time.

In the mean time I wanted to show the progress to some of our customers. Due to this CORS errors, we were stuck. After numerous trial error, I was finally able to figure out the issue.

Resolving the CORS error took more time than I had anticipated. And my deadline of 1st April was looming fast. So to meet my deadline, I focused on just fixing all bugs and get the application to a stable state.

There were many bugs in Order and Menu., like for instance I had missed creating a Item module which plugs to Menu Module. Also since I had decided to create my own custom table components, there were many bugs to be resolved. This took me many days and adding to this, my weekends got busy due to personal commitments and I actually ended up extending the March challenge up-to April 15th.

Most of the bugs were pending up until April 13th and doing a code marathon on April 14th & April 15th, I was finally able to bring the application to some kind of stable state.

So somehow by April 16th I had completed most bugs and Oota was in usable state.

There is still lot of things to be fixed, fix the homepage, add invoice support, add stripe integration as such. But one step at a time right 😬.

So after 1 and half months, I had completed the intial version of frontend for Oota. It is now a working product with full user flow. With UI/UX to be improved and important features that need to be added.

You can find Oota here. https://oota-frontend-base.pages.dev/

March challenge has been a tough one with lots of learning and personal commitments coming in the way. But I’m happy that I was able to complete it.

For April, I’m already starting with a 15 days disadvantage, but will try my best to complete the challenge.

The plan for April to redesign SQLGrammar UI/UX, add subscriptions and re-release it to Product Hunt. Wish me luck🤞🏼.