Astra - AI Powered Website Builder

Introduction

Astra is a modern, fully responsive website built with a powerful tech stack. This project showcases the use of Next.js for server-side rendering, TailwindCSS for sleek styling, shadcn UI for elegant components, and Clerk for secure authentication.

Watch Tutorial on YouTube

Check out the preivew to see how this website was built: Astra Website Tutorial

Tech Stack

• Next.js: For building the React-based website.
• TailwindCSS: For styling with utility-first CSS.
• Shadcn UI: For UI components.
• Magic UI: For UI components.
• Clerk: For user authentication.

Quick Start

Prerequisites

Make sure that you have installed

• Node.js
• Git
• npm / yarn / pnpm / bun

1. Clone this repository:

   git clone https://github.com/Shreyas-29/astra-website.git
   cd astra-website
   

2. Install dependencies:

   npm install
   

3. Setup env variables:

    # app
    NEXT_PUBLIC_URL=http://localhost:3000
    NEXT_PUBLIC_DOMAIN=localhost:3000
   
    # clerk
    CLERK_SECRET_KEY=
    NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
    NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
    NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
    NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/
    NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/
   

4. Run the development server:

   npm run dev
   

5. Open your browser and navigate to http://localhost:3000 to see the website in action.

Assets

Download all the assets required for this project here.

☕ Buy Me a Coffee

If you enjoy using caps.ai, consider supporting my work!
Buy Me a Coffee ☕