If you’ve read The Lean Startup then you understand the importance of creating a landing page to gather email signups before writing the first line of code. Idea validation is probably the most important step in creating a successful product. Why spend the next couple of weeks or months creating an MVP to realize no one actually values or needs your product? I’ve done this a few times, and even though it was great experience building, launching, and marketing a product, I don’t think I’d ever start coding before I’ve validated an idea again.
Being an indie product developer I try to iterate on ideas fast while putting in as least amount of capital as possible. There are many amazing ways to launch a landing page. Mailchimp, Wordpress, Wix, the list goes on and on. The great thing about these solutions is that you can get an amazing landing page up in less about an hour. The downside is that it costs money to do this. Even though the costs are around $10/month, if you’re trying to validate 5 or more ideas, it will add up. That’s also not including the costs of registering a domain.
In this post I’ll show you the stack I use to create and launch landing pages for free.
The tech stack that I use requires a bit of coding knowledge, along with an understanding of how to create a Github repo and push your code to it. As well as the ability to install different repos. Everything else is pretty much out of the box.
GatsbyJS
This static site generator is the core of your landing page. It’s built on top of React, the most popular JavaScript framework on the web.
Below are a few themes you can pull from Github to use out of the box.
Gatsby Lander
- Live Preview: https://gatsby-lander.surge.sh/
- Github Repository: https://github.com/codebushi/gatsby-starter-lander
Gatsby Starter SaaS Marketing
- Live Preview: https://gatsby-starter-saas-marketing.netlify.com/
- Github Repository: https://github.com/keegn/gatsby-starter-saas-marketing
Website Static
- Live Preview: https://histaff.io/
- Github Repository: https://github.com/histaff/website-static
Undraw
This is the number one place to find and use free illustrations. These illustrations are professionally made. The catalog is huge and you’ll likely find enough images to convey your product.
Vercel
Mainly used to host your landing page. You can either drag and drop your project into Vercel and it will launch it automatically for you. Another option is to create a Github repository, push your newly created GatsbyJS landing page, and hook it right up to Vercel. The pluses of integrating with Github is the ability for continuous deployment. Make a change to your code, push it, and Vercel will automatically build and launch it for you.
Example Landing Page
Below is an example landing page I created in under an hour using GatsbyJS, Undraw, and Zeit. I’m so happy with the look. The best part is it’s free to host forever. Now I can leave the landing page up and wait until I get enough sign ups before starting. In the meantime, I’m going to start validating a few more ideas.
Contact me at here for more information about the stack as well as any questions or problems you might have launching it.
Top comments (0)