# SaaS Marketing Boost: Build a Landing Page with AI Fast

TLDR: In this article, I share my experience of building a SaaS marketing landing page with an email subscription function using various AI tools in just a few hours. You can view the webpage here: [**https://go.choley.bahridd.in/**](https://go.choley.bahridd.in/)

---

Over the past few months, I've been developing a SaaS app for table tennis clubs (the app itself is beyond the scope of this article). After completing the MVP, I realized I needed a strategy to market my product. An online suggestion was to create a simple marketing website with an email subscription form before the official launch. This approach allows you to:

* Compile a list of potential customers who are interested enough to provide their email addresses.
    
* Connect with some of them to understand their needs and the problems they hope your app will solve.
    

Given my busy schedule and full-time job, I wanted to build and deploy this quickly and cost-effectively. This was the perfect opportunity to leverage AI tools to the fullest.

The plan was straightforward:

1. **Create the UI using HTML and CSS.**
    
2. **Develop a minimal backend to capture emails and store them.**
    
3. **Deploy the application.**
    

For the first step, I used [**Readdy.AI**](http://Readdy.AI), which generated [a decent](https://readdy.ai/) [**landing page**](https://readdy.site/share/651c1371c3efa22ae0dfe344fc0e8a3d) from the initial prompt[:](https://readdy.site/share/651c1371c3efa22ae0dfe344fc0e8a3d)

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1738498854485/85a10796-8679-4bae-9e85-a45e541ae847.png align="center")

It used React and Shadcn UI components to create the page. A few adjustments I wanted to make included:

1. The hero image was unsettling, resembling a horror movie intro 👻. However, this was easily fixable by replacing the image.
    
2. I wanted to add a screenshot of the app to give customers a preview.
    

After few more prompts, Readdy made a [good progress](https://readdy.site/share/695d4fd867075adb3a59d40db083c9fc).

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1738499422120/f013c71d-b1c4-43f9-b441-353207a967e5.png align="center")

I later discovered it wasn't responsive—viewing the link on a mobile device illustrates this issue. I resolved it by hiding the screenshot on mobile screens.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1738502879238/a5ee03f6-3784-48d5-bf88-01600e10b1e9.png align="center")

I also updated the email form in the footer to collect more information than just the email address, such as feedback and the user's role (player or club admin). I figured that if users reached the end of the page, they were interested enough to provide additional details.

For the backend and deployment, I sought help from ChatGPT, which recommended using Next.js and [Vercel](https://vercel.com/). Despite having no prior experience with these technologies, the process went smoothly. I used Google Spreadsheet for email storage. All other technical details were implemented using ChatGPT and Cursor IDE with its AI features:

* Registering Google Cloud API to write to the spreadsheet
    
* Implementing backend code to write to the spreadsheet
    
* Adding DNS records
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1738842532245/2cf2d23a-cd1a-47da-bf05-0f3e7821d550.gif align="center")

In summary, I used free tiers of Readdy.ai, ChatGPT, and Pro version of Cursor. All the code is [**publicly available**](https://github.com/bahriddin/choley-marketing). You can visit the landing page here: [**https://go.choley.bahridd.in/**](https://go.choley.bahridd.in/)