They Fixed Email?? OMG
Вставка
- Опубліковано 11 вер 2024
- CHECK OUT RESEND FOR EASIER EMAILS resend.com
Seriously so hyped about React Email, Resend and everything this crew's working on.
ALL MY VIDEOS ARE POSTED EARLY ON PATREON / t3dotgg
Everything else (Twitch, Twitter, Discord & my blog): t3.gg/links
S/O Ph4seOne for the awesome edit 🙏
what a cool video!
resend founder here 👋 I'll keep this tab pinned for the next few days, so feel free to drop questions and I'll answer them
Is knowledge of Dracula required to use Resend?
It says "This component was tested using the most popular email clients." but how many more does it work with? For professional use it would have to work for 100% of cases.
Literally just what I needed. Thanks for your work!
Love what you guys are doing! How can a guy like me invest in your startup?
Can I integrate this with Baas like Supabase?
Time to think of project ideas that require sending emails
just send an email you don't need a project around it
So literally any saas app
😭 it's my day job to automate senting mails about server status
And this is not gonna be used in place that uses cobol mainframes
A *ton* of websites use automatic emails for various things. It doesn't have to be a creative project. A user reached out through a contact form? Send an automated email that confirms that the contents of the form were sent and the user will receive a response from the site owner/admin in x days. A user registered to your website? Automatically send a confirmation email. Any e-commerce needs automatic email confirmation of the status of any purchase. The list goes on.
Lol
Cloudflare workers support sending emails OOTB. Which in turn means Vercel supports it too. All you need to do is set your runtime to 'edge'. The vercel-email package makes it super simple.
sending via aws ses works too on nodejs and worker environments. But I prefer your solution now :) looks super cool.
Writing an email is like building a single page site, but you're stuck in the year 2006.
Yeah and if you can't afford to time travel (testing process) just hire a template service dedicated to living in 2006 that tests like it's 2006
I'll have to bring this up at work. We're currently using something or other in php/laravel, making reasonably looking emails is a huge pain. Especially since you can't even test it too well, you have to actually send that email. With this I imagine there's some live preview option. And if not, devs, get on it! I just want npm email:preview that will host something with the dev experience of standard react I can see in the browser. I'd imagine even the email-ready html is fine to display, email clients mess with it but if it works there it'll probably work in a normal browser.
Also, supports tailwind. Huge props. I really hope we use this instead of those forsaken blade templates. Looking at the docs there isn't really a super simple way to render react from php, but I'm sure there's a one-time workaround that just renders out the email into html that can then be sent. They've got a CLI at least so I'm sure it'll work out. I really do not want to see another email blade template.
Well the catch is email markup isn't html/css used by the browser and its render heavily depends on the email provider which renders them (you can imagine how much it gets worse when it has to be actually rendered in the browser). So the previews will have the same problem as when integration tests are used in place of e2e ones: it will look good in a hypothetical synthetic scenario but hit with unexpected bugs in the prod.
It's a general problem with the email tech throughout, not just creating/rendering templates. Such as inability to mock any of email-dependant pipelines. And even if you somehow create a local smtp server, its implementation will most likely miss all the arcane rules required to follow in order for your email domain not get blacklisted instantly by major email providers in prod.
@@ra2enjoyer708 it's parallel to having to setup a suite of browser for cross-browser testing.
At minimum it's grabbing screenshots for visual diffing to spot large show stopping issues. All with a bias of basic configuration; such as what do the emails look like if the email-client disables images,etc. Which is hilariously ironic as tons of problems could be solved by just being able to embed an image for pixel perfect email delivery lol.
Tailwind-library-esque support probably has be very aggressively pruned of features, or have linter/validator to reject rules that cause email incompatibility.
This is awesome. Back a few years ago when I had to create email templates weekly the most friendly framework was MJML, and I use the word friendly very loosely.
I tried rolling with MJML for a while, but it's essentially a non-starter. Maizzle I'd call the most complete framework these days.
Granted that framework requires that you define all your nested tables, it's still leagues better than hacking something together with super outdated MJML dev tools and hoping it doesn't fall apart whenever you try setting a gutter.
What about MJML did you find the least "friendly"?
I watched this video a few days ago and I just wanted to say, Theo, THANK YOU yet again for dropping this lovely gem .. I just finished porting over all of my lame email templates for a personal project to use this and it was a surprisingly pleasant experience.. the dx is amazing and the emails generated are exactly what I need.
I was already thinking of Resend before hitting play. I follow Zeno since the beginning of my career in front-end web development. He's been a big influencer in the Brazilian front-end community for as long as I can remember, and definitely has a solid reputation. No wonder you invested in Resend :)
react email looks amazing, resend supporting PHP, this company knows what's up
I made a video on react email a few weeks ago, such a great library! Was very easy to make great looking email templates.
omg wish I knew about this a month ago lol, used Maizzle which is another neat email building tool that uses tailwind css, but I had to build out the table format manually. Seems it's managed by the components here already
Resend is a great example for a use-case where open source does not work. Why would I ever use their service. They have a 10x markup compared to let's say aws ses. Or 100x to cloudflare email. I like the open source package, but why would I ever use resend..
Sending statistics and dmarc is easy too, what stops me from just creating a competitive project integrating resend?
I graduated coding bootcamp last year, and then my roommate enlisted me to write them an email formatting/automation program to help with their business, and at my level I had no idea what i was getting into. After a couple months of banging my head against the wall this is the most exciting thing (besides maybe LLMs) I've seen since starting to code!!!!!!!!
i found this a few weeks ago and i’ve been so excited, been my little secret but hopefully if more people learn about it then other companies will start supporting it more and i’ll have a competitive edge
THANKS!!! I've been struggling so much with sending email sending, with templates and SMTP clients and all that stuff. And this makes my life so much easier! How a 7 minute video can save me 12 hours of work on any project.
Theo always reaches out to us with THE data.
Email is my Achilles heel. I remember having to setup MX exchanges back in the early aughts - a true pain in the aaaa. These days, we use Mandrill for sending marketing and transactional emails so we don't have to worry about infra and DKIM and all that jazz. This react lib looks interesting. Right now, we build transactional emails using a microservice using handlebars that builds the HTML and plain text versions, then send that to an internal API that sends to Mandrill, OR Ethereal during development so we can inspect what the emails will look like. There's nothing sexy about sending emails, a tech that long since should have been replaced by something more modern, but I digress.
Oh god, it's horrible. Sure, it was cutting-edge at the time. But now there's about 50 years of technical debt piled up. It takes something as simple as "authenticate and upload/download a text file to/from a server" and makes it so complicated that even the world's top developers can't implement the protocols reliably.
I don't know if it's still the case but at one point Outlooks HTML renderer was Microsoft Word.
Looks cool I just hope tailwind is not mandatory. Will give it a try
It’s not! The example in the thumbnail is tailwind free ;)
Exactly what I was looking for😇💯...Great timing!!🔥
awesome! feel free to ping me if you need help
resend is like something ive been waiting for a while, its great to finally be able to do easy email related features with react and have them look good on the first try! i would be interesting in seeing if there is a local mode so I can avoid sending messages but still see them locally
resend is an email sending service, react email is what you probably mean.
I am glad there is collective hatred for Outlook when it comes to emails.
I have to say, the Resend website absolutely slaps. Such classy design.
I shifted to text only transactionals because sending html was a difficult experience. Let's see how good resend is!
I’ve been following Resend for almost a year now. The resend project is super cool and I’ve built several emails via the beta. I reccomend.
AWS SES is $0.10 per 1000 e-mails. It might take a little bit more time for the initial implementation but seems much cheaper on the long run, or am I missing something here…
It's marginally easier to send the email. Marginally.
You are not missing anything here. AWS SES is cheaper however you put it and it has generous free tier.
I'm currently assuming it's for react houses that hope email can be a nail react can hit.
If it can prevent client-incompatible emails then that would be something.
@@TheNewtonThe library seems cool, the purpose of the service is questionable.
I can’t remember who put me onto React Email but I’ve been using it for at least at a couple months and it’s seamless. Truly a great project
I feel this pain deeply, we found MJML is pretty solution for this as well
i am working on a system, that is sending a lot of emails on user action, eg. changing their data and making some action. so we have emails for our customers when the register, add them selfs on a course queue, they get a course slot, them canceling the membership of that course and so on.
react-mail really was a good way in having general header and Foot email-components that we can use on every mail, so that only the main text is changing.
I don't know why but we didn't use the tailwind tag, even though we are using it in our mono repo, I think there was a problem with that.
the only problem we are having is sending emails in loops on the Nodemailer client (it troughs an sql error on sending an email while sending an email) and also our own hosted mail server, can only send 1 mail per sec, and the queue is very fragile...
currently we are awaiting each email send, I was think about moving to was ses with Nodemailer, but made this is da weh
With symfony we have been using a similar library named inky/foundation email.
Used this to generate a bunch of email templates recently worked realy well
So jealous, at my current job we send email through sql stored procedure so not only do I have to do all the formatting with tables I have to do it with sql string operations.
This is insane leap, the amount of pain this saves, so nice.
And so begins Theo's tech VC arc..
ive been using this in production for months. truly a life changer!
React email is a pretty cool library but once you render the html its just as easy to send from sendgrid or postmark. So it doesn't really make sense to send emails from them and you'd probably want to use a more established provider for deliverability. Hopefully they're able to monetize it enough to improve the library though the live rendering feature is rough.
and pricing is ~4x vs amazon's SES $0.10/1k emails.
Even free tier on ASES is like 65k emails.
I’m and old dev. I used to know all of the tricks and would really enjoy making email templates as I could just switch off and listen to a podcast. I can imagine the stress that a inexperienced dev would go through trying to build something without a tool like this. Very useful.
I'm an experienced dev and it still stresses me out
@@t3dotgg I still remember laying stuff out with tables tho! Now get off my lawn you pesky kid !
@@t3dotgg also love your content. Particularly your technical interview vid. It was a great resource to adapt our process for hiring.
@@luke1978 too right the benefit of not just accumulated knowledge but experience that was gained as features/incompatibilities came about.
New devs would have to backtrack to last century to purposefully cut themselves on countless edges only written about in some obscure page that's now non-existent and unarchived.
Nice! Let's fix now the fact that all of our emails inboxes are completely full of garbage. 50k unread emails full of spam and notifications! 😅
Wouldnt it be smarter to use a more established transactional email service for deliverability?
Good to have alternatives to mjml for making templates.
Isn't this really close to what MJML does (the first part I mean)?
I screamed when I saw support for Tailwind. Let's gooooooo 🚀🚀
I absolute love your powerful chaotic good energy!
Haha laravel templates always work for me
Styling emails is easy if you used to do web development before the dinosaurs
Recently felt the pain of trying to get border radius to render properly in outlook, it's insane, the whole thing needs to be burnt to the ground.
You had me at "formatting emails is the hardest thing to do"
Such a good API
sooo they finally got to do it in react as well, guessing every other framework that had this kind of feature doesn't count
I confirm that they actually Fixed Email for developers 🙏🙏 thanks Theo!
Just waiting for the time that things are so abstracted that the common person can do all of the development and the developer is the one creating all of the abstractions
They fixin a lot lately it seems
And how about making a template in sendgrid and send parameters to it from your react app? 🤔
This f*coming amazing
Have you seen Hiber?
They let you render 3d worlds with React :D
Started using them a couple of weeks ago, funny to see a video from you on it!
Yup, I need this.
Also, they need to fix SMTP / email for real though..
Awesome. Now we are just missing a good and stable pdf library for react
Now we just need an affordable way to test emails across different environments, or even better something I can self host
Literally what I wanted this video to be about. Converting designs to code and sending email are solved problems with tons of existing services ready to go. "Tested" is treated as a marketing bullet point with no documentation to back it up.
@@TheNewton Went down this rabbit hole last week, but I'm convinced it is easier to put a man on the moon than it is to consistently create UI that looks the same across all email clients.
How different is resend from sendgrid? Because we use sendgrid our projects and it's also gets the job done just by using their API key.
Thanks for sharing this!
I know mjml + handlebars to get pretty and responsive emails
But if I can use Tailwind with react this is neat ! 👌
Have you tried using react email?
I've tried, but haven't got far with it... unfortunately.
Welp I do have a project that’s going to require the need to send emails. This is definitely a good option!
The free plan is quite generous 😮
Amazons free tier for it's simple email service is even better.
But setup overhead on that is more costly, and this seems ready to go.
Okay, looks promising… before deep diving, does anyone know if it supports sending emails using office 365? (Rather than domain…)
Are your hair bg-yellow-300/20?
underrated reply
Django have been doing email pretty good for years.
It looks super cool. I will definitely give a try.
5:10 sending emails is a destructive action?
But the inbox providers change stuff all the time. What about change management when it comes to compatibility?
we handle that for you
What is the benefit over just sending the rendered HTML via sendgrid?
Super excited to try this out
I would be really interested in seeing a Firebase integration for Resend (possibly through Firebase Extensions) that would be amazing!
This looks great! Been using MJML to create templates and then populating those manually, this looks much simpler and cleaner.
The MJML team refuse to add any useful templating logic and overall have been pretty off-putting in their GitHub issues section imo. This already looks like it works for my use cases so next time i make an email I'll give it a go.
isn't that just a meta problem of having variants of templates.
Or a preprocess to swap in the right MJML parts before send it to their api to get the HTML
Pumped about resend
Now finally we can say bye bye to Thymeleaf
This is a very niche market to target, but good luck to Resend.
That said, have you heard of MJML? Its same thing without the managed part.
Niche is right having a hard time with what it "fix"es or who the market is.
As adding react isn't a fix to me, it's a nail abstraction for a hammer.
The recent resend team
Is there any way to use this in an expo dev client or react native without running into any problems?
pog new theo video
This is really cool, but TBH, I'd prefer a drag and drop tool which would ideally allow the product managers to create emails themselves.
Exactly what I was looking for!
Omg, I had this idea for years and never started working on it. My FOMO kicked in.
let’s work together then 😊
I recently integrated react email in our saas app. Absolutely wonderful. So simple to use and the results are fantastic. Solved so many of our headaches regarding email and we use a lot of email in our service. Can't recommend it enough.
so freaking happy to read this ❤
@zeno_rocha definitely not as happy as you've made me, I assure you 🤣. Never mind that we finally have more or less full control of styles and layout (within the limits of HTML emails), our ability to reuse components, iterate at the speed of light and version control together with our repo (had a separate tool before) has saved us countless hours.
I migrated to React Email in a little over a week (deploying tomorrow). We are talking about 76 templates with a lot of dynamic content.
Had some problems with exporting and setting up a tsconfig but was easy to get around.
I really can't stress enough how much this has helped us. For once building templates is not only easy, it is also fun!
@@pigeonnnn was react being used in-house before react-email integrated? (for the sass app or not)
And did you already have a testing process in place for multiple email clients?
@TheNewton first question: yes! However, we have a separate backend, so that didn't really matter. What we basically do for now is exporting templates made in react-email, so it sort of works as a codegen tool ATM
Regarding testing, we don't test any individual email clients at the moment, just unit test the emails being sent out. We have sort of come to terms with that a whole lot of email client don't want to cooperate and have been more focused about making sure the content is correct and useful
@@pigeonnnn tyvm for the detail, trying to figure out where this service lands without a client testing process: as a react hammer or a startup scalpel.
I had an internship where I hand-designed campaign emails with HTML and I wanted to KMS 😂😂😂
Just what I was looking for :) I'll give it a shot!
Theo I love you! Thank you for the video!
Ohhhhh... I might be able to take down my nodemailer-based email service for this. Will look further into it.
What happened to plain text emails? Why are people perverting something good into something wrong and horrible?
Good plain text? Pick two.
different teams have different demands, not team can afford building plain text emails, they might have requirements from marketing to use HTML for better brand recognition
Most businesses don't consider the problem factors in HTML emails
They just want~need to visually differentiate themselves not realizing the cost pains are self-inflicted.
rather just have plain text emails tbh
Wow email 2 just dropped?
Where is the sveltish thing like this ?
Send plaintext emails ffs.
Now I'm convinced to subscribe on this channel
I spent 1 year as a student writing hand crafted emails. Its the worst type of work ive ever done
Good PHP devs sitting back watching this scratching their beards/chins wondering what is special about this? Been doing this sort of thing for literally decades in PHP??
This video came at exactly the right time ❤ was just about to look for a good email service
perfect timing! let me know if you need help integrating :)
email is html4.0 era plus css
Email HTML/CSS is so fucking hard lol
thank you theo.
My react native brain is excited.