The modern collaborative workspace for designers and developers - Seamlessly combine visual canvases and rich-text documents in one powerful platform.
- 🎨 Visual Canvas Editor - Powered by Excalidraw for intuitive diagram creation
- 📝 Rich Text Editor - Built with Plate.js for advanced document editing
- 🔄 Real-time Collaboration - Work together seamlessly
- 📁 Project Management - Organize canvases and documents into projects
- 🌙 Dark Mode - Beautiful themes for day and night
- 💾 Auto-save - Never lose your work with intelligent auto-saving
- 📦 Export/Import - Download your work as ZIP files
- 🔍 Library System - Access official Excalidraw libraries
- 🔒 Authentication - Secure user management with Stack Auth
- 📱 PWA Support - Install as a desktop/mobile app
- Node.js 18+
- npm/pnpm/bun
- A Turso database (or other LibSQL compatible database)
-
Clone the repository
git clone https://github.com/appedme/sketchflow.git cd sketchflow -
Install dependencies
npm install # or bun install -
Set up environment variables
cp .env.example .env.local
Configure the following variables in
.env.local:# Database (Turso) TURSO_DATABASE_URL=your_database_url TURSO_AUTH_TOKEN=your_auth_token # Authentication (Stack Auth) NEXT_PUBLIC_STACK_PROJECT_ID=your_project_id NEXT_PUBLIC_STACK_PUBLISHABLE_CLIENT_KEY=your_key STACK_SECRET_SERVER_KEY=your_secret # Optional: Image APIs PEXELS_API_KEY=your_pexels_api_key IMGBB_API_KEY=your_imgbb_key FREEIMAGE_API_KEY=your_freeimage_key
-
Run database migrations
npm run db:push
-
Start the development server
npm run dev
-
Open in browser Navigate to http://localhost:3000
- Features Documentation
- API Documentation
- Database Schema
- Performance Optimization
- Autosave & Library Features
- Export & Download
- Framework: Next.js 15 (App Router)
- Language: TypeScript
- UI Library: React 19
- Styling: Tailwind CSS 4
- Components: shadcn/ui + Radix UI
- Canvas Editor: Excalidraw
- Rich Text Editor: Plate.js
- State Management: Zustand
- Data Fetching: SWR
- Database: Turso (LibSQL)
- ORM: Drizzle
- Authentication: Stack Auth
- File Storage: ImgBB / FreeImage API
- Image Search: Pexels API
- Platform: Cloudflare Pages (via OpenNext)
- Alternative: Vercel, Netlify
sketchflow/
├── src/
│ ├── app/ # Next.js app router pages
│ ├── components/ # React components
│ │ ├── canvas/ # Canvas-related components
│ │ ├── editor/ # Document editor components
│ │ ├── workspace/ # Workspace UI components
│ │ └── ui/ # shadcn/ui components
│ ├── lib/ # Utilities and configurations
│ │ ├── actions/ # Server actions
│ │ ├── db/ # Database schema and config
│ │ └── stores/ # Zustand stores
│ ├── hooks/ # Custom React hooks
│ └── styles/ # Global styles
├── public/ # Static assets
├── docs/ # Documentation
└── migrations/ # Database migrations
We welcome contributions! Please see our Contributing Guide for details.
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Make your changes
- Run tests and linting (
npm run lint) - Commit your changes (
git commit -m 'Add amazing feature') - Push to your fork (
git push origin feature/amazing-feature) - Open a Pull Request
npm run dev # Start development server
npm run build # Build for production
npm run start # Start production server
npm run lint # Run ESLint
npm run db:push # Push database schema
npm run db:studio # Open Drizzle Studio
npm run db:generate # Generate migrationsSee GitHub Issues for a list of known bugs and feature requests.
This project is licensed under the MIT License - see the LICENSE file for details.
- Excalidraw - Amazing open-source drawing tool
- Plate.js - Powerful rich-text editor framework
- shadcn/ui - Beautiful UI components
- Turso - Fast, edge-hosted database
- Stack Auth - Modern authentication solution
- Website: https://sketchflow.space
- Documentation: https://docs.sketchflow.space
- GitHub: https://github.com/appedme/sketchflow
- Issues: https://github.com/appedme/sketchflow/issues
- Open an issue
- Join our Discord community (coming soon)
- Follow us on Twitter (coming soon)
Made with ❤️ by the SketchFlow team