MaskanScan: A Project That Actually Helped People
Where the story started
About two years ago, a friend of mine wanted to rent an apartment in Tehran together with another friend. Both were students, and the process was pretty challenging, since they had to consider proximity to work, university, and the metro lines all at once.
They’d mentioned this casually to me, and in my free time I built a project called MaskanScan. It collected Tehran rental data from various sites and sources (Divar, Sheypoor, Kilid, and Kashano) and displayed it on a map. Back then I used Leaflet for the map and had the metro lines plotted on it by default.
Once I showed it to my friends and they used it, they were able to find the apartments they were looking for much more easily. There’s a real satisfaction in seeing a creative project solve an actual problem. Repetitive projects like an e-commerce store or a todo list just don’t give me that same excitement.
Once the project had solved my friends’ problem, I set it aside. About two years passed. By now, Divar has built most of the features I originally had in mind for MaskanScan, so I don’t think the project is worth turning into a commercial product anymore — but it could still make a solid demo for a portfolio.
Rebuilding it properly
This time, I rewrote the project and its architecture professionally, trying to pick the most suitable tools and libraries for it: a Next.js project using MapLibre and Deck.gl to handle the map and the data.
Deck.gl is part of the vis.gl family — a set of map-focused libraries backed by Uber. The company has open-sourced several libraries under the vis.gl name.
Changing data sources
For the new version, I re-evaluated the sources and replaced Kashano with MrEstate, since Kashano didn’t expose any usable public data when I checked.
Extracting data from the web is called scraping — a field significant enough to have entire courses dedicated to it. Sites usually try to fight back and prevent their data from being used elsewhere, but most of the time that just makes it harder, not impossible.
Divar was no exception. Compared to two years ago, they’d made it noticeably harder to pull data, using rate limiting, authentication, and other measures. Compared to most sites, they’d handled it in a fairly professional way. Divar had become the hardest source to scrape, but since it was also the most valuable one, I couldn’t just ignore it.
One day I sat down, went through the site thoroughly, and came up with a technique that even AI seemed genuinely impressed by. It was a fairly complex approach, but it paid off — with it, I was able to pull a few hundred thousand records in just a couple of minutes.
Eventually, the scraper code was finished, and the data was stored and kept up to date in a Postgres database. The frontend then fetches this data from the project’s own database and displays it on the map.
What’s in the project
This version comes with a bunch of filters (some fairly creative ones too), dark mode, and different map layers including metro and BRT lines, all of which can be toggled on and off.
Users also get notified by SMS or email whenever a listing matching their criteria shows up.
The project uses customized Shadcn components along with libraries like Tanstack Virtual, Tanstack Query, and Zustand. I also added a set of unit tests and end-to-end tests.
Once the project was ready, I used AI along with a few well-crafted AI skills to build a landing page and hooked the project demo up to it.
Where it stands now
It was a fun and genuinely useful project to build, but since Divar has now added most of the features I once envisioned, and the other sources (Sheypoor, Kilid, etc.) contribute a negligible amount compared to Divar, I’ve decided to keep this project as a demo only. Because of that, I’ve turned off the scraper — the part responsible for extracting, processing, and storing new data — so the frontend now only works with the demo dataset.
The demo runs on Netlify and NeonDB.