Want to Contribute to us or want to have 15k+ Audience read your Article ? Or Just want to make a strong Backlink?

How we built a GPT Web App Generator for React & Node.js – from idea to 25,000 apps in 4 months

We’re engaged on Wasp – a full-stack internet framework constructed on React, Node.js, and Prisma. Since GPT got here out, we questioned if we might use it to make constructing internet apps even sooner. That led us to MAGE – a GPT-powered web app generator that may create a full-stack codebase based mostly on a brief description.

We already wrote about what MAGE can (and might’t) do and how it works under the hood. That is the story about its origin and adoption – why we determined to construct it, how builders found it, and what they’re truly doing with it.



Why construct one other AI coding agent?

We received into the entire GPT coding agent recreation fairly late. Instruments akin to Smol AI, GPT Engineer, and MetaGPT had already acquired plenty of consideration earlier than we even began desirous about creating our personal, and we have been nicely conscious of it.

So why trouble? Properly, the factor was, none of those brokers have been explicitly made for constructing internet apps, and that’s the place we noticed a possibility.

Though utilizing GPT brokers for coding can really feel tremendous empowering, they’ll typically be gradual and miss the purpose, requiring many iterations and finally making the method pretty cumbersome and costly.

With this expertise, we questioned, “What if we made a coding agent extremely specialised for internet purposes in a selected stack and nothing else? How a lot simpler, sooner, and cheaper might or not it’s?”

Though we have been intrigued by this, being a small staff juggling a number of priorities, we have been nonetheless fairly skeptical and virtually dropped the entire mission. Seems, it labored even higher than we anticipated.



Step 1: Construct it 🛠️

how-it-works

When deciding what v0 of MAGE (Magic App GEnerator) would appear like, we thought-about a number of choices. The primary, most simple one was integrating it with the Wasp CLI, since we already had all of the tooling round it. Then builders, as a substitute of operating wasp new myProject, would run, e.g., wasp new myProject -ai, and CLI would ask them for app description and different required inputs, after which do all of the work within the terminal.

Alternatively, we knew that downloading and putting in Wasp earlier than even beginning to describe your app was an enormous ask. On prime of that, consumer interface capabilities within the CLI are fairly restricted. That’s why we landed on an online interface — zero friction to get began, and we might make the app creation movement lifeless easy and handsome.

It took a number of weeks to construct it, and the ultimate outcome was a fully open-source web application made with Wasp that might be used at no cost at https://usemage.ai/, or hosted domestically for extra management and suppleness (e.g., utilizing your personal OpenAI API keys).



Going super-specific (internet apps solely) paid off!

mage-plan

As talked about above, our predominant guess was making a specialised coding agent for constructing full-stack internet apps and nothing else, which paid off. It allowed us to offer the agent with a lot context and construction upfront and introduce specialised heuristics for fixing errors. Additionally, resulting from Wasp’s high-level abstractions (e.g., auth, mission construction, queries & actions system, …), we considerably lowered the floor space for errors.

One other consequence was considerably lowered execution time, and, perhaps much more importantly, price. A typical MAGE-created internet app prices between $0.10 – $0.20, whereas basic coding brokers could spend up to $10 for the same app (all costs are earlier than the Nov 7, ‘23 pricing replace announcement by OpenAI).

You possibly can learn extra about how Wasp works internally here, and the way it compares to different coding brokers here.



Step 2: Launch it 🚀

chart

Constructing a product is one factor, however spreading the phrase about it and getting individuals to make use of it’s solely one other. After we constructed MAGE and examined it throughout the staff, the query was what to do subsequent? How will we truly attain builders and begin receiving suggestions?



Group launch – proof of life

waspularity

Since we already had a community for Wasp with around 1,000 members on the time, we released MAGE as a part of our Launch Week #3. It was an excellent check mattress, and we might see the primary apps being constructed. Nonetheless, many extra builders on the market might have benefited from a better technique to begin their React & Node.js initiatives, they usually had no means of discovering out about MAGE.



Launching on Product Hunt — first “actual” utilization

mage-ph

That’s why we determined, following our inside neighborhood launch, to place MAGE up on Product Hunt. Though Product Hunt isn’t a dev tool-specific platform and attracts a crowd from very numerous backgrounds, there are nonetheless a number of builders on it, and we previously had good experience with it. Product Hunt was integral in getting the first users for Wasp and reaching 1,000 stars on GitHub, so we wished to provide it a go yet one more time.

Some individuals put a number of effort into launch preparations and take months upfront to prepare, however we didn’t have that point and simply wished to get it out as quickly as potential. We requested our associates and neighborhood to take a look at MAGE on Product Hunt and help us on the day of the launch, and we ended up within the prime ten merchandise of the day, and later #2 developer device of the week!

