Step-by-Step Guide: Setting up Email Notifications for Laravel Contact Forms

hello guys welcome to another big system tutorial in this tutorial we're going to be talking about a step-by-step method to get new notifications a laravel application is serving on Port 88 and let's just look at that on our browser okay here we have the home page let's head on to the contact page in the contact page you have the contact form so we have a couple of fields here and we have a button saying send a message first what we want to do is create the email templates we are going into the mails folder we are creating a blade file contact underscore nearly so this blade file is just going to be a normal HTML page here I'm using the vs code we have the shortcuts that can give us a Snippets for those basically uh HTML page okay so we are just editing the title there might not be necessary so we're using the paragraph tag to display some of the information we'll be collecting duplicated multiple times as we'll be collecting different functions like the name in Mirror phone message or subject run okay so now we'll be navigating to our web routes any web brows you want to create the post message okay you want to we actually want to just test out in the view to see how the email templates will look like it's just a bleed file at the end of the project with this so I'm just creating a function uh since I already have some methods that are displaying some views I can duplicate that I cannot jump the method to test View and here I'm going to Target the new template which is in the mail folder okay so this we can have a look at how the email templates will display okay let's correct the spreading of an error of years ago now we have this very simple very basic you just need to get the basics down when we get the buildings now we can always redesign our email templates we are going down to the tactic View we are heading down to the form in the contact page I'm going to be doing some adjustments here this phone already comes with the the web page so we'll just be doing something eating a job schedule a functionality to this page you can see we have defined the action which is supposed to message in defining the name of the variable to be sending via the request body so we have the name we have the email we have the phone then we have the subject then we have the message you must take note to ensure that this button has the attributes type submit let's take three order on necessary elements and active attributes also in the button okay so all checks out here so that message now be heading over to the contact unit for the email that should be subject not title there's a duplicate there I'll be correcting that soon okay so what we want to do right now is going to a terminal and I'll be creating the controller for so we have with the contact controller so we're going to reference that controller in the web routes click notes to use the right method so you can put method we have already declared this route post message in [Music] so yeah um creating that method post underscore message by importing the controller we are getting into the controller and creating a method post underscore message we'll be passing the request body into this okay I'm here we're going to have our logic but for now let's just return all the requests that will be sent to make sure we're on the right path so let's head over to our page contact let's refresh this because of the chains let's begin some data into default so we might experience some errors scenes the form is coming from a template okay so it is ready JavaScript controlling the phone and we can handle that by changing the ID of the form this is just peculiar for this case okay so let's refresh again let's fill in the field okay here we can see it's successfully posted we can see the request variables so we know we're on the right track we can complement line 13 or take it out then we could do a little bit of form validation here to make sure the variables um collected carry valid data so for just for this example we are just validating the name we can add other validations or propose this example will just move forward now we want to create the mail class we use the command PHP Artisan Meek Mill what we are going to be creating the new class contact form mail that has been successfully created slowdina method will declare a variable which will be an array and hold these request variables and send them to the mail class mind you you should already have your SMTP settings on ground and computed in the dot EnV file so these are the variables I'll be sending to the email templates holding down my ALT key I can double select create the request variable pointed to the unique and request names so now I have everything packaged as data I want to head over to my contact form meal class I want to do an adjustment on the construct I'll be passing in data you can just in the view also so we see we have a meals folder we have the contact underscore mailblade just works like returning a normal view you'll be passing some data but this time around we are passing this data to email template so right now I'm calling the email facade this will actually send the email we will be declaring the admins email here but for the purpose of this example we'll be using the Gmail so we can receive that email and display that so we should be calling the middle class to as you can see on line 30 then we have send method we are declaring a new instance of the contact form View and we are passing data we make sure we import the important classes like the meal facade the contact mail has already been reported okay and that's that's so for the return I'm going to be adjusting the return what we want to happen here is to return back to the contact page with a session message okay here we are just confirming our SMTP settings as we can see my password has been blowed out okay let's head back to the contacts meal class within the Constructor will be passing data declaring a variable to save this so there is a there's an extension on my vs code that's why we have that coming on line 23 but everything works fine so we'll be passing the data array with saving it in another variable called Data but here we can now Define the subject the subject for the meal if we don't do this it will automatically take the name of the middle class Regional case is contract form new and we don't want to see that so we are declaring a new subject for the email so which we have here new contact inquiry we could also do from for this example we could forget about that from we'll Define the email is coming from and also a title and for the purpose of this example we can just stop there let's head over to the contact underscore mail template we have created here we want to display the data we have received from the middle class so we must take note of our variable names so we don't mix them up we have recorded braces error on line 12. that has been fixed excuse me so we can take out line 15 that was a duplicates okay here we can pass in subjects you can pass in message okay we are just in the email to our Gmail so we can just go browse and check the message they're going to be adjusting line 35 to return back to the page with the session message a little mix up there in 935 or fixing that so which is the method we need which comes passes two parameters the variable and this session variable and this session variable data so we Define a message there thanks for reaching out your message has been sent successfully thank you so we'll be heading to the contact blade to display this challenge are we going to wrap this within an if statement [Music] you can do this this just below the Sending message text as we can see so we'll just be put in this session message below this will be using the normal bootstrap alert components foreign 124 within an if statement it will break on an arrow because the session message will not always so we have an if statement we'll be calling the session facade so the if statements will be checking if there is a message that's what we have has MSG that's the message they will be getting that message to display okay all sets now let's go back to our page refresh this and test it out open our Gmail on the side let's fill in the form even though we are repeating the same okay let's just do some adjustments there uh then let's just give it a title please don't forget to like And subscribe and share this video if it was helpful okay so message has been sent let's look quickly look at session message here's a session message actually displayed successfully let's head on to our mails here we have the new contact View thank you if you watched to this point if this video was full like that you hit a like comment subscribe to our Channel if you have not and share this for your friends who you know benefit from this thank you very much for watching thank you

Channel: vicSystems

Views: 1,820

Keywords:

Id: JbxQ4UxvjrQ

Length: 20min 17sec (1217 seconds)

Published: Wed Jun 21 2023