Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/almoghindi/nuxt-ai-saas

A Nuxt AI SaaS platform offering authentication, live chat, and AI-powered image, code, video, and music generation. Built with Nuxt, Vue, and TypeScript, it integrates Supabase for backend, OpenAI for AI services, Prisma for database management, Tailwind CSS for styling, and Swipe for payment processing.
https://github.com/almoghindi/nuxt-ai-saas

Last synced: about 1 month ago
JSON representation

A Nuxt AI SaaS platform offering authentication, live chat, and AI-powered image, code, video, and music generation. Built with Nuxt, Vue, and TypeScript, it integrates Supabase for backend, OpenAI for AI services, Prisma for database management, Tailwind CSS for styling, and Swipe for payment processing.

Awesome Lists containing this project

README

        

# Nuxt AI SaaS Platform

## Project Overview
This project is a comprehensive AI-powered SaaS platform built with Nuxt, Vue, and TypeScript. The platform offers a range of features including user authentication, live chat, AI-based image, code, video, and music generation, as well as payment processing. The backend is powered by Supabase and Prisma, with AI services provided by OpenAI. The frontend is styled using Tailwind CSS, and payments are handled via Swipe.

## Key Features
- **Authentication**: Secure user login and registration.
- **Live Chat**: Real-time communication for users.
- **AI-Powered Image Generation**: Generate images using AI.
- **AI-Powered Code Generation**: Generate code snippets with AI assistance.
- **AI-Powered Video Generation**: Create videos using AI.
- **AI-Powered Music Generation**: Compose music tracks with AI.
- **Payment Processing**: Integrated payment gateway using Swipe.

## Technologies Used
- **Frontend**: Nuxt, Vue, TypeScript, Tailwind CSS
- **Backend**: Supabase, Prisma
- **AI Services**: OpenAI
- **Payment Gateway**: Swipe

## Prerequisites
- Node.js and npm installed
- Supabase account setup
- Swipe account for payment processing

## Getting Started

### 1. Clone the Repository
```bash
git clone https://github.com/yourusername/nuxt-ai-saas.git
cd nuxt-ai-saas
```

### 2. Install Dependencies
```bash
npm install
```

### 3. Set Up Environment Variables
Create a .env file in the root directory with the necessary environment variables for Supabase, OpenAI, and Swipe.

Example .env file:
```bash
SUPABASE_URL=your-supabase-url
SUPABASE_KEY=your-supabase-key
OPENAI_API_KEY=your-openai-api-key
STRIPE_API_KEY=your-stripe-api-key
```

### 4. Run the Development Server
```bash
npm run dev
```

## Pages:
### Landing Page:
![Screenshot 2024-08-09 145501](https://github.com/user-attachments/assets/2506b3bf-106d-4719-bfb2-42ae6377cb36)

### Explore Page:
![Screenshot 2024-08-09 145445](https://github.com/user-attachments/assets/1e6f72c4-39ce-4029-92fc-e03337515803)

### Conversation Page:
![Screenshot 2024-08-09 150442](https://github.com/user-attachments/assets/26ea541b-f9bd-413c-ad65-7eb22c8a8ed8)

### Image generation Page:
![Screenshot 2024-08-09 150425](https://github.com/user-attachments/assets/a81d2e13-97a4-481d-adef-4a38590bc1fc)

### Code generation Page:
![Screenshot 2024-08-09 150526](https://github.com/user-attachments/assets/1977d556-9416-437e-b183-42bc085fe92a)

### Music generation Page:
![Screenshot 2024-08-09 150833](https://github.com/user-attachments/assets/e3afe555-b4f9-4d88-8b85-fbe1e06ba30f)

### Video generation Page:
![Screenshot 2024-08-09 150855](https://github.com/user-attachments/assets/891cb72e-a362-4d0a-bd0d-8b7f5ea4742e)