Insertr

Edit-in-place CMS for client websites - Simple integration with class-based content editing

Insertr allows developers to make any website content editable by simply adding a CSS class. Clients can then log in and edit content directly on their website without needing to learn a complex admin interface.

✨ The Vision

<!-- Developer adds this once -->
<script src="https://insertr.example.com/insertr.js"></script>

<!-- Then marks content as editable -->
<div class="insertr" data-content-id="hero">
  <h1>Your Editable Content</h1>
</div>

That's it! Your clients can now edit this content inline.

🎯 Three User Types

1. The Customer (End User)

• Sees a clean, professional website
• No editing interface visible
• Fast loading with minimal overhead

2. The Client (Content Manager)

• Logs in to see the same website with subtle edit buttons
• Clicks edit buttons to modify content inline
• Can edit both simple text and rich markdown content
• Changes are saved immediately

3. The Developer (You)

• Simple integration: just add class="insertr"
• No complex setup or framework dependencies
• Works with any existing website

🚀 Current Status

✅ Frontend Prototype Complete

• Working edit-in-place functionality
• Mock authentication system
• Local persistence
• Multi-page support
• Responsive design

🔄 In Development

• Go backend with REST API
• Authentik OAuth integration
• File-based content storage
• Git version control

🛠️ Quick Start

1. Clone and install:

   git clone <repository-url>
   cd insertr
   npm install
   

2. Start development server:

   npm run dev
   

3. Open http://localhost:3000 and test the demo!

📖 Documentation

• Development Guide - Setup, workflow, and contribution guide
• Demo Instructions - How to test the prototype
• Project Planning - Requirements, research, and roadmap

🏗️ Architecture

Current (Phase 1)

• Frontend: Vanilla JavaScript + Alpine.js
• Storage: localStorage (for prototype)
• Authentication: Mock system
• Deployment: Static files

Planned (Phase 2)

• Backend: Go HTTP server
• Storage: File-based with Git versioning
• Authentication: Authentik OAuth 2.0
• Deployment: Single binary + static files

Future (Phase 3)

• Multi-tenant: Host multiple client sites
• Admin Dashboard: Advanced content management
• CDN Integration: Global content delivery
• Plugin System: Extensible functionality

🎬 Demo Features

Try the prototype to see:

• ✏️ Inline Editing - Click edit buttons to modify content
• 📝 Rich Content - Markdown editing for formatted text
• 👤 Authentication - Login simulation with role switching
• 💾 Persistence - Content saves automatically
• 📱 Responsive - Works on desktop and mobile
• 🔄 Multi-page - Consistent experience across pages

🤝 Contributing

This project is in active development. See DEVELOPMENT.md for:

• Development setup
• Project structure
• Testing guidelines
• Future roadmap

📄 License

MIT License - see LICENSE file for details.

---

Built with ❤️ for small business websites and their developers