Webveloper
No-code website editor · frontend engineer on a large distributed team · 2019 to 2021
A no-code website editor for small businesses like a restaurant, a dentist or a gym. I was a frontend engineer on a large distributed team, and I built the screens a business fills its sections in.
- The problem
- A small business needs a website and cannot write a line of code.
- What I did
- I built the editor screens for Location and products, and the media library.
- The result
- A no-code website editor small businesses used to launch their own sites.
A small business needs a website and cannot write a line of code
A restaurant, a dentist or a gym needs a real website, and none of them will open a code editor to get one. The product asked the business questions about itself, its colors, its hours, its location, its prices, its photos, and turned the answers into a finished site. From then on the owner edited that site in the browser, adding sections from a menu of predefined ones, and never touched a file.
I owned the screens a business edits its site from
What I owned were the editor screens: the panels a business fills a whole section type in, Location and physical products among them, plus the media library that made an uploaded image reusable anywhere on the site. The platform architecture was set before me and I worked inside it. Three engineering calls inside that work were mine.
I built the editor screens for Location and products.
Each generated site was stored as one settings file: pages, and each page a list of sections. Every section a business could add needed a screen to fill it in. I built two of those screens: Location, where a business types its address and contact details and turns the section on, and physical products, where it types a product's name, price, photos and description so the site can sell it. The opening-hours popup beside it and the public rendering of both were colleagues' work.
The media library I built made every image reusable.
Before it existed, a picture effectively belonged to the spot it was uploaded into, so a business re-uploaded the same logo for the header, the gallery and a product card. I built the library screen: the one place where a business picks an image it already uploaded and reuses it anywhere on its site. The stored settings file never held picture links, only short codes resolved into real images further down the line. The upload plumbing underneath was mostly a colleague's.
I shipped each section with its edge cases handled.
A section renders whatever a business typed into it, and real businesses type anything. The Location section broke when a business left its service area blank. The address autocomplete failed for certain states. A product video would not play. A long word in a section title broke its layout. I went back after launch and fixed the specific ways real content broke these screens, and from then on the empty state, the overlong text and the missing field shipped with the section.
What I built inside the editor
The editor shipped and let non-technical owners run their own sites, with more than forty real business websites built and deployed from it. My mark is specific: the screens a business fills whole section types in, Location and physical products among them, and the media library that made an uploaded image reusable anywhere on the site. The harder part is the one that counts: landing a new section into a live product without changing a thing for the businesses already using it.
I can add to a live product that real customers already depend on without breaking what is there, and then fix what real content does to it once it ships.
