Building a Lightweight Landing Page Without React and almost no code

The Overhyped Framework Problem

Let's be real - do you really need React for a simple landing page? Spoiler: Nope.

The Lightweight Approach

1. Ask claude.ai generate a landing website
2. Sign up on netlify
3. Add a netlify config to your git repo

[build]
  publish = "."

That's it your website is published upon every github push.

Demo

I tried this approach on Shopify Tax Invoices app website. Works incredibly well.

How to handle form submission

If you don't need to store the data and can maybe send emails for contact us form you can just add a simple "netlify" to your plain html form and netlify will save the data on their server. It's for free... Looks like this.

<form id="affiliateForm" class="space-y-6" netlify>
                    <div>
                        <label for="name" class="block text-sm font-medium text-gray-700">Full Name</label>
                        <input type="text" name="name" id="name" required class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-primary focus:ring-primary">
                    </div>

                    <div>
                        <label for="email" class="block text-sm font-medium text-gray-700">Email Address</label>
                        <input type="email" name="email" id="email" required class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-primary focus:ring-primary">
                    </div>

                    <div>
                        <label for="website" class="block text-sm font-medium text-gray-700">Website/Blog (optional)</label>
                        <input type="url" name="website" id="website" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-primary focus:ring-primary">
                    </div>

                    <div>
                        <label for="promotion" class="block text-sm font-medium text-gray-700">How will you promote Tax Invoice?</label>
                        <textarea name="promotion" id="promotion" rows="4" required class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-primary focus:ring-primary"></textarea>
                    </div>

                    <div>
                        <button type="submit" class="w-full flex justify-center py-3 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-primary hover:bg-primary-dark focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary">
                            Submit Application
                        </button>
                    </div>
                </form>

Challenges

The approach overall is robust but after about 3 pages you might run into some challenges, such as.

1. Difficulty updating common components such as footer using cursor.ai. Sometimes it will just say "Go and updated yourself"