A modern, feature-rich collaborative document editing platform built with Next.js, Liveblocks, and AI assistance.
- Real-time Collaboration: Multiple users can edit documents simultaneously with live cursors and presence indicators
- Rich Text Editor: Powered by Lexical with advanced formatting options (bold, italic, headings, lists, etc.)
- AI Writing Assistant: Integrated Gemini AI for content suggestions, writing help, and document enhancement
- Live Comments: Real-time commenting system with threaded discussions
- User Management: Role-based access control (viewer, editor) with sharing permissions
- Document Sharing: Share documents via email with customizable access levels
- Authentication: Secure user authentication with Clerk
- Real-time Sync: Powered by Liveblocks for seamless collaboration
- Responsive Design: Mobile-first approach with Tailwind CSS
- Dark/Light Theme: Elegant themes optimized for productivity
- Email Notifications: Automated sharing and collaboration notifications
- Type Safety: Full TypeScript implementation
- Modern UI: Radix UI components with custom styling
- Intuitive Interface: Clean, modern design focused on productivity
- Active Collaborators: See who's online and where they're working
- Document Dashboard: Organized view of all your documents
- Quick Actions: Fast document creation, sharing, and management
- Notifications: Stay updated on document changes and collaborations
- Framework: Next.js 14 - React framework with App Router
- Language: TypeScript - Type-safe JavaScript
- Styling: Tailwind CSS - Utility-first CSS framework
- UI Components: Radix UI - Unstyled, accessible components
- Editor: Lexical - Extensible text editor framework
- Real-time Collaboration: Liveblocks - Real-time collaboration infrastructure
- Authentication: Clerk - Complete authentication solution
- AI Integration: Google Gemini AI - Advanced language model
- Email Service: MailerSend - Transactional email API
- Package Manager: npm
- Linting: ESLint with Next.js config
- Code Formatting: Built-in Next.js standards
- Type Checking: TypeScript compiler
Before running FlowDocs, ensure you have:
- Node.js (v18 or higher)
- npm or yarn package manager
- Git for version control
You'll need to obtain the following API keys:
- Liveblocks: Get API key
- Clerk: Get API key
- Google Gemini AI: Get API key
- MailerSend: Get API key
-
Clone the repository
git clone https://github.com/SouptikTaran/FlowDocs.git cd FlowDocs -
Install dependencies
npm install
-
Set up environment variables
Create a
.env.localfile in the root directory:# Clerk Authentication NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key CLERK_SECRET_KEY=your_clerk_secret_key NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up # Liveblocks NEXT_PUBLIC_LIVEBLOCKS_PUBLIC_KEY=your_liveblocks_public_key LIVEBLOCKS_SECRET_KEY=your_liveblocks_secret_key # Google Gemini AI NEXT_PUBLIC_GEMINI_API_KEY=your_gemini_api_key # MailerSend MAILERSEND_API_KEY=your_mailersend_api_key # Sentry (Optional) SENTRY_DSN=your_sentry_dsn
-
Run the development server
npm run dev
-
Open your browser
Navigate to http://localhost:3000 to see FlowDocs in action!
- Sign up or sign in to your account
- Click the "Add Document" button on your dashboard
- Start writing with the rich text editor
- Your changes are automatically saved
- Click the "Share" button in any document
- Enter collaborator email addresses
- Set their permission level (viewer or editor)
- Collaborators will receive an email invitation
- Click the AI assistant icon in the editor
- Ask questions or request writing help
- Insert AI-generated content directly into your document
- Editors: Can modify document content and manage sharing
- Viewers: Can read documents and add comments
- Owners: Have full control over the document
We welcome contributions from the community! Here's how you can help make FlowDocs better:
- 🐛 Bug Reports: Found a bug? Open an issue
- 💡 Feature Requests: Have an idea? Request a feature
- 📝 Documentation: Help improve our docs
- 🔧 Code Contributions: Submit pull requests
- Fork the repository
- Clone your fork locally
- Create a new branch for your feature
- Make your changes
- Test your changes thoroughly
- Submit a pull request
- Follow the existing code style and conventions
- Write clear, descriptive commit messages
- Add tests for new features
- Update documentation as needed
- Ensure all tests pass before submitting
For detailed contribution guidelines, see CONTRIBUTING.md.
flowdocs/
├── app/ # Next.js App Router pages
│ ├── (auth)/ # Authentication routes
│ ├── (root)/ # Main application routes
│ └── api/ # API endpoints
├── components/ # React components
│ ├── editor/ # Editor-specific components
│ ├── ui/ # Reusable UI components
│ └── hooks/ # Custom React hooks
├── lib/ # Utility libraries
│ └── actions/ # Server actions
├── public/ # Static assets
│ └── assets/ # Images and icons
├── styles/ # Global styles and themes
├── types/ # TypeScript type definitions
└── config files # Configuration files
# Run all tests
npm test
# Run tests in watch mode
npm run test:watch
# Run tests with coverage
npm run test:coverage- Unit Tests: Component and utility function testing
- Integration Tests: API and user flow testing
- E2E Tests: Complete user journey testing
- Push your code to GitHub
- Connect your repository to Vercel
- Add your environment variables
- Deploy with automatic CI/CD
# Build the application
npm run build
# Start production server
npm start- Mobile App: Native iOS and Android applications
- Advanced AI Features: Document summarization, translation
- Templates: Pre-built document templates
- Version History: Document revision tracking
- Advanced Permissions: Team and organization management
- Integrations: Google Drive, Dropbox, Notion
- Offline Support: Work without internet connection
- Advanced Export: PDF, Word, Markdown export options
- Plugin System: Extensible architecture for third-party plugins
- Advanced Analytics: Document engagement metrics
- Multi-language Support: Internationalization
- Enterprise Features: SSO, advanced security, compliance
This project is licensed under the MIT License - see the LICENSE file for details.
MIT License
Copyright (c) 2025 FlowDocs Contributors
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.
Special thanks to:
- Liveblocks - For providing excellent real-time collaboration infrastructure
- Clerk - For seamless authentication solutions
- Lexical - For the powerful and extensible editor framework
- Vercel - For hosting and deployment platform
- Next.js Team - For the amazing React framework
- All Contributors - For making FlowDocs better every day
- 📖 Documentation: Check our docs for detailed guides
- 💬 Discussions: Join our GitHub Discussions
- 🐛 Issues: Report bugs via GitHub Issues
- 📧 Email: Reach out at support@flowdocs.com
- 🌟 Star this repository if you find it helpful
Made with ❤️ by the FlowDocs team