Save hours of setup time

Let's setup your project in minutes!

Before we start, if you haven't already, clone the ZapStart repository. Check out the Getting Started guide to see how to clone the repository.

Create your landing page

The first step is to create a landing page for your project. We have provided a template for you to use. You can find it in the /app/index.tsx file. You can customize this file to your liking.

The quickest way to get up and running if by pasting the following code into the file.

app/index.tsx

import Hero from "@/components/LandingPage/Hero"
import Features from "@/components/LandingPage/Features"
import Pricing from "@/components/LandingPage/Pricing"
import Testimonials from "@/components/LandingPage/Testimonials"
import FAQ from "@/components/LandingPage/FAQ"
import ProblemStatement from "@/components/LandingPage/ProblemStatement"

export default function Home() {
  return (
    <main>
      <Hero />
      <ProblemStatement />
      <Features />
      <Testimonials />
      <Pricing />
      <FAQ />
    </main>
  )
}

Congratulations! You have successfully set up your landing page. Let's run the project to see what it looks like. Run the following command in your terminal.

terminal

npm run dev

Of course you can customize the landing page to fit your project. You can add more sections, remove sections, or change the order of sections. The choice is yours.