https://github.com/utdevnp/mailyon
A professional, headerless email template builder built with React, TypeScript, and modern web technologies. Create beautiful email templates without the generic header - perfect for seamless integration into your applications.
https://github.com/utdevnp/mailyon
easy-email email-builder email-marketing email-sender email-template email-template-builder email-template-generator mass-mailing
Last synced: 3 months ago
JSON representation
A professional, headerless email template builder built with React, TypeScript, and modern web technologies. Create beautiful email templates without the generic header - perfect for seamless integration into your applications.
- Host: GitHub
- URL: https://github.com/utdevnp/mailyon
- Owner: utdevnp
- Created: 2025-08-29T19:09:15.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2025-09-19T16:43:46.000Z (7 months ago)
- Last Synced: 2025-10-21T21:35:28.787Z (6 months ago)
- Topics: easy-email, email-builder, email-marketing, email-sender, email-template, email-template-builder, email-template-generator, mass-mailing
- Language: TypeScript
- Homepage: https://utdevnp.github.io/mailyon/
- Size: 74.2 MB
- Stars: 1
- Watchers: 1
- Forks: 2
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🎯 Mailyon - Email Template Builder
A professional, headerless email template builder built with React, TypeScript, and modern web technologies. Create beautiful email templates without the generic header - perfect for seamless integration into your applications.
## ✨ Features
- **Headerless Design** - Seamless integration into your app
- **8 Pre-built Components** - All fully functional and customizable
- **Custom React Hooks** - Easy access to all functionality
- **Real-time Preview** - See changes as you build
- **Export Options** - HTML, JSON, and MJML formats
- **Template Management** - Save, load, and validate templates
- **Cross-client Compatibility** - Works with all major email clients
## 🚀 Quick Start
### Installation
```bash
npm install mailyon
```
### Basic Usage
```tsx
import { EmailTemplateBuilder } from 'mailyon';
function MyApp() {
return (
My Email App
);
}
```
## Get Started Right Now
> **[Try the Live Demo](https://utdevnp.github.io/mailyon/)** - See it in action!
> **[Read the Full Documentation](https://github.com/utdevnp/mailyon/wiki)** - Everything you need to know
## Quick Links
> **[Live Demo](https://utdevnp.github.io/mailyon/)** - Try it out now!
> **[Documentation](https://github.com/utdevnp/mailyon/wiki)** - Complete guide & examples
- **[GitHub Repository](https://github.com/utdevnp/mailyon)** - Source code
- **[NPM Package](https://www.npmjs.com/package/mailyon)** - Install
## 🧩 Available Components
| Component | Type | Description |
|-----------|------|-------------|
| **Header** | `header` | Company branding and navigation |
| **Text** | `text` | Rich text content with formatting |
| **Image** | `image` | Responsive images with alignment |
| **Button** | `button` | Call-to-action buttons |
| **Divider** | `divider` | Horizontal lines and separators |
| **Footer** | `footer` | Company info and social links |
| **Spacer** | `spacer` | Vertical spacing elements |
| **Social Media** | `socialMedia` | Social platform icons and links |
**Note**: These are pre-built, fully functional components. Custom component types are not currently supported.
## 🪝 Custom React Hooks
### useEmailTemplateBuilder
Main hook for template building functionality:
```tsx
const { template, addComponent, updateComponent, deleteComponent } = useEmailTemplateBuilder();
```
### useEmailExport
Export templates in various formats:
```tsx
const { exportAsHTML, exportAsJSON, exportAsMJML } = useEmailExport();
```
### useEmailTemplateManager
Manage template loading, saving, and validation:
```tsx
const { loadTemplateFromJSON, createNewTemplate, validateTemplate } = useEmailTemplateManager();
```
## 📦 Package Exports
```tsx
// Main component
import { EmailTemplateBuilder } from 'mailyon';
// Custom hooks
import { useEmailTemplateBuilder, useEmailExport, useEmailTemplateManager } from 'mailyon';
// Utility functions
import { exportEmailTemplate, generateMJML, convertMJMLToHTML } from 'mailyon';
```
## 🔧 Requirements
- **React** 16.8+ (for hooks support)
- **Node.js** 16+
- **Tailwind CSS** (for styling)
## 📱 Browser Support
- Chrome 90+
- Firefox 88+
- Safari 14+
- Edge 90+
## 🤝 Contributing
1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Submit a pull request
## 📄 License
MIT License - see [LICENSE](https://github.com/utdevnp/mailyon/blob/main/LICENSE) file for details.
## 🆘 Support
- **Issues**: [GitHub Issues](https://github.com/utdevnp/mailyon/issues)
- **Documentation**: [Wiki](https://github.com/utdevnp/mailyon/wiki)
- **Live Demo**: [Try it out](https://utdevnp.github.io/mailyon/)
---
**Built with ❤️ using React, TypeScript, and Tailwind CSS**
**Mailyon** - Professional email templates without the generic header!