This is going to be a multi part series. In this post, I am going to explain how I created a waitlist page for my app SetProgress.
For a simple waitlist, you require only 2 things, a landing page and a way to collect & store emails or phone numbers.
Landing page
For the landing page, I used Unicorn platform. I chose an existing template and made some minor tweaks to it. I did not want to spend time building a page myself since waitlist is a temporary thing and I could spend that time on building the app itself.
I took their Maker
pricing plan, so that I can export the code and host it myself. I did not want to depend on another platform for hosting and keep paying them just for that.
Collecting emails
I wrote a few lines of JavaScript code which will make a call to an API which will have the email the user entered in the waitlist input box. On success, I show the user an alert message with the text Added to waitlist successfully
. I just used javascript alert(success)
for it, no fancy pop up's.
Storing waitlist emails
I decided to store the emails in Airtable. I created an automation in Integromat which will receive the emails through a webhook and write them to Airtable. The automation is a Webhook to Airtable integration. The ajax call from the waitlist form is made to the Webhook API url provided by Integromat.
Creating the logo
I created a simple logo from Figma.
I created it using emoji's 😄
Tools used for the waitlist
- Unicorn platform, for building the landing page.
- Figma, for creating the logo.
- Storyset, for illustration. I used Fast-loading illustration.
- Airtable, to store the emails
- Integromat, to create a webhook and write data to Airtable
- Vercel to deploy the waitlist.
I used the free tier of all the above tools, except Unicorn platform for which I did one time payment of 8$ for a month, just to export the code.
Summary
As you can see, a waitlist doesn't have to be complicated. It can be done in a few simple steps. I don't recommend anyone to spend a lot of time on the waitlist. Focus your time & energy on the actual app itself.
Here's how the waitlist page looks.
Top comments (0)