Welcome to Your New App!

Here's what you can do next.

Poke around the app

Before you start building, take a moment to poke around the current bare-bones app. Login with admin@example.com and youareawesome and check out the user's dashboard.

Also create a new account to see the onboarding flow: when a user inserts their email on the signup page, a TOTP code will be sent to confirm his email. LaunchFast mocks Resend's API (and all other 3rd-party APIs) during development to support offline work, so the TOTP code will be logged in the terminal instead of hitting the real API and sent to the user.

Explore The Stack

Then take a moment explore the folder structure. Here's what you'll find:

• Components in /app/components
• Hooks in /app/hooks
• Routes in /app/routes

  You'll notice that some folders have _ and + characters. This is part of a convention called Flat Routes. The _ in /app/routes/_marketing+ indicates that this folder won't be part of the URL. So /app/routes/_marketing+/index.tsx and /app/routes/_auth+/login.tsx are both accessible at / and /login respectively. I think about it like this: "_ means the folder is invisible".

  The + makes it so the flat-routes convention extend to the items inside that folder.

• Styles in /app/styles
• Utilities in /app/utils
• Root file in /app/root.tsx
• Database schema in /prisma/schema.prisma
• End-to-end tests in /tests

Read the docs

Once you're ready to start building, check out the docs.

Edit this homepage

Go to /app/routes/_marketing+/index.tsx and replace its contents with this:

import { Container } from '#app/ui/components/verveui/layout/container.js'
import { Benefits } from '#app/ui/sections/benefits.js'
import { CTA } from '#app/ui/sections/cta.js'
import { FAQ } from '#app/ui/sections/faq.js'
import { FeaturedOn } from '#app/ui/sections/featured-on.js'
import { Hero } from '#app/ui/sections/hero.js'
import { Pricing } from '#app/ui/sections/pricing.js'
import { Problem } from '#app/ui/sections/problem.js'
import { Testimonials } from '#app/ui/sections/testimonials.js'

const Route = () => {
	return (
		<Container>
			<Hero />
			<FeaturedOn />
			<Problem />
			<Benefits />
			<Testimonials />
			<Pricing />
			<FAQ />
			<CTA className="mb-48" />
		</Container>
	)
}
export default Route

I hope you enjoy building with LaunchFast. Happy coding!