Building a SEO-optimized free landing page in less than 20 minutes using low-code
Our favorite tech stack for building a landing page in less than 20 minutes:
- 📚 Notion
- ⚛️ react-notion-x library
Back in August 2020, some friends asked me (Steven) for some tech help to create a website for their climate advocacy campaign #TechForLocalLaw97 .
Within 20 minutes, I was done with the V1 of the website, which you can see here:
Recipe
How did I do it?
- 📚 Host content on a publicly published Notion page. Notion is especially nice because:
- non-technical folks can edit the content easily
- allows for things like embedded content (videos, photos, other web pages)
- already nicely formatted
Basically, Notion is the CMS.
- 🌐 Use Vercel for website infrastructure/hosting. Vercel is nice because it:
- Is free
- Requires very little boilerplate/setup
- Has built-in basic analytics for free
- ⚛️ Use react-notion-x as the library to host the Notion page on Vercel. It's as easy as one line of code to configure the React component's notionId prop!
Alternatives
🤔 Why not just use a public Notion page directly?
- Because you don't get: free analytics, SEO, and customization
🤔 Why not use a no-code website builder tool like Webflow, Potion, or Super?
- You absolutely should if you can't write code, but all those solutions cost at least $10/month for custom domains and/or analytics (plus you may need to add additional users for edit-only permissions, etc.)
If you can copy paste a few lines of javascript, my suggested low-code solution probably takes just as long as implementing a no-code solution
This solution is free (unless you're getting 100,000s of views, at which point you can probably monetize the traffic anyway 😁 ) and way more customizable
P.S. Fillout's help center, WARNTracker, DealOpsAutomation’s website all use some variation of this stack as well!