Added Readme and lisence

This commit is contained in:
Deepak Bhattarai
2025-03-24 16:33:13 +05:45
parent 3886ade46d
commit fcb31615eb
2 changed files with 210 additions and 22 deletions
+21
View File
@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2024 ALLWEONE Team
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
+189 -22
View File
@@ -1,36 +1,203 @@
This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
# ALLWEONE Presentation Generator
## Getting Started
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
[![TypeScript](https://img.shields.io/badge/TypeScript-007ACC?logo=typescript&logoColor=white)](https://www.typescriptlang.org/)
[![Next.js](https://img.shields.io/badge/Next.js-000000?logo=next.js&logoColor=white)](https://nextjs.org/)
[![React](https://img.shields.io/badge/React-61DAFB?logo=react&logoColor=black)](https://reactjs.org/)
[![Tailwind CSS](https://img.shields.io/badge/Tailwind_CSS-38B2AC?logo=tailwind-css&logoColor=white)](https://tailwindcss.com/)
First, run the development server:
An open-source AI-powered presentation generator that creates beautiful, customizable slides in minutes. This tool is part of the broader ALLWEONE AI platform.
```bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
[Live Demo](https://allweone.com/presentation) | [Video Tutorial](https://your-video-url-here.com)
## 🌟 Features
- **AI-Powered Content Generation**: Create complete presentations on any topic with AI
- **Customizable Slides**: Choose the number of slides, language, and page style
- **Editable Outlines**: Review and modify AI-generated outlines before finalizing
- **Multiple Themes**: 9 built-in themes with more coming soon
- **Custom Theme Creation**: Create and save your own themes from scratch
- **Image Generation**: Choose different AI image generation models for your slides
- **Audience-Focused Styles**: Select between professional and casual presentation styles
- **Real-Time Generation**: Watch your presentation build live as content is created
- **Full Editability**: Modify text, fonts, and design elements as needed
- **Presentation Mode**: Present directly from the application
- **Auto-Save**: Everything saves automatically as you work
## 🚀 Getting Started
### Prerequisites
- Node.js 18.x or higher
- npm or yarn
- OpenAI API key (for AI generation features)
- Together AI API key (for Image generation)
- Google Client ID and Secret for authentication feature
### Installation
1. Clone the repository:
```bash
git clone git@github.com:allweonedev/presentation-ai.git
cd presentation-ai
```
2. Install dependencies:
```bash
pnpm install
```
3. Set up environment variables:
Create a `.env.local` file in the root directory with:
```
OPENAI_API_KEY=your_openai_api_key_here
# Add any other required API keys for image generation
# PostgreSQL Database URL
DATABASE_URL="postgresql://username:password@localhost:5432/presentation_ai"
```
Note: You need to set up a PostgreSQL database for testing the application.
4. Set up the database:
```bash
pnpm db:push
```
5. Start the development server:
```bash
pnpm dev
```
6. Open [http://localhost:3000](http://localhost:3000) in your browser to see the application.
## 💻 Usage
### Creating a Presentation
1. Navigate to the dashboard
2. Enter your presentation topic
3. Choose the number of slides (recommended: 5-10)
4. Select your preferred language
5. Choose a page style
6. Click "Generate Outline"
7. Review and edit the AI-generated outline
8. Select a theme for your presentation
9. Choose an image generation model
10. Select your presentation style (Professional/Casual)
11. Click "Generate Presentation"
12. Wait for the AI to create your slides in real-time
13. Preview, edit, and refine your presentation as needed
14. Present directly from the app or export your presentation
### Custom Themes
1. Click "Create New Theme"
2. Start from scratch or derive from an existing theme
3. Customize colors, fonts, and layout
4. Save your theme for future use
## 🧰 Tech Stack
This project is built with:
- **Next.js**: React framework for server-rendered applications
- **React**: UI library for building user interfaces
- **Prisma**: Database ORM with PostgreSQL
- **Tailwind CSS**: Utility-first CSS framework
- **TypeScript**: Typed JavaScript
- **OpenAI API**: For AI content generation
- **Radix UI**: Headless UI components
- **Plate Editor**: Rich text editing system for handling text, images, and slide components
- **Authentication**: NextAuth.js for user authentication
- **UploadThing**: File uploads
- **DND Kit**: Drag and drop functionality
## 🛠️ Project Structure
```
presentation/
├── .next/ # Next.js build output
├── node_modules/ # Dependencies
├── prisma/ # Database schema
│ └── schema.prisma # Prisma database model
├── src/ # Source code
│ ├── app/ # Next.js app router
│ ├── components/ # Reusable UI components
│ │ ├── auth/ # Authentication components
│ │ ├── presentation/ # Presentation-related components
│ │ │ ├── dashboard/ # Dashboard UI
│ │ │ ├── editor/ # Presentation editor
│ │ │ │ ├── custom-elements/ # Custom editor elements
│ │ │ │ ├── dnd/ # Drag and drop functionality
│ │ │ │ └── native-elements/ # Native editor elements
│ │ │ ├── outline/ # Presentation outline components
│ │ │ ├── theme/ # Theme-related components
│ │ │ └── utils/ # Presentation utilities
│ │ ├── prose-mirror/ # ProseMirror editor components for the outline part
│ │ ├── text-editor/ # Text editor components
│ │ │ ├── hooks/ # Editor hooks
│ │ │ ├── lib/ # Editor libraries
│ │ │ ├── plate-ui/ # Plate editor UI components
│ │ │ └── plugins/ # Editor plugins
│ │ └── ui/ # Shared UI components
│ ├── hooks/ # Custom React hooks
│ ├── lib/ # Utility functions and shared code
│ ├── provider/ # Context providers
│ ├── server/ # Server-side code
│ ├── states/ # State management
│ ├── middleware.ts # Next.js middleware
│ └── env.js # Environment configuration
├── .env # Environment variables
├── .env.example # Example environment variables
├── next.config.js # Next.js configuration
├── package.json # Project dependencies and scripts
├── tailwind.config.ts # Tailwind CSS configuration
└── tsconfig.json # TypeScript configuration
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
## 🤝 Contributing
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
We welcome contributions to the ALLWEONE Presentation Generator! Here's how you can help:
This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
1. Fork the repository
2. Create a feature branch (`git checkout -b feature/amazing-feature`)
3. Commit your changes (`git commit -m 'Add some amazing feature'`)
4. Push to the branch (`git push origin feature/amazing-feature`)
5. Open a Pull Request
## Learn More
Please read our [Contributing Guidelines](CONTRIBUTING.md) for more details.
To learn more about Next.js, take a look at the following resources:
## 📝 License
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
## 🙏 Acknowledgements
## Deploy on Vercel
- [OpenAI](https://openai.com/) for AI generation capabilities
- [Plate Editor](https://plate.udecode.io/) for rich text editing
- [Radix UI](https://www.radix-ui.com/) for accessible UI components
- [Next.js](https://nextjs.org/) for the React framework
- All our open-source [contributors](https://github.com/allweonedev/presentation-ai/graphs/contributors)
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
## 🔮 Future Plans
Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
- Export options (PowerPoint, PDF, Google Slides)
- Collaborative editing
- More AI models and image generation options
- Template library
- Voice commands for presentations
- Advanced animation options
- More layout and component options for slides
- Enhanced Plate.js integration for richer slide content
---
Built with ❤️ by the ALLWEONE team
For any questions or support, please open an issue on GitHub or contact us at your-email@example.com