5 ms·
I taught myself to program to build https://comparedial.com/ https://comparedial.com/, a comparison website for phone contracts in the UK. Front end: plain Jav
by adrianvincent 5y ago
I taught myself to program to build https://comparedial.com/ https://comparedial.com/, a comparison website for phone contracts in the UK.
Front end: plain JavaScript
Back end: Node.js
Host: $10 DigitalOcean droplet
Web server: Nginx
SSL: Let's Encrypt with certbot
Proxy: Cloudflare
Database: Postgres
Caching: Redis
Indexing: MeiliSearch
I wanted to learn JavaScript and understand the fundamentals, so I used vanilla JavaScript for the front end without any framework (React, Vue, etc).
Initially, the comparison engine was slow, so I learnt about indexing and added MeiliSearch to the stack.
I try to keep it as simple as possible and only add what I need.
I plan on migrating to Next.js eventually - not because I need to, but because I think it will be a good learning experience. However, that's not my priority right now, and is probably an excuse for marketing/content procrastination!
- fortydegrees 5y agoHey! This is brilliant! Obviously you speak about the tech stack you use here, but your UX is absolutely perfect. I just used your product and got exactly what I wanted without even thinking. My brain didn't second-guess myself once. I didn't read anything superfluous - in fact I don't think I read anything at all. The search box and images of the phones did it all for me, and the autocomplete for search was perfect. I loved that only after I searched did it give me the option to refine (like size of model) I usually use comparethemarket or something similar when shopping around, and it's a bit of a pain - though I only realised how much of a pain since using yours. I don't know how much conscious thought and work you put into the UX - as you mainly talk about the tech - but it's great. Well done!
- adrianvincent 5y agoThank you, your comment made my day! I come from a design background. I didn't like the UI/UX of similar comparison sites, so my aim was to improve upon what's already out there. Glad to see someone noticed!
- Doxin 5y agoI went and tried out the site due to this comment, and wow you're right! It's a very nice user experience. Nothing more or less than exactly what's needed for the purpose. All nice and snappy too. I wish webshops used UX like this.
- adulion 5y agothis is fantastic- do you get an affiliate fee? i'm looking a new phone and total cost of ownership might swing buying it through this site where do you source the deals? is there an api?
- adrianvincent 5y agoThank you. I do get an affiliate fee for each sale. Most retailers provide csv feeds when you join their affiliate program. Parsing and organising the data can be quite difficult as there is no uniform structure and most retailers provide bad/incomplete data. There are a lot of weird edge cases I need to work around.
- owyn 5y agoThere are a lot of weird edge cases I need to work around. This sounds like a potentially more valuable product to me. Any time I find myself doing integration work like that in an e-commerce setting I think "hm, could this be the Stripe of X".
- adrianvincent 5y agoYep, I've definitely thought about it. There's only one other company in the UK that does this. They supply their feed/API as a service to nearly all the big comparison sites.
- ggregoire 5y agoHey, great service! Just FYI (you probably already know tho): - some links automatically close after loading (e.g. the first link for the iPhone 12). Maybe the deal doesn't exist anymore? - some sites seem to strip your affiliate id from the URL (e.g. the second link for the iPhone 12, metrofone.co.uk)
- adrianvincent 5y agoThanks! Some ad blockers are very aggressive at blocking affiliate links. uBlock Origin blocks all track.webgains.com links and even closes the tab if there's a redirect, which is probably what is happening with the first link. I'm adding a feature that will call an ajax request first, and if it's blocked then I will simply redirect to an untracked link. Unfortunately I will lose potential commission this way, but at least the website will still work for everyone. It should hopefully work if you disable your adblocker. As for the Metrofone link, it's just a redirect on their part. I did a curl request to check this: > GET /pclick.php?p=29805977293&a=119158&m=6506 HTTP/1.1 > Host: www.awin1.com > GET /basket/add/contract/iphone-12-5g-128gb-black/three-100gb-new-24-month-14.00/free-delivery?source=awin&awc=6506_1629914525_c508aa142e90213248adbdee4b995550&utm_source=CompareDial&utm_medium=AWIN&utm_campaign=CompareDial HTTP/2 > Host: www.metrofone.co.uk > GET /contract-phone-deals/iphone-12-5g-128gb-black?basketRedirect=true HTTP/2 > Host: www.metrofone.co.uk
- themulticaster 5y agoJust so you know, on Firefox 92.0b7 the phone images won't load. Apparently the network request works fine, but when trying to view the image directly Firefox says that "The image <...> cannot be displayed because it contains errors.".
- adrianvincent 5y agoThanks, I couldn't reproduce it with the stable build but I did with 92.0b7. Seems to be related to avif images and a bug in libheif. Trying to fix now. https://github.com/lynnandtonic/nestflix.fun/issues/65 https://github.com/lynnandtonic/nestflix.fun/issues/65 https://github.com/strukturag/libheif/issues/477 https://github.com/strukturag/libheif/issues/477
- asdev 5y agodo you advertise? or get most of your leads from SEO?
- muhidin 5y agoHi. Are you using docker or any containerization technology with this stack or you've installed everything on the server.