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.

Features

• Authentication: User authentication powered by Clerk.
• Dashboard: Create and view sites.
• 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 websites.
• Multi-Tenancy: Full support for subdomains

Demo

View the live Demo

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.
• Umami Analytics: Simple, fast, privacy-focused alternative to Google Analytics.

Resources

• Article explaining the core technology

Creating Framely would not have been possible without the following resources:

• YouTube video by Web Prodigies – An in-depth tutorial on creating the underlying editor technology.
• Vercel's guide to multi-tenancy

Contributing

While I am no longer actively building features, I still 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.