You can build an enterprise-grade app with low-level knowledge thanks to the myriad of robust services covering every aspect of a web product’s needs. In this article, I explore how I built an app over a couple of weekends in lockdown with not a lot of work. Motivation A few years ago when I started learning React, I took Wes Bos’s course, in which he builds a market app titled “Catch of The Day”. Wes Bos is a titan among development instructors with a relatable approach that shows you just how fun coding can be, especially when applies to real-world application. If you haven’t taken any of his courses, . React For Beginners do yourself a favour Anyway, in the demo app he builds, a single vendor page is created, and orders are placed against live data. My React skills have come a long way since then, but it always stuck with me as an excellent idea. Fast-forward to today, Coronavirus has hit, and many people I know who work in markets are temporarily out of business, but still offering collection or delivery of their goods. Many of them don’t have websites or the ability to take orders via anything except email, so last weekend I started building heavily inspired by “Catch of the Day”, but fully fleshed out. an app In it, vendors can sign up and set up a store with very little work. They can add store data and products, set currency and in some countries, add online payment. Customers can order items with no registration; vendors receive notifications and can update order statuses. It’s kind of like a very low-level Shopify, but aside from being simple to set up, (and here’s the kicker) it’s . completely free …the only thing I had to pay for was the domain at $20. Why? Well, because back home in South Africa (I live in Germany), my mother is a market vendor and I wanted to help her out. But also because it cost me almost nothing to make (except for my precious lifeblood of course: time, but it was this or playing Mariokart). Breaking it down The stack consists of the following: : the free library I try to pretend wasn’t provided by Emperor Zuck React : the free React framework on the bleeding edge of web app development. With the recent addition of SWA and advancements in static content generation, this very active community is doing some impressive stuff. Did you know that Hackernoon was recently rebuilt using Next.js? Next.js : A perfect free hosting compliment to Next.js. One-command deployment, PR merge checks, function logging, DNS management via CLI, what’s not to love? As a frontend developer, I have little interest in spending too much time on the server, so a reliable, minimal-config setup is right up my alley. Zeit (now.sh) : Free transactional emails. 40k for a month, then 100/day free forever Sendgrid : Free error tracking for personal projects and early-stage applications. (5k errors per month) Sentry : Free image uploader and CDN hosting, 1GB traffic per month Uploadcare : User feedback management, free for 20 suggestions Acute : For auth and database, comes with a very generous free tier. Firebase Not to mention the 24 other open-source packages I’ve made use of including libraries like , , , and to name a few. react-hook-form dayjs react-select sweetalert The only thing I had to pay for was the domain at $20. Thanks to the unsung efforts of those in web development who have worked tirelessly at not only building these support services, but maintaining and providing feedback free-of-charge, I built an entire app from end-to-end with mostly frontend knowledge. Point being, you probably only have to start paying for an app once it goes somewhere. It is a fruitful time to be a web developer. If you know someone who sells goods, at a market or otherwise, that might benefit from being able to take orders online right now, feel free to share Vendor Stall with them.

Community Is

Sentry

JSNation Live 2020, the remote spin-off of a successful JavaScript conference

Personal Developer Blog of the Year - 
Hacker Noon Noonies Awards 2019

Market Vendors: keep selling during lockdown

Too Long; Didn't Read

Make resilience your competitive advantage

How I Built a Vendor Stall for Small Businesses to Sell Goods Online in Three Weekends

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

Untitled Story

JSNation Live 2020, the remote spin-off of a successful JavaScript conference

64 Stories To Learn About Firebase

A Useful Wrapper for MobX and Firebase Cloud Firestore

Access User Location with Permission Handler in Flutter

Adding Firebase Analytics to a Gatsby Project: A Beginner's Guide

JSNation Live 2020, the remote spin-off of a successful JavaScript conference

64 Stories To Learn About Firebase

A Useful Wrapper for MobX and Firebase Cloud Firestore

Access User Location with Permission Handler in Flutter

Adding Firebase Analytics to a Gatsby Project: A Beginner's Guide

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps