https://github.com/zen-labss/fly

Emails writing in React, Vue and Angular.
https://github.com/zen-labss/fly

angular emails nodemailer phpmailer svelte sveltejs typescript vue vue3

Last synced: about 1 month ago
JSON representation

Emails writing in React, Vue and Angular.

• Host: GitHub
• URL: https://github.com/zen-labss/fly
• Owner: zen-labss
• Created: 2022-11-18T19:47:19.000Z (almost 2 years ago)
• Default Branch: main
• Last Pushed: 2023-03-10T18:36:27.000Z (over 1 year ago)
• Last Synced: 2024-05-31T15:24:12.400Z (4 months ago)
• Topics: angular, emails, nodemailer, phpmailer, svelte, sveltejs, typescript, vue, vue3
• Language: TypeScript
• Homepage:
• Size: 1.04 MB
• Stars: 34
• Watchers: 2
• Forks: 3
• Open Issues: 7
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
![Cover Fly](/assets/coverfly.png)

## Why

Writing emails is still difficult as 2010 with HTML and CSS Inline. Well, fly is a framework that generates code for your email in your best framework, write in .vue or .tsx, either way, an HTML build is 100% compatible with your email client.

## Motivation

Well, the motivation is basically beacuse [React emails](react.emails), but React emails has a problem, it is only compatible with react... Well, why not be compatible with Vue, React, Angular? Everyone has to have access.

## Install

With yarn

```

yarn add @fly-email/react -E

```

With npm

```

npm install @fly-email/react -E

```

## Getting started

Add component generate in your email template.

```jsx

import { Text } from "@fly-email/react";

const Email = () => {

  

    Hello, World

  ;

};

```

## Components

- Html ([React](https://github.com/zen-labss/fly/blob/main/packages/lib-react/src/html.tsx), [Vue](https://github.com/zen-labss/fly/blob/main/packages/lib-vue/src/html.vue))

- Button ([React](https://github.com/zen-labss/fly/blob/main/packages/lib-react/src/button.tsx), [Vue](https://github.com/zen-labss/fly/blob/main/packages/lib-vue/src/button.vue))

- Container ([React](https://github.com/zen-labss/fly/blob/main/packages/lib-react/src/container.tsx), [Vue](https://github.com/zen-labss/fly/blob/main/packages/lib-vue/src/container.tsx))

- Img ([React](https://github.com/zen-labss/fly/blob/main/packages/lib-react/src/img.tsx), [Vue](https://github.com/zen-labss/fly/blob/main/packages/lib-vue/src/img.vue))

- Section ([React](https://github.com/zen-labss/fly/blob/main/packages/lib-react/src/section.tsx), [Vue](https://github.com/zen-labss/fly/blob/main/packages/lib-vue/src/section.vue))

- Text ([React](https://github.com/zen-labss/fly/blob/main/packages/lib-react/src/text.tsx), [Vue](https://github.com/zen-labss/fly/blob/main/packages/lib-vue/src/text.vue))

- Hr ([React](https://github.com/zen-labss/fly/blob/main/packages/lib-react/src/hr.tsx), [Vue](https://github.com/zen-labss/fly/blob/main/packages/lib-vue/src/hr.vue))

## Integrations

- [Nodemailer](https://github.com/zen-labss/fly/tree/main/examples/nodemailer)

- [PhpMailer](https://github.com/zen-labss/fly/tree/main/examples/phpmailer)

## Support

Components compatible with your best client email.

|  |  |  |  |

| -------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------- |

| Gmail ✔                                                                                            | Apple Mail ✔                                                                                            | Outlook ✔                                                                                              | Yahoo! Mail ✔                                                                                                 |

## Contributors

- [Giovanni Soares](https://github.com/shumtz)