https://github.com/belastrittmatter/framely
Framely: The open-source, lightweight, multi-tenant drag-and-drop website editor for modern web applications, powered by Next.js
https://github.com/belastrittmatter/framely
boilerplate clerk drag-and-drop editor full-stack mysql nextjs nocode open-source prisma react shadcn-ui typesafe typescript webeditor website-builder
Last synced: over 1 year ago
JSON representation
Framely: The open-source, lightweight, multi-tenant drag-and-drop website editor for modern web applications, powered by Next.js
- Host: GitHub
- URL: https://github.com/belastrittmatter/framely
- Owner: belastrittmatter
- Created: 2025-02-15T11:24:30.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-15T14:55:03.000Z (over 1 year ago)
- Last Synced: 2025-03-15T15:33:50.902Z (over 1 year ago)
- Topics: boilerplate, clerk, drag-and-drop, editor, full-stack, mysql, nextjs, nocode, open-source, prisma, react, shadcn-ui, typesafe, typescript, webeditor, website-builder
- Language: TypeScript
- Homepage: https://framely.site
- Size: 25.8 MB
- Stars: 28
- Watchers: 3
- Forks: 2
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Framely
The open-source drag-and-drop website builder boilerplate.
Introduction ·
Features ·
Demo ·
Contributing
---
## Introduction
Framely is a full-stack Next.js application offering multi-tenancy, custom domain support, and a flexible drag-and-drop web editor.
🚧 **This project is currently under active development.** Some features are already functional, while most are still being actively built. Contributions and feedback are highly appreciated to shape its final form!
---
## Features (Current & Planned)
### ✅ **Current Features**
- **Authentication:** User authentication powered by Clerk.
- **Dashboard:** Create and view pages.
- **Backend Logic for the Website Builder:** Core backend functionality for handling website structure and data.
- **Drag-and-Drop Website Builder:** Fully customizable, user-friendly interface for creating web pages.
- **Multi-Tenancy:** Full support for subdomains
### 🚀 **Coming Soon...**
- **Generated CSS Preview:** View and customize the generated CSS for every element
- **Optimised NextJS Exports:** Export pages as an optimised NextJS build
- **SEO:** Optimized SEO Ranking for custom pages
- **Dynamic OG Cards:** Automatic Open Graph image generation for user content.
- **Image Uploads:** Drag-and-drop image uploads for adding visual content to web pages.
- **Page Analytics:** Track page performance and user behavior.
- **TailwindCSS Support** Edit a custom page with TailwindCSS attributes
- **Custom Domain Support**
---
## Demo
[**View the live Demo**](https://framely.site)
---
## Tech Stack
This project is built with the following tools and services:
- **Next.js**: React-based framework for building web applications.
- **Tailwind CSS**: Utility-first CSS framework for styling.
- **Shadcn**: UI component library.
- **Prisma & MySQL**: Database ORM and relational database.
- **Clerk Authentication**: Secure and flexible user authentication service.
---
## Resources
- [**Article explaining the core technology**](https://dev.to/belastrittmatter/building-a-nextjs-website-editor-bj3)
Creating Framely would not have been possible without the following resources:
- [**YouTube video by Web Prodigies**](https://www.youtube.com/watch?v=6omuUOZcWL0&t=49054s) – An in-depth tutorial on creating the underlying editor technology.
- [**Vercel's guide to multi-tenancy**](https://vercel.com/guides/nextjs-multi-tenant-application)
## Contributing
We welcome contributions!
1. **Start a Discussion:** Share your ideas, feedback, or questions.
2. **Open an Issue:** Report bugs or suggest improvements.
3. **Submit Pull Requests:** Check out the roadmap or add your own feature enhancements.
---
## License
This project is open-sourced under the MIT License.