SnapSite is a powerful web application that allows users to prompt, run, edit, and deploy full-stack web applications. It leverages modern technologies like Next.js, Tailwind CSS, and Convex to provide a seamless and intuitive experience for developers and non-developers alike.
🎥
- AI-Powered Code Generation: Generate React-based projects with Tailwind CSS styling using AI prompts.
- Workspace Management: Save and manage your workspaces for easy access to previous projects.
- Live Code Preview: Use Sandpack to edit and preview your code in real-time.
- Token-Based System: Manage your usage with tokens and upgrade plans as needed.
- User Authentication: Secure login with Google OAuth.
- Responsive Design: Fully responsive UI for both desktop and mobile devices.
- Integrated Payments: Upgrade your plan using PayPal for additional tokens.
- Frontend: Next.js, React, Tailwind CSS
- Backend: Convex for database and serverless functions
- AI Integration: Google Generative AI for code and chat responses
- Authentication: Google OAuth
- Payments: PayPal integration
- Real-Time Code Editing: Sandpack by CodeSandbox
- Node.js (v18 or higher)
- npm or yarn
- Convex CLI
npm install -g convex
-
Clone the repository:
git clone https://github.com/your-repo/snapsite.git cd snapsite
-
Install dependencies:
npm install
-
Set up environment variables:
Create a.env.local
file in the root directory and add the following:NEXT_PUBLIC_CONVEX_URL=<your_convex_url> NEXT_PUBLIC_GOOGLE_AUTH_CLIENT_ID_KEY=<your_google_client_id> NEXT_PUBLIC_PAYPAL_CLIENT_ID=<your_paypal_client_id> NEXT_PUBLIC_GEMINI_API_KEY=<your_google_gen_ai_api_key>
-
Start the development server:
npm run dev
-
Open http://localhost:3000 in your browser to see the result.
SnapSite can be deployed on platforms like Vercel or Netlify. Follow the platform-specific instructions for deploying a Next.js application.
This project is licensed under the MIT License. See the LICENSE file for details.
For any inquiries or support, please contact:
📧 [email protected]