{"id":24539026,"url":"https://github.com/harshproj/email_template","last_synced_at":"2025-03-16T03:32:08.704Z","repository":{"id":273543878,"uuid":"920054609","full_name":"HarshProj/Email_template","owner":"HarshProj","description":null,"archived":false,"fork":false,"pushed_at":"2025-01-21T15:08:40.000Z","size":9743,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-21T15:25:41.918Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://email-template-dusky.vercel.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/HarshProj.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-01-21T13:40:46.000Z","updated_at":"2025-01-21T15:08:43.000Z","dependencies_parsed_at":"2025-01-21T15:36:01.380Z","dependency_job_id":null,"html_url":"https://github.com/HarshProj/Email_template","commit_stats":null,"previous_names":["harshproj/email_template"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/HarshProj%2FEmail_template","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/HarshProj%2FEmail_template/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/HarshProj%2FEmail_template/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/HarshProj%2FEmail_template/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/HarshProj","download_url":"https://codeload.github.com/HarshProj/Email_template/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243822312,"owners_count":20353496,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-01-22T16:14:47.475Z","updated_at":"2025-03-16T03:32:08.674Z","avatar_url":"https://github.com/HarshProj.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Email Builder Application\n\n## Overview\nThe **Email Builder Application** is a web-based tool that allows users to create, preview, and download customized email templates. The application includes a rich text editor, dynamic placeholder replacement, image upload functionality, and a live preview section.\n\n## Features\n- **Dynamic Fields**: Replace placeholders (e.g., `{{title}}`, `{{content}}`) in email templates with user-provided values.\n- **Rich Text Editor**: Use a WYSIWYG editor (powered by ReactQuill) for editing email content.\n- **Image Upload**: Upload images directly to the server and embed them in email templates.\n- **Live Preview**: Render the customized email template in real time.\n- **Template Download**: Download the final HTML template for external use.\n\n## Installation\n\n### Prerequisites\nEnsure the following are installed on your system:\n- Node.js (v16 or higher)\n- npm or yarn\n\n### Steps\n1. Clone the repository:\n   ```bash\n   git clone https://github.com/your-repo/email-builder.git](https://github.com/HarshProj/Email_template.git\n   ```\n2. Navigate to the project directory:\n   ```bash\n   cd email-builder\n   ```\n3. Install dependencies:\n   ```bash\n   npm install\n   # or\n   yarn install\n   ```\n4. Start the development server:\n   ```bash\n   npm start\n   # or\n   yarn start\n   ```\n\n## API Endpoints\n\n### 1. `GET /api/getEmailLayout`\n- **Description**: Fetches the default email layout template.\n- **Response**:\n  ```json\n  {\n    \"template\": \"\u003chtml\u003e...\u003c/html\u003e\"\n  }\n  ```\n\n### 2. `POST /api/uploadImage`\n- **Description**: Uploads an image and returns its URL.\n- **Request**: Form-data containing the image file.\n- **Response**:\n  ```json\n  {\n    \"imageUrl\": \"https://your-server.com/uploads/image.jpg\"\n  }\n  ```\n\n### 3. `POST /api/renderAndDownloadTemplate`\n- **Description**: Accepts user data, renders the email template, and returns the downloadable HTML file.\n- **Request Body**:\n  ```json\n  {\n    \"title\": \"...\",\n    \"content\": \"...\",\n    \"footer\": \"...\",\n    \"imageUrl\": \"...\"\n  }\n  ```\n- **Response**: A blob representing the HTML file.\n\n## Usage\n\n### Customizing Fields\n1. Enter a title, content, and footer in the respective input fields.\n2. Use the rich text editor to style the email content.\n3. Upload an image if required.\n\n### Previewing the Template\n- The preview section dynamically updates to reflect the entered values.\n\n### Downloading the Template\n- Click the **Download Template** button to download the customized email as an HTML file.\n\n## Dependencies\n- **Frontend**:\n  - React.js\n  - ReactQuill\n  - Axios\n  - Tailwind CSS (with Typography plugin)\n- **Backend**:\n  - Express.js (or any Node.js server for API handling)\n\n## Configuration\n\n### Tailwind CSS\n1. Install the Tailwind Typography plugin:\n   ```bash\n   npm install @tailwindcss/typography\n   ```\n2. Add it to `tailwind.config.js`:\n   ```javascript\n   module.exports = {\n     plugins: [require('@tailwindcss/typography')],\n   };\n   ```\n\n## Project Structure\n```\nemail-builder/\n|-- public/          # Static files\n|-- src/\n|   |-- components/  # React components\n|   |   |-- Editor.js\n|   |-- App.js       # Main application entry\n|-- server.js        # Backend server\n|-- package.json     # Dependencies and scripts\n```\n\n## Screenshots\n1. **Editor Page**:\n   - Input fields for title, content, footer, and image upload.\n2. **Preview Section**:\n   - Live rendering of the email template.\n3. **Download Feature**:\n   - Download the email as an HTML file.\n\n## Contribution\nContributions are welcome! Please follow these steps:\n1. Fork the repository.\n2. Create a new branch:\n   ```bash\n   git checkout -b feature-name\n   ```\n3. Commit your changes and push the branch:\n   ```bash\n   git push origin feature-name\n   ```\n4. Submit a pull request.\n\n## License\nThis project is licensed under the MIT License. See the `LICENSE` file for details.\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fharshproj%2Femail_template","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fharshproj%2Femail_template","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fharshproj%2Femail_template/lists"}