Introducing Lootle - for MongoDB Atlas Hackathon
Tags: atlashackathon22, atlashackathon, hackathon, javascript
Published: 2022-12-08 16:42:47

## What I built
Lootle -> (loot-le) is a website and MIT license open source project where you can keep track of the price of your MacBook or of your favorite Raspberry Pi or the stock price of Microsoft. You just enter the URL of the product/stock then the website keeps the history of the price fluctuation, presents it to you, and even notifies via email you when the price drops down that you specified.

### Category Submission:
Choose Your Own Adventure

### App Link
[lootle.live](https://lootle.live)

## Video Overview
{% embed https://youtu.be/R_GvQFZ8CIc %}

### Screenshots
1. Home page
![Landing page lootle.live](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2jh3tmxpxnzk7yy1v0cx.png)
2. Dashboard
![Lootle.live dashboard tracks](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/277ds1l5giilgfo1dbn5.png)
3. Product detailed view with graph
![Product detailed view lootle.live](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ylsp0ynr88690hyb0g01.png)

4. Email notification for stock price
![Email notification for lootle.live](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d65f7potsnvmb4xygu0v.png)
5. Email notification for product price drop
![Email notification of lootle.live](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x07fp388oc1iq5bwpfis.png)
6. MongoDB Atlas Stats
![Mongodb Atlas](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1i25heca0q150tgja6ld.png)

### Description
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 on a regular interval of fiveteen minutes and stores inside of 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.

### Tech stack 👩‍💻

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

### Link to Source Code
All source code of frontend, backend and bot in same repository:
{% embed https://github.com/aashishpanthi/lootle.live %}

### Permissive License
[MIT](https://github.com/aashishpanthi/lootle.live/blob/main/LICENSE)

## Background
The irretation of checking the price constanly in ecommerce store is the motivation behind this project. To eliminate this process and rather automate the process, I built this web app. And further I am planning to release it as browser extension.


### How I built it
It is not my first time using mongoDB. I have already built few projects using mongoDB (MongoDB Atlas to be more specific). But learning never stops. I didn't know that mongoDB provides change streams but when I come to know I had to try it once. I have tried it in the app to send push notification whenever price drops. But I felt like sending notification may look spammy so I choose the option to mail where I can send a detail description of the product with the interactive elements.


## Currently supported sites:

1. [Flipkart.com](https://flipkart.com) for available products only
2. [Amazon.com](https://amazon.com) for available products only
3. [Amazon.co.uk](https://amazon.co.uk) for available products only
4. [Amazon.in](https://amazon.in) for available products only
5. [cnbc.com](https://cnbc.com) for stock price
6. [daraz.com.np](https://daraz.com.np) for available products only

## Important links 🔗

1. [GitHub repo](https://github.com/aashishpanthi/lootle.live)
2. [Website](https://lootle.live)