That was our purpose, as the highest ten merchandise find yourself in a publication the next day, learn by greater than 1M subscribers. Very quickly, we noticed a big rise within the variety of apps being created, and new individuals began becoming a member of our Discord neighborhood!



The natural development (aka “doing nothing”) part

Following the Product Hunt launch, we relaxed our advertising and marketing efforts, as different Wasp-related duties caught up with the staff. We needed to put together for the upcoming Launch Week #4, so MAGE ended up on a again burner. We additionally wished to see how the neighborhood would settle for it earlier than we determined to speculate extra assets into it.

We put out just a few extra follow-up articles, “How it works under the hood”, and “MAGE vs. general coding agents” which acquired a mean quantity of traction, however nothing exploded. We additionally had little or no success on Reddit and Hackernews, and it felt just like the neighborhood was fed up with all of the AI content material.

Nonetheless, the variety of apps created with MAGE grew constantly (~200 apps/day), with an occasional mini explosion. We couldn’t actually observe the place the customers have been coming from – it appeared MAGE was being unfold through phrase of mouth within the closed communities and newsletters.



YouTube and TikTok movies – virality (1,300 apps/day!)

After our Launch Week #4 was over, we realized that for nearly 2 months, with minimal effort from our facet, MAGE stored rising with out stopping. That signaled us that it had some actual worth, and we determined to speculate extra in it.

matt_yt_video

We determined to attempt our luck with the influencers within the area. We didn’t wish to merely pay for an advert, however wished to associate with anyone genuinely considering what we’re constructing and who desires to overview MAGE objectively. We discovered that in Matthew Berman, who covers every part from the most recent fashions to instruments within the LLM area, and he noticed MAGE as a wonderful match for his viewers.

The video was prepared in just a few weeks, and when it received out, it rapidly reached round 25,000 views. Many viewers received excited by the potential of getting a full-stack codebase from a single immediate through the online interface, and we noticed one other spike in utilization and builders making an attempt it out.

tiktok_video

A few week later, we noticed one other huge spike within the variety of created apps, however couldn’t determine the place it got here from. We did some looking out and located a developer on TikTok, @techfren, who had performed a short video about it (MAGE even ended up not working in that one!), which skyrocketed to 200,000 views in a day and rapidly went viral. Right this moment, it has virtually 1M views.



The truth – what occurs with all these apps?

Though 25,000 created apps might sound spectacular, it’s good to take a step again and break this additional down.

As with most AI-powered coding instruments, there’s a big quantity of curiosity and curiosity within the area, each from builders and non-developers who wish to construct their merchandise. Many even don’t have a selected mission they wish to construct, however they’re eager to attempt it out and see the way it works. Additionally, since LLMs should not deterministic, no device works completely but, and minor errors that require guide intervention and coding information are sometimes launched.

Though we’re very express about this and different challenges GPT-powered instruments face, MAGE nonetheless attracts a portion of customers who’re enthusiastic about constructing their product, however should not proficient with coding and require assist downloading, operating, and fixing their apps. Alternatively, it’s a very pleasant and accessible technique to get entangled with internet improvement and coding typically. We don’t discourage non-coders from making an attempt it out however attempt to handle expectations as transparently as potential.

Consequently, about 40% of all created apps are downloaded to be run domestically.



Conclusion

Our experiment with MAGE proved to be successful, much more than we initially anticipated. Apart from many current basic coding brokers, a extremely specialised and structured strategy can produce higher and extra constant outcomes, for a fraction of the value.

Additionally, builders are enthusiastic about a simple technique to begin their full-stack apps, with greatest practices included, and are actively looking for such an answer and sharing it amongst themselves.

I anticipate AI-assisted SaaS starters to be the way forward for internet improvement. Why would anyone use a generic boilerplate starter if they’ll get their app scaffolded with the info fashions and CRUD logic already custom-made for his or her app? One other query is who and the way precisely will implement this, however I anticipate each mainstream framework to have one sooner or later.



Good luck!

I hope you discover this overview useful and that it sheds some mild on what issues appear like behind the scenes when creating and advertising and marketing a brand new (AI-powered) developer device. Remember this was our singular expertise and that each story is completely different, so take every part with a grain of salt and choose solely what is smart for you and your product.

We want you the perfect of luck, and be happy to join us on Discord you probably have any questions or wish to keep updated with the event of MAGE and Wasp!

Add a Comment

Your email address will not be published. Required fields are marked *

Want to Contribute to us or want to have 15k+ Audience read your Article ? Or Just want to make a strong Backlink?