I Made a Web App with Replit, and I Can Barely Code (pt. 1)
- Lindey Hoak
- Sep 23
- 5 min read
Updated: Sep 26
By "barely," I mean one semester of Python in college… which was cut short by COVID-19.
I’m not a software developer. But to my surprise, I didn’t need to be one to launch a web app.
I’m in the fortunate position of working at a company that encourages experimentation, including with AI. My title may be Graphic Designer, but I've worn many hats. I’m encouraged to push my skills, try new tools, and step outside my comfort zone.
Most of the websites I’ve built have been on Wix, WordPress, Squarespace, and Shopify. You don't need coding skills for those platforms. In fact, sites like Wix are rolling out more and more AI-generated pages, blogs, and logos, making the process even more accessible.
But then my employer introduced me to a web app builder that blew the others out of the water: Replit.
Did it unlock new incredible capabilities? Yes.
Did I feel the freedom and unlimited potential to build whatever my heart desires? Yes!
Did I face frustration as I continuously tried to explain to a computer that it was still showing my lunch availability starting at 3am? Absolutely.
TL;DR: I was able to build a beautiful, functioning website (check it out!) that utilized tools unavailable on a cookie-cutter platform. I was surprised by the most peculiar issues that snagged Replit along the way, but together, we successfully built something great. It was possible, but spoiler: it took far more work than expected.
Setting the Stage
My boss, John, wanted an app to connect business professionals for lunch.
The idea came from an event John attended, where someone said, “I’m sure there are great people right around my office, but it’s hard to meet them! I wish I had an app to connect and meet for a quick lunch.”
With a new tool like Replit, could John come back for the next monthly meeting with a working app? We set out to see what we could accomplish (Spoiler: It wasn't ready within a month).
I started with the graphic design part; what I'm hired to do. I brainstormed name and branding ideas, and we landed on Superior Networking. I drafted up a quick logo and tagline:
Superior Network: Great people are just around the corner.
Connect with local professionals in your area.
Let's break this down: What would the web app need to do?
Sign users up
Create an account that safely stores their info and progress
Integrate their LinkedIn profile (to verify their true identity, for safety purposes)
Connect users with professionals in their close physical vicinity
Schedule networking meet-ups (lunch, coffee, drinks, etc.)
Integrate the user’s digital calendar
Sounds easy enough! I thought, full of zeal and excitement to try a new tool. But this project was going to be far more than I bargained for.
I started by verbally throwing up on Replit. I typed out a detailed message describing everything I knew I wanted. I rambled about the pages I was envisioning, the details of the sign-up process, and the branding I'd picked (Poppins Semibold headers, white website with #f56d1d orange and #28a3c9 blue). Then I pressed send, and Replit got to work.
To edit the site, all I had to do was chat with Replit's AI tool 'Agent.' And I really mean chat; I didn’t open the site's code files once.
This was my full screen layout. Replit's Agent chat on the left, website page previews in the middle, and the site's console on the right. I didn’t necessarily even need to understand the console's code. I could just screenshot it and Agent would interpret the code on its own.
Starting with the Pros
Agent created a clean homepage within minutes and a full website layout in mere days. Its default and filler content looked good, with only the occasional spacing issue.
This is a preview of the mock matches it initially provided. It nailed the layout, from the profile cards to the match's distance. It was Agent's idea to include common interests, which I hadn't asked for.
The agent was a pretty good listener. Granted, it didn't always achieve what I wanted right away, but it responded with enough clarification that it understood my requests. I could ramble on for a paragraph, and it’d immediately understand my intention.
Can I brag for a moment about our interactive map?! I casually asked an AI bot to build an interactive in-page map with an adjustable, scalable radius, so users could search for their hometown or address and choose the vicinity where they’d like to meet people. It built this successfully within minutes.
I was genuinely cheering for joy in my desk chair. This felt so good. I didn’t have to search endlessly for a 3rd party app. I didn’t have to build it myself, either. Ten points for Replit!
It also took the overwhelming project of building a site and broke it down into tasks:
It felt very rewarding to see the site coming together, especially with how quickly the bones were built.
I’d type, Agent would think, I’d watch it work, then repeat. As we went back and forth, I marveled at how much time these tiny details would’ve taken me to figure out on my own. Something as seemingly simple as a pop-up, where the details need to be dynamic to the user’s choice, the event that’ll appear in my Google Calendar needs to match… Agent tackled so many details all at once. It deserved some serious credit.
As I explained to John: “It built everything so fast, I thought the whole project was going to be done in a week! After initial instructions, it worked so fast. But that's when we started getting stuck... Everything became a troubleshooting cycle.”
He shared some sound advice: “I like to say that software projects follow this 80:20 rule: You’ll find you can do 80% of the work in 20% of the time. Then the last 20% of the work takes 80% of the time."
John would be very right, as the final 20% was yet to come.
Tune in next time for the second part of this app-building story.
Want to skip ahead to a spoiler by exploring the final product? You can check out Superior Network now!
Comments