61 lines
1.4 KiB
Markdown
61 lines
1.4 KiB
Markdown
# Hotel Email Templates (Resend-ready)
|
|
|
|
A simple React app that helps you preview and export branded transactional emails for your hotel booking system.
|
|
|
|
It generates:
|
|
- `html` (Resend-ready, inline/table-based)
|
|
- `text` (plain-text version)
|
|
- `subject` (based on the selected template + your variables)
|
|
|
|
## Run locally
|
|
|
|
```bash
|
|
npm install
|
|
npm run dev
|
|
```
|
|
|
|
Open the shown local URL.
|
|
|
|
## How to use
|
|
|
|
1. **Brand identity (left panel)**
|
|
- Replace `Logo URL`
|
|
- Set `Primary color` (CTA/button)
|
|
- Set `Secondary color` (borders/headings)
|
|
- Set footer contact details (address/email/phones)
|
|
|
|
2. **Pick a template**
|
|
- `Booked Room`
|
|
- `Point Reward`
|
|
- `Raffle Entered`
|
|
- `Prize Won`
|
|
- `Laundry Service`
|
|
- `Order Rating Request`
|
|
- `Stay Rating Request`
|
|
- Plus: `Booking Cancelled`, `Check-in Reminder`
|
|
|
|
3. **Fill template variables**
|
|
- Each template has its own variable fields (guest name, booking ID, dates, etc.)
|
|
|
|
4. **Preview + export**
|
|
- The app renders the email in the preview pane.
|
|
- Use **Export** to copy/download the **HTML** and **Plain text** plus the **Subject**.
|
|
|
|
## Resend payload example
|
|
|
|
When sending via Resend, include at least one of `html` or `text` (recommended: both).
|
|
|
|
```ts
|
|
await resend.emails.send({
|
|
to: 'guest@example.com',
|
|
subject,
|
|
html,
|
|
text,
|
|
});
|
|
```
|
|
|
|
## Notes
|
|
|
|
- The app uses `@react-email/render` to generate email-safe HTML.
|
|
- Branding is applied via the theme fields you edit in the UI.
|