FastAPI and React Full-stack Application: How to send emails using FastAPI-mail library

hello youtube welcome back to my channel so in today's tutorial we're going to go ahead and actually uh begin to uh implement the functionality to send our email to the user so before we can do that we need to install two libraries so the first i'm going to do is install the fast api mail library so you can go to piped or you can just go to google and then search for first api mail click on the first link of to pipe the talk and you can find the instructions for installation i'm going to copy this and then i'm going to go to my terminal so i'm going to go to my terminal and then i'm going to stop this for now i'm going to stop the source i'm going to i'm going to hit ctrl c to stop the development server clear the terminal make sure your virtual environment is activated and i'm going to do ctrl shift and v to paste that whatever i used to paste so just paste that command in there pip install first api a hyphen mail okay so this is going to take some time and install for as the first api mail that you can be used to able to send emails to the front end so the front end will send the suppliers id we'll use the surplus id to get the email address of the subplayer and then we'll send the message that has been written from the front end json okay so now yes we have uh successfully installed that so now you also need one more library called dot v in dot dot a nv so that nav will just allow you to create virtual environments and then you'll be able to manage this virtual environment sorry to create uh environment variables kind of put in a file and then so that you don't upload your content such as such as passwords another confidential information is to get places like github or expose your email or password within your source code so that's a bad idea to expose your emails and your credentials within your source code so i'm going to create a a virtual environment uh environment variables and i'm going to keep the my my confidential details in there so i'm going to paste that in there so this is going to install for that label that will enable us to work with the environment okay that is going to store our environment variables so now that we have those two libraries there let's just go back to our development uh to future studio code so um this first i need to go back to uh first api and then let's see what they say about sending emails so it's what they say about sending emails so we need to import all of this so just copy all of this this is a little bit lengthy to typo so i'm just going to copy that and i'm going to go right here in front of here application uh so i'm going to call this emails email and then i'm going to paste that in there so now that i have that in there i'm going to go ahead and actually copy this functionality as well so for this functionality what i'm simply going to do is i'm going to copy it as it is and then i'm going to paste it in my code and then we'll edit it for our own customizes for our needs so i'm going to come up here and then copy all of this i'm going to copy all of this and then come back to my because my project i'm going to go down here uh and then just before we're registering our total israel i'm going to paste that in there and then i'm going to come and grab the rest of this so copy that and then go back in here and then uh paste that in there okay so make sure i fix that indentation so yeah so now that we have that in there you can see this is where we need to provide in the email the list you can write in a list of recipients so we can send email to more than one client but in this case you're simply going to be sending email to a git only one specific client so now before we proceed with this right we need our email right here we also need our password okay so we need to provide in this uh details so uh to provide in these details i'm just going to uh going to go ahead and actually uh import the vmv and then uh create a virtual environment kind of variables and then we'll use those in there so i'm going to open my my palette here and then i'm going to create a file called dot env okay so if you create the file dot env you can see it has the like the gear icon so this shows that it's a environment variable so in this verb what you need to do is you need to create in here you need to create in here uh the details here your secret details that nobody is could be will be able to have access to so i'm going to create mine in here and i'm going to call it email and password so i'm going to call it email so email this is where you're going to providing your email okay you're providing your email address and then in here you're providing your password so i'm going to keep it password and then in here that's what you're providing your password okay so this should be you can keep it a string or you can just type it out uh something something at gmail.com or something like that and then your password sorry uh irreversible but you get the idea so this would be your email up here so i'm going to copy this it should be an email and then this should be a secret password okay say create password that we're going to call it so this would be your email address up here and then this should be your password okay so i'm just going to pause the video for a short moment and i'm going to go ahead and actually get my email and password and paste it in here and then we come back i don't want you guys to send my email and my password okay so i'm going to go do that and get back to you guys hey guys i'm back so i've just copied and pasted in there my email and my password so now that you have done that let's go ahead and actually import one more thing so i'm just going to take you back to documentation of that vnv and then you can see in the documentation we need to import something so we need to import this so i'm going to go ahead and copy this and i'm going to bring it to my code so i'm going to paste it uh here so i'm going to call it uh uh dot nv and i'm going to paste that in there so and i'm going to create another variable called uh credential credentials and then in here i'm going to call it credentials and then this is going to be a dot dot dot values and then uh let me just check it out so it's going to be uh a dot values here dot values and i'm going to pass in the name of that file in which i want to get my virtual my my little my environment variables so i'm just going to call it uh dot nv so um those values will get minute values and i'm going to pass in the file in which to get these values and simply any i'm going to convert all of this into sorry sorry uh this should be done in another part so i'm going to cut that and then here it should be done here so i'm going to paste it here and i'm going to convert this into a dictionary so i'm going to convert this into a dictionary okay so i don't think we need to actually convert this into a dictionary in the documentation it already returns the dictionary so we don't need to convert that again into a dictionary so we can just remove that extra load okay so going to delete this sorry delete this yeah so that's all we need to do so this will be our credentials so this our credentials will be be storing our our keys so these credentials will be uh we can use this credentials whenever we talk about um whenever we move down here we can use those credentials to get these values in here but before we do that let's not forget one important part so we need to create a git ignore file here something is called dot git ignore so we're going to create this git ignore file and then in the indicate ignore file right we're going to pass in our dot env file so you can see um we need to pass a current documentation it says here uh you probably want to add this to a uh dot envy to get enough also they don't uh push our secret codes or passwords or emails and stuff like that to github so i'm going to paste that in here and also make sure that you can go ahead and actually find the dots get enough of a python project and you can also place the other content in here but don't forget to paste this content because you don't want to push this file to github especially if it's a public repository it has your email and your password so you don't find anybody having access to that so don't forget this part is actually very very important okay like to prevent yourself from being hacked okay so now that we have that now we're going to provide in the email okay so we're going to say email and and the email is the name that you have called that variable in the virtual information i can't open it now because i have in there my password in my email okay but you can just pause the video play back the video and you can see what i'm actually trying to talk about so this will be credential credentials and then the credentials additionally we're going to get the pass called each pass and then you also you know i also need to pass in my get again my email here so i'm going to copy and paste in my email as here as well and then paste it here as well so i'm going to pass in my email there and then um i'm going to be using google server so my email is gmail email so for gmail it's just uh smt smtp so this is the mail server that gmail uses which is smtp.gmail.com and then i'm going to leave everything as it is so that's all i need to change leave the port as it is leave the email as ts and then you're going to use tlc equals to true and ssl is false and then the user credentials it is true jeff write it in here or email or password in another email okay so now that we have that in there let's go ahead and change this part so in here you can you can be the the html that you want to send so you can say uh whatever that you want to sell you want to send the user so let's see what i actually want to send uh you can send anything you want so let's call our business let's imagine that our business our business is called john they're also going to john doe uh business let's look for the business limited okay just to find anything you want is fine so let's make this can be a header so i'm going to make this to be a h5 and this would be a h5 as well so let me h5 tag this actually just normal html so i'm going to do a line break a line break here and then you can also provide in the content so the content is actually going to be provided in by the user okay so i'm just going to explain to you this just in a short moment okay i have actually then skipped some steps so now that you have done that we need to create a class that will enable us to take the user info so i'm going to create a class okay so i'm going to click class and this class is going to be email content and then the email content you're going to use is passing the base module so the base model we need to import the base model so we need to import the base metal from the total uh orm so we need to go from uh we need to import the base model from uh i think we need to import it from turtle is uh oram but i think that's already been imported so let's check to see either it has already been imported from identical note from totally so you can see here from identity import the base model so that they have already imported that for us so we don't need to import it again so it is going to use it here you're going to create a class called email content it is going to inherit from the base model and then you're simply going to have any uh some some fields some variables so attributes rather so message so the message is going to be of type sgr this is going to be a typing in python so if you're not typing sir and then i have a whole tutorial on typing so you can check that out so the subject also going to be of type str so that's all we need to do so we need to create a function called um you need to call it a post with a post function so i'm going to create create a function right up here so just here i'm going to create a function again i need to delete this instantiation of first api again uh and then up here i'm going to call up dot uh this is gonna be a post this is going to be uh email email and then i'm going to get the product id so you want to send an email to a specific uh product right so you won't send an email to a specific person right so we first need to get the [Music] the id of this of the of the good of the supplier of that good and then we can send the the the information there so first of all i'm going to pass in the code so the products in which the product that you want to send uh uh to send an email to so i'm just going to explain to you just in a moment so let me just first type it out so i think and then this will be send underscore email okay you're going to let's call it send email and you're going to call it a product product and this is going to be of of of type in so let's make it more descriptive switch be product underscore id so it's going to be product underscore id so in the product edit you're going to be going to say is a type of hint and then in here going to say uh we're going to get the content and then the content is going to be of type uh uh email so call it uh email content so email uh content so it's going to be of type in your content which is going to be having two attributes message and then the subject of that email so the message is going to be the content and then the subject is going to be the title of the email okay so now that we have that you guys all this code right all this code right i'm just going to indent it from line 126 until before the registration i'm just going to type that i'm going to indent that so all is going to be within our function so uh in here this is going to be this email html is going to be a string so uh in the let's continue typing out you're going to have a paragraph tag and this is going to be just a content so it's going to be i called it content yeah content content uh sorry content that uh this is going to be uh this is gonna be content dot um to content dot subject okay let's continue to subject and then you're going to have another paragraph tag here and then it's going to be a p tag again this is going to be a another uh make sure i close of this tag so yeah it should be p tag i close that p tag off so we have that picture this one any also you need to put in your content and this one is going to be all the message now the message from the email right so let me p let me close off that and then down here i'm going to simply include or something in here i'm just going to say a simple let's make it a h6 tag and i'm going to say uh uh let's just say best regards best regards is something simple and then yeah you can just leave it like that and then we can just close off this start this one p just like that uh down here you can also create a under h6 tag and then it's going to be best regards uh john okay john business limited and then i'm going to close off that hit system yeah so you're going to get um so this actually be i'm just keeping the appear tag and then this should also be a pr line break okay so i want line break so you're going to have the title which you the title with the the title is going to be this one and then the subject and then blind break and then you're going to have to continue the actual image the content of the email and then a line break best regards and then unlimited that's all so that's going to be our email so we're going to get that email i'm going to send it in here so now that you have done the html part the message will actually be uh the message is actually going to be uh something very similar simple so what you're going to do is i'm going to go ahead and actually copy all this copy all this but i'm going to copy it and then i'm going to remove this out so in here i'm going to come up here and then paste what i just copy there so make sure i fix that indentation so the message is going to be the message scheme a message schema which is uh this right here uh they've defined it up they've inputted it up so first api and then the subject so you need to change the subject so you can you can actually provide in the subject here uh instead of providing it in here so you can just move this and then providing the subject should be here so the subject is going to be uh sorry there's no dictionary this is going to be a content dot subject that is going to be the subject okay you can also decide to leave the subject here you can leave it out so let's just let me just i think i should just leave it out from this but it doesn't make sense having the subject try so i'm going to just leave the subject there and then the recipient is going to be supplier emails okay now we didn't get the supplier email now this is what the part that we need to use the product id in order to get the product and then get the the one who supplied that product we're going to use that product id to send the email okay so it's quite simple so going to uh supplier the supplier is going to be await you're going to await this process we're going to go to uh product dot get id equals to the product id so then get the product id so this is going to be the product id and then we're going to get dot uh supplied by so let's just move this on to another line so this is going to be let's call this a product and then you're going to go supply supplier will be equals to a weight and the await is going to be uh going to away these are going to say uh product that's supplied by okay so going to uh so supply but you're going to get the id of the one who supplied the product and then we're now going to get the email of the supplier so we're going to get the say supplier underscore email this is going to be going to be uh this is going to be a supplier this is going to be actually a list we need to that is a list so it's going to be supplier uh email just like that so make sure i fix that so we're going to let's apply emails we're going to get the product from the product you're going to get the products supplied by right the the supplier will supply the product and by using the suppliers we're going to get the the suppliers id and you're going to store that id in here sorry the supplier email and i'm going to show that email in there and the email research you're simply going to pass in here so i'm going to pass in that email and that will send the email to the specific subplayer and then the body is html the sub the subtypes html and then everything remains that it is and then you're simply going to start send a status uh status it is going to come up you're going to copy our response that you've been using uh copy that and then copy bring it here so i'm going to paste that in here so it is going to return a status of okay and then that's that so yeah that's all we need to send our email so let's go ahead and actually go over this one more time so we copy this this one we just got it from the from the official documentation and we have created a a class of our own called uh email content in this in here from the base by identity model and this has a two attributes the message and then the subject so we're going to pass in we have put in our credentials from our environment variables well and then you've put in the email the password and then the email again and then the server is just gmail smtp and pass all that configurations in there and then you have provided a post route because this is going to be sending something out so we're going to call it post route and then it's going to have a product variable so we're going to use the product variable to get the products which in which you're currently dealing with from the product you're going to get the supplied by the one who supplied the product and then you're going to get the id of sorry the email of the one who supplied the product you have simply built our html using f strings and then you're going to simply going to send the message here so we're going to save this the subject is going to be the content which is this one the subject which is going to be this attribute right here and then we are going to be uh sending that email here at this point you're going to send that email they're going to return a status of okay so let's go and actually start my development server and then let's check uh bring this addition and then start my development server ubicon app colon app and then desktop reload so i'm going to start my development server go back to my app try to refresh this and then we should get back the sending of this so we need to pass in a product id and then you'll send the i the email to there so let's add in a new a new uh supplier so i'm going to just get a temporary email so i'm going to get temporary email so my little temp mail i don't want to use my email so i'm going to create a template email get a disposable email so this should bring the email here so let's just wait for it to load and uh we can use this email and then we can get rid of it so this email that you have template email so i'm going to copy that and then go back to my ui i'm actually going to create in a new supplier so uh add supplier i'm going to try this so the subplot uh the email will be what you've just copied the supplier name will be uh jane let's call it janet do so there's the name of the supplier and then the company name will be janet limited whatever and then the phone number can just be any random numbers uh this actually should be numbers right so make sure i get that numbers any random numbers and then we can go and actually make a post request to post this and then we go back at 200 error and then the supplier has been added okay so great so now that you have the server let's go ahead and actually add a product so add a product and then before i do that let me try to get all suppliers try this out so i can get the id of the supplier so i have the supplier here called janet and his id is three so we're going to use that id when adding a product so we're going to hit try this it's going to be of id of 3 and then this is going to be let's call it sugar or sugar there's uh there's some random value so we have sold 10 pieces or whatever and then the unit price the unit price is going to be in prices 30 so then calculate the revenue and then return that to us here yeah so we have that there so now that you have that product let's go ahead and try to send that email to this guy so uh the product id so i'm going to go get all the products and then so they can get the product id of that new product so the product id is actually three so great so i'm going to go back in here uh try this out someone passing three and then the email will be uh hello testing and then the subject is gonna be testing so now that we have that there let's go and actually execute this so let's see uh we have a set of okay so we go back instead of okay so let's see uh okay error to execute fetch on a window patch url email 3 so there was an error uh we got an error back so let's see why first let's check if the email has been sent so let's try to refresh this if the email has been sent but if the email sends supposed to get back a status of 200 so the email has not been sent so let's check in here um okay why didn't that work so email product and then the product id of passed in then execute this so it doesn't work so um field to execute fetch on windows plus so this actually should be a post it says that face failed to execute so let's see where that error is coming from it doesn't even give us a clue where the error is so i don't know so let me just copy this for now then refresh the site and then try to try this again product an id of three and then pass that content in there and then next execute so we don't actually get any error back it just says that undocumented type error fill to fetch on window fail to pass url from http this much okay okay okay okay i know where the array so you see here right i forgot default slash before email so it's supposed to be here the post and then all the url started first last so my part so let's try to try this out again and hopefully it works so let's execute this so let me just try to refresh this again uh try this out pass in an id of three and then paste the contents there and then execute so it's going to take a bit of time and it's going to send that email and then you'll be okay so you've got back the status of a case that shows that email has been sent so if i come to my team here you can see that i have sent that email there from this email address of my so you can see uh this subject is testing uh this is our title here and then hello testing and then best regards that so yeah basically our email is working and the date everything is working fine so yeah that's the email functionality and that's how you can be able to send emails using fast api uh yeah so that's all we need for that functionality so in the next through we're going to go ahead and actually create the course headers and then i'll go into front development so guys thanks for watching if you enjoyed this show so far give this video a thumbs up and subscribe my youtube channels more coated lady so thanks for watching uh keep safe see you in the next one

Channel: Code With Prince

Views: 6,669

Keywords: python, fastapi, api, python tutorial, learn python, python programming, pydantic, tutorial, apprendre fastapi, learn fastapi, tortoise orm, sqlite, react for beginners, REST API, Programming, Building Rest API, database, async, fastapi restapi, fastapi asyncpg, asynchronous restapi in python, python restapi, python fastapi tutorial, fastapi cors, fastapi pydantic, fastAPI-mail, send email with fastapi, fastamp mail, fastapi email

Id: 4IuI8CnmdKY

Length: 26min 8sec (1568 seconds)

Published: Fri May 21 2021