lootle

Home page
Dashboard where all trackers are listed
Tracking details of a product
Email notification for stock price drop
Email notification for product's price drop
Graph
Graph
Digital ocean dashboard

Inspiration

Redundancy is a crime and the person who writes the same code is a criminal. Then why we should repeatedly check the price of something that we want? This isn't something awesome, right? This was the problem that I thought I can solve. And just recently, DevEd published a video showing the use of cheerio. Something happened inside of my mind at that point and after some thought and research on that, here I am with the full-fledged product. The irritation of checking the price constantly in an eCommerce store is the motivation behind this project. To eliminate this process and rather automate process, I built this web app. And further, I am planning to release it as a browser extension.

What it does

The app checks the price of the product specified. Not only it checks the price, it extracts the name and information of the product from the website. It gathers information at regular intervals of fifteen minutes and stores it inside the database. If the current price is found to be less than the specified price by the user then, the user will be updated with an email. And the user can also check the history of the price fluctuation through the nice little dashboard.

How we built it

First I made the front end of the website and then moved on to making the API on the backend with the database. After that, I made the app PWA so it can be installed as a mobile app and making advantage of the responsive design, so users can engage easily. Then I had to make a bot that should run in some interval of time using cronjobs.

I have built the project using the following technologies:

Reactjs -> For frontend
MongoDB Atlas -> For MongoDB database
Express.js -> For API
Digital Ocean -> Deployment
Puppeteer/Cheerio -> Getting Price
Nodemailer -> To send email

Challenges we ran into

New and confusing workflow with digital ocean
Work on the terminal and use Linux commands
Get the SSH certificate
Sending emails to the user
And I was in the situation of feeling I don't know anything, every day

Accomplishments that we're proud of

I am proud because I finished the app in a limited time period. It is my biggest accomplishment and another is the way I managed to make the UI that does not suck. I made a PWA and totally responsive.

What we learned

I have made a few React projects in the past but I haven't made any project like this. I had a very bad experience with proxies this time but it was all worth it, I learned to use the network tab. I learned to use Linux a bit more and most importantly I learned how important the skill of learning Linux is. There were a lot of googling, frustrating moments, and bugs without errors. Being able to scrape the data from different sites and format that data with regular expressions.