Since this video, the API has been updated and it should be template_id instead of templateId ! This drove me crazy for a whole day so I hope somebody can see this and save time!
I am super keen to use more of the cloud functions from firebase. Firebase makes it so much easier for a single dev to build out an entire project. No more backend vs front end.
I introduced the Rxfire library and your videos to the react developer in my team. Our agency is currently building an MVP with React and Firebase. I am angular developer, I don't write react (yet) but using your videos, I've been guiding him to build the MVP and it's going great so far!
Thank you so much, this comes at exactly the right time! Just yesterday I actually registered for sendgrid and today I wanted to start programming. This is going to make it a lot easier for me, thank you!
Thanks for covering this topic. I've been learning Web Development for over two years and nobody ever covers email other than making forms to capture user contact data.
I love the work you're doing! Learning a lot from this channel.
5 лет назад+3
You mentioned monorepo just btw, but imho it deserves separate video(s) by itself. How to setup, maintain & automate in such monorepo would be GOLDEN! Do you use some tool, e.g. Nx for it? Love the MVP course idea btw.
Your videos make 100% sense to me. I have subscribed to your channel. Keep making such content. A little suggestion, can you make a video on some of the interview questions asked about firebase, cloud computing?
It looks like for the 'msg' object for sendgrid mails (type MailDataRequired) accepts only camelCase keys, so dynamic_template_data from this video is now dynamicTemplateData. Hope this saves time for someone, :D
🔥🚢 videos are the bomb. Can't wait to binge implement all the fireship videos when my new project is at that stage. Will be getting a pro membership just to support while I'm using your content those few months. Especially the firebase functions course, I'm looking forward to that. I was fumbling my way through my last project.
As always, super interesting video! I actually never thought about "event-driven" emails (other than "welcome" and "reset password" ones - probably because I'm not really interacting with most other emails sent by apps. Definitely going to try this out.🔥
Amazing tutorial as usual.. keep rocking the community.... wish to add to this full stack series using graphql with nestjs and angular universal.. specially the graphql subscription.. i did it before few days .. but am sure u will shake my head when u do it .. u allways bring hidden tips 👨💻👨💻👨💻
What is the difference between the two groups of email providers below: ConvertKit, SendinBlue, Mailchimp, Mailerlite, GetResponse, vs Mailgun, SendGrid, Armazon SES, Postmark, Pepipost, etc.?
Is there a fairly drop-in PAYG alternative for Sendgrid in this example, specifically I think what is missing from PAYG providers is some email templating in the browser...
Thanks for making this video. This works excellent in Firebase. Unfortunately though and as can be seen 4 seconds into this RUclips video, there appears to be an issue with how SendGrid generates information regarding the Sender names, Addresses, the Unsubscribe link, etc (which all are required fields). Has anyone figured out how to solve this?
Hey is anyone in late Dec, 2020 into 21 still somehow using this for free, even though this firebase command "firebase deploy --only functions" @7:40 require a blaze pay-as-you-go" and the only fix is to use Node 8 the engine in package.json "engines": { "node": 8} . (note that 'fix' has it's own issues)
Error: Unauthorized at Request.http [as _callback] (node_modules/@sendgrid/client/src/classes/client.js:124:25) at Request.self.callback (node_modules/request/request.js:185:22) at emitTwo (events.js:126:13) at Request.emit (events.js:214:7) at Request. (node_modules/request/request.js:1161:10) at emitOne (events.js:116:13) at Request.emit (events.js:211:7) at IncomingMessage. (node_modules/request/request.js:1083:12) at Object.onceWrapper (events.js:313:30) at emitNone (events.js:111:20)
The emails to my users keep getting blocked by spam filters. I'm guessing this has something to do with the fact that these emails are coming from send grid. Is there a way to get around this?
It looks like a lot of people are getting it to work. I'm not. Can someone help? I'm using it with a contact form. The function retrieves the email from the contact form just fine but then gives the following error "Error: Forbidden at axios.then.catch.error (node_modules/@sendgrid/client/src/classes/client.js:105:29) at at process._tickDomainCallback (internal/process/next_tick.js:229:7)". Please help.
@@Fireship I agree with you, I have many years using Angular, but now I have to use React in order to follow the standard of the company in which I work and I don't feel comfortable to use React on large projects with many people working on it.
Check if user.displayName is generated before adding in the msg options.. because once the user is created, it takes time to add display name to the user object.
@@jeremiahblessing3891 I see, thank you for the advice! This certainly helped. In the end, I found out that the main error was in the sendgrid/mail itself. They issued a new update recently to fix it.
@@Kaze919 hey! Wow its been quite some time since I had this issue. At the time, apparently there was a bug in which certain version of the api I used were not working and I had go downgrade it temporarily in order to use it. By luck, they released a patch the soon after and my issue was fixed. Code was deployed and the cloud functions worked fine 👍
They have updated the api stucture once again. It now looks like this: const msg = { personalizations: [ { to: [ { email: user.email, } ], dynamic_template_data: { subject: "Hello, World!", name: user.displayname, text: "Welcome to my awesome app!" }, } ], from: { email: "hello@fireship.io", }, template_id: TEMPLATE_ID }; documentaion here: sendgrid.api-docs.io/v3.0/mail-send/v3-mail-send
Hello! Anyone know if there is a way to send emails in a frontend app with firebase functions with the free plan?? You can't do extern api calls from firebase functions on free plan no?
hi there, i got error Error: getaddrinfo EAI_AGAIN api.sendgrid.com:443 at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:67:26) and noticed that it's required a paid tier stackoverflow.com/a/42775841/8163746 could you share which one should i go for? Flame or Blaze (pay as you go) Coz i really just wanna test out the feature
i'm getting this problem pls help Error: HTTP Error: 400, Billing must be enabled for activation of service '[cloudscheduler.googleapis.com]' in project '1002033818121' to proceed.
Fireship where are you from again ? I am a React type of person addicted to TypeScript so I cannot watch all your videos and it’s sad for me because I really like the format of your videos they kind of are my favourite in the topic related to JavaScript will you be able to do more videos related to VSCODE and other Angular agnostic videos your JavaScript series is exactly what I am craving for ... So yeah it’s probably ok because I never win anything so probably because you don’t deliver in Canada 🇨🇦 I would have been the winner this time LoL 😂
Fireship I know you are joking but it’s ok !!! I love your video but yeah I don’t know Angular and I don’t think I will be a firebase user soon but any thing that is NodeJs or TypeScript or Vanilla JavaScript I love it through the bones 🦴
Hey is anyone in late Dec, 2020 into 21 still somehow using this for free, even though this firebase command "firebase deploy --only functions" @7:40 require a blaze pay-as-you-go" and the only fix is to use Node 8 the engine in package.json "engines": { "node": 8} . (note that 'fix' has it's own issues)
Since this video, the API has been updated and it should be template_id instead of templateId ! This drove me crazy for a whole day so I hope somebody can see this and save time!
NodeJs/Cloud function it is corrcet. i.e. `templateId` Doc: github.com/sendgrid/sendgrid-nodejs/blob/master/docs/use-cases/transactional-templates.md
Thank you guys, I had the same issue. Sadly I saw the comment too late :D.
Thank you! Sendgrid and Nodemailer should seriously document their stuff better.
2022 UPDATE !!
It looks like they went back to the `camelCase` version, so now templateId and dynamicTemplateData should be written this way.
@@ioangrasu14 Did anything else change? Struggling to get this code to run haha.
i love how this video shows different types of cloud functions that will be required in most , if not all apps
The MVP series is an amazing idea. Thanks Jeff
Thank you, it's difficult to pull off, but it's fun to see how these features work with different approaches.
I am super keen to use more of the cloud functions from firebase. Firebase makes it so much easier for a single dev to build out an entire project. No more backend vs front end.
Agreed! The benefits of "serverless" are also huge for large/enterprise teams.
I introduced the Rxfire library and your videos to the react developer in my team. Our agency is currently building an MVP with React and Firebase. I am angular developer, I don't write react (yet) but using your videos, I've been guiding him to build the MVP and it's going great so far!
You are just killing it dude! I can't believe you just started with angular/firebase
It's never a boring or lame time with fireship. Thanks man
The MVP series is such a great idea. Excited to see what else you have in store
Thank you so much, this comes at exactly the right time!
Just yesterday I actually registered for sendgrid and today I wanted to start programming.
This is going to make it a lot easier for me, thank you!
Jeff on Fireship is PURE EXCELLENCE!!!!
Things just got more fiery. Awesome tutorial.
Thanks for covering this topic. I've been learning Web Development for over two years and nobody ever covers email other than making forms to capture user contact data.
I love the work you're doing! Learning a lot from this channel.
You mentioned monorepo just btw, but imho it deserves separate video(s) by itself. How to setup, maintain & automate in such monorepo would be GOLDEN! Do you use some tool, e.g. Nx for it? Love the MVP course idea btw.
For this simple demo I just manage the code manually, but recently made an Nx video you might want to watch ruclips.net/video/VUyBY72mwrQ/видео.html
Im a big fan of firebase and this one gives me a new idea. Thanks!
Your videos make 100% sense to me.
I have subscribed to your channel.
Keep making such content.
A little suggestion, can you make a video on some of the interview questions asked about firebase, cloud computing?
love the thought and effort that goes into these videos. nice idea to link to different front end solutions
It looks like for the 'msg' object for sendgrid mails (type MailDataRequired) accepts only camelCase keys, so dynamic_template_data from this video is now dynamicTemplateData. Hope this saves time for someone, :D
It did help! Thank you! :D
Your videos are always good and well documented
🔥🚢 videos are the bomb. Can't wait to binge implement all the fireship videos when my new project is at that stage. Will be getting a pro membership just to support while I'm using your content those few months. Especially the firebase functions course, I'm looking forward to that. I was fumbling my way through my last project.
Your videos are just awesome 😍
Thank you for this video! I have learned so much from this channel!
As always, super interesting video! I actually never thought about "event-driven" emails (other than "welcome" and "reset password" ones - probably because I'm not really interacting with most other emails sent by apps.
Definitely going to try this out.🔥
Incredible video! As always.
Will get a T-Short!
Awesome video. I was about to implement this in an app I'm working on. This helps. Thanks
Amazing tutorial as usual.. keep rocking the community.... wish to add to this full stack series using graphql with nestjs and angular universal.. specially the graphql subscription.. i did it before few days .. but am sure u will shake my head when u do it .. u allways bring hidden tips 👨💻👨💻👨💻
All of those topics are on the list, wish I had more time each day to tackle them :)
Really helpful.. awaiting for svelte js videos..
Great video! As always relevant, engaging and interesting to watch
Cool serverless setup.
What is the difference between the two groups of email providers below:
ConvertKit, SendinBlue, Mailchimp, Mailerlite, GetResponse,
vs
Mailgun, SendGrid, Armazon SES, Postmark, Pepipost, etc.?
Awesome Video
Thank you Bill!
Is there a fairly drop-in PAYG alternative for Sendgrid in this example, specifically I think what is missing from PAYG providers is some email templating in the browser...
Looking forward to more MVP videos..
Hey FIreship, would you use SendGrid in your real-life projects? even something you could sell to clients?
Thanks for making this video. This works excellent in Firebase. Unfortunately though and as can be seen 4 seconds into this RUclips video, there appears to be an issue with how SendGrid generates information regarding the Sender names, Addresses, the Unsubscribe link, etc (which all are required fields). Has anyone figured out how to solve this?
All i want to know is where is the cloud sound. that tune is great for coding. I'm stuck on rotating between low-fi playlists
Awesome video! Keep it up!
Interesting. Great video
Amazing as always
Thanks Jeff!
You've Got Mail! Classic!
Thanks a lot 😀😀😀
I have this exact issue but I have to do it with azure 🤦♂️ another great vid though !
Anyway to use a sendgrid template for the RESET PASSWORD email ?
Did you ever find an answer to this? I'm trying to do the same thing.
Very nice! Thanks...
Love your content 😍
Hey is anyone in late Dec, 2020 into 21 still somehow using this for free, even though this firebase command "firebase deploy --only functions" @7:40 require a blaze pay-as-you-go" and the only fix is to use Node 8 the engine in package.json "engines": { "node": 8} . (note that 'fix' has it's own issues)
Error: Unauthorized
at Request.http [as _callback] (node_modules/@sendgrid/client/src/classes/client.js:124:25)
at Request.self.callback (node_modules/request/request.js:185:22)
at emitTwo (events.js:126:13)
at Request.emit (events.js:214:7)
at Request. (node_modules/request/request.js:1161:10)
at emitOne (events.js:116:13)
at Request.emit (events.js:211:7)
at IncomingMessage. (node_modules/request/request.js:1083:12)
at Object.onceWrapper (events.js:313:30)
at emitNone (events.js:111:20)
I followed this directly, but I'm getting a CORS error :(
Did you find an answer to this? I am having the same issue ...
@@TristanGreenidge Same
Did you find any solution?
Is it possible to send multiple emails within one function?
Wouldn't be mad if you SendGrid that sweet shirt 🔥🤗
Note that if you are a student you can get the github student developer pack wich also gives u a lot of free sendgrid emails
Very nice,
Cool thanks
Nice video
Nice keep it up
The emails to my users keep getting blocked by spam filters. I'm guessing this has something to do with the fact that these emails are coming from send grid. Is there a way to get around this?
why did you cut off the screen and only show 25% of it? i don't understand how you created a template...
thanks!!!!!!!!
What about the initial firebase email after user registry?
I mean the confirmation email when an user ist creating a new login. I think thats not possible with your workaround, right?
Do you do all of your own thumbnails? 💯
It looks like a lot of people are getting it to work. I'm not. Can someone help? I'm using it with a contact form. The function retrieves the email from the contact form just fine but then gives the following error "Error: Forbidden
at axios.then.catch.error (node_modules/@sendgrid/client/src/classes/client.js:105:29)
at
at process._tickDomainCallback (internal/process/next_tick.js:229:7)". Please help.
How to use this for our website cantact form
👨🏼💻 and 🧡 🔥Base
i have a cors error how i can put cors in 4th on pubsub function?
What about sendgrid legacy template?
How do you feel when you write code on Angular and then on React ?
That is a good question and I may do a full video comparison, but I like them both for different reasons.
@@Fireship I agree with you, I have many years using Angular, but now I have to use React in order to follow the standard of the company in which I work and I don't feel comfortable to use React on large projects with many people working on it.
I commented fot the T-shirt XD
Nice
I followed as step by I always get an error in the msg part of the cloud function backend. Any idea how to fix this?
Check if user.displayName is generated before adding in the msg options.. because once the user is created, it takes time to add display name to the user object.
@@jeremiahblessing3891 I see, thank you for the advice! This certainly helped. In the end, I found out that the main error was in the sendgrid/mail itself. They issued a new update recently to fix it.
@@donutrangerr ✌️✌️✌️
@@donutrangerr to confirm you just updated the package and that fixed the issue?
@@Kaze919 hey! Wow its been quite some time since I had this issue. At the time, apparently there was a bug in which certain version of the api I used were not working and I had go downgrade it temporarily in order to use it. By luck, they released a patch the soon after and my issue was fixed. Code was deployed and the cloud functions worked fine 👍
They have updated the api stucture once again. It now looks like this:
const msg = {
personalizations: [
{
to: [
{
email: user.email,
}
],
dynamic_template_data: {
subject: "Hello, World!",
name: user.displayname,
text: "Welcome to my awesome app!"
},
}
],
from: {
email: "hello@fireship.io",
},
template_id: TEMPLATE_ID
};
documentaion here: sendgrid.api-docs.io/v3.0/mail-send/v3-mail-send
Were you able to get this to work? I'm not sure if they updated their api to v3 after your post and I'm failing to get the function to deploy.
then how do I do in react
Any python web development content by any chance?
Why not just use nodemailer here?
nice
Hello! Anyone know if there is a way to send emails in a frontend app with firebase functions with the free plan??
You can't do extern api calls from firebase functions on free plan no?
Forgot about that. You need the Blaze plan, but it is still free up to 125K function calls per month
The only free plan that I found to do external API calls is Netlify functions, which are really just AWS lamda functions
Just a comment for t-shirt
hi there, i got error
Error: getaddrinfo EAI_AGAIN api.sendgrid.com:443
at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:67:26)
and noticed that it's required a paid tier stackoverflow.com/a/42775841/8163746
could you share which one should i go for? Flame or Blaze (pay as you go)
Coz i really just wanna test out the feature
I'm going to make it 100 comments
i'm getting this problem pls help
Error: HTTP Error: 400, Billing must be enabled for activation of service '[cloudscheduler.googleapis.com]' in project '1002033818121' to proceed.
Anyone knows how to add file attachment to the contact form http request?
you didnt handle the thow exception
Can I win a t-shirt if I am from Canada ?
I can ship to every country in the world... except Canada 😉
Fireship where are you from again ? I am a React type of person addicted to TypeScript so I cannot watch all your videos and it’s sad for me because I really like the format of your videos they kind of are my favourite in the topic related to JavaScript will you be able to do more videos related to VSCODE and other Angular agnostic videos your JavaScript series is exactly what I am craving for ... So yeah it’s probably ok because I never win anything so probably because you don’t deliver in Canada 🇨🇦 I would have been the winner this time LoL 😂
@@Luxcium haha, I was kidding about that, I can ship to Canada. Expect a lot more vanilla js content in the near future
Fireship I know you are joking but it’s ok !!! I love your video but yeah I don’t know Angular and I don’t think I will be a firebase user soon but any thing that is NodeJs or TypeScript or Vanilla JavaScript I love it through the bones 🦴
MOREEEE KNOWLEDGEEE
Thanks for the video, may i please something. Which email service can i use for the business emails like hello@fireship.io
If you are using firebase, then I would suggest Google - Gsuite. Otherwise Zoho have a free tier.
spaces either side of a lonely = is stupid dont do it replace = with just =
t-shirt comment)
1st
Switching to Netlify, bye bye firebase !
What makes you say that?
Hey is anyone in late Dec, 2020 into 21 still somehow using this for free, even though this firebase command "firebase deploy --only functions" @7:40 require a blaze pay-as-you-go" and the only fix is to use Node 8 the engine in package.json "engines": { "node": 8} . (note that 'fix' has it's own issues)