Framely: Open-Source Drag-and-Drop Website Editor for Modern Web Apps

Summary

Framely is an open-source, lightweight, multi-tenant drag-and-drop website editor designed for modern web applications, powered by Next.js. This project offers a robust boilerplate for developers looking to build customizable websites with ease. It features a full-stack Next.js application with multi-tenancy support, custom domain capabilities, and a flexible web editor.

Use at your own risk

OSRepos shares public repositories for knowledge and discovery only. Any installation, execution, configuration, or use of code from these repositories is the user's own responsibility. Always review the repository, source code, dependencies, licenses, and security implications before running or installing anything. OSRepos is not responsible for issues, damages, or losses resulting from third-party repositories.

Introduction

Currently under active development, Framely already includes user authentication powered by Clerk, a dashboard for managing sites, and core backend logic for the website builder. Its tech stack leverages Next.js, Tailwind CSS, Shadcn UI, Prisma with MySQL, Clerk Authentication, and Umami Analytics.

Installation

To get started with Framely, please refer to the official GitHub repository's documentation. The project is designed as a boilerplate, and detailed setup instructions, including environment configuration and dependency installation, can be found there. It is recommended to clone the repository and follow the guidelines provided in the CONTRIBUTING.md or other relevant sections for local development setup.

Examples

Experience Framely firsthand by visiting the live demo: View the live Demo. The repository also features a GIF demonstrating the intuitive drag-and-drop functionality, showcasing how users can easily create and customize website layouts.

Why Use Framely?

Framely stands out as a powerful tool for web development due to its comprehensive feature set and modern architecture.

Key Benefits:

Open-Source and Lightweight: Provides a flexible and community-driven foundation for your projects.
Drag-and-Drop Website Builder: Offers a fully customizable, user-friendly interface for creating websites without extensive coding.
Multi-Tenancy Support: Full support for subdomains, making it ideal for SaaS applications or platforms requiring isolated user environments.
Modern Tech Stack: Built with Next.js, TypeScript, React, Tailwind CSS, and Prisma, ensuring high performance, scalability, and developer experience.
Authentication: Secure user authentication powered by Clerk is integrated out-of-the-box.

Future Enhancements (Coming Soon):
Framely is continuously evolving, with planned features including generated CSS preview, optimized Next.js exports, enhanced SEO capabilities, dynamic OG cards, image uploads, site analytics, Tailwind CSS support, and custom domain support. These additions will further solidify Framely's position as a leading open-source website builder.