Upload and Store Images in MySQL using Node.Js, Express, Express-FileUpload & Express-Handlebars

what is going on everybody my name is radi and you're watching my channel roddy the brand today i'm going to explore the express file upload npm package and then we're going to build a simple user profile by combining the express file upload the express handlebars and mysql the video took a little bit longer than i expected but if you're here for a specific part then the video will be timestamped and now let me quickly show you a quick demo of what we'll be building and hopefully you'll be able to take some of that code and plug in into your own project so first of all we're going to build the upload form and in the second part of this tutorial we're going to create this custom part if i was to grab a new profile photo so choose file and then let's select my logo for example open and submit you will see that the page refreshed and then it uploaded my profile photo which is now stored in the database so if i refresh you'll see that the data is actually retained i would appreciate it if you subscribe like the video and if you have any questions as always please comment below and now let's jump on the computer and get started welcome everybody and let's get started as always we're gonna start from zero let's create a new folder inside here i'm going to initialize a new project on windows i can do left shift right click open powershell window here if you're mac or linux you might just have to cd to your project folder once you're here let's initialize a new project by doing npm you need let's just give a package name of something like node.js user profile this should be good and let's just keep pressing enter until we finish the setup this has now created a package.json file for us and we can start installing the dependencies that we need for this project now let's start one by one so we can do npm install and the first one that i want to install is express so we can create an express server so express then we need the express file upload we need the express handlebars which will be our templating engine so express dash handlebars and last but not least we need mysql in order to connect to a mysql database and do some basic queries let's press enter and this should take a second now that we're done with this we might as well install nodemon so every time we make some changes on our project normal we will reset the server reference so let's do npm npm install dash dark dash dev and we're going to do node 1 let's press enter and wait for this to finish now that we're done with this we can open our project by doing code dot if you're using another code editor that's absolutely fine just go to file open your project and continue from here as you can see in our package.json we have our dependencies as always and we have our development dependencies here so i want to make sure that my project starts with normal and to do this let's create a new line under script so comma start columns and then we want to start with normal but the file that we want to start is going to be called app.js and of course we need to create that file next so let's save this and create app.js so new file app.js and we can start by creating an express server so let me close the package.json and save all right to create an express server it's fairly easy i've done a couple of tutorials on this already so i'm gonna go ahead and beast this super quickly we need to require express construct express equals require and then we're requiring express the next thing that we can do is set a const for or app which will be equals express then we need a port number so let's do consport equals 5000 or if you wish to publish your project you might have to do process.environment.port or 5000. of course in this example we're just going to be using 5000 and we now need to tell express just to listen on this port so we can do up dot listen we can pass the port number support then comma add then this will be an arrow function like so and we can do log console.log we can console.log something like listening on what and then we can pass the port number like so right this is all good if we then go back to powershell and we do npm start hopefully you should see the green line here saying starting node app.js and listening on port 5000. this is so good it means that our server is running and now if i go to the browser and i do localhost with the port number of 5000 you will see that we're getting cannot get and that's all good this is because we don't have any route yet and we haven't included the view engine either so let's go back and do some of that work now let's start by including the express handlebars and set that up so to do this we can do const for short we can do express p h b s and then we can require express handlebars like so and if you watch some of my other videos you'll probably know that as the food express handlebars dot hana bars extension which is quite long so we definitely want to change that but we also need to tell or app to use express handlebars as a view engine so let's do that in here we can say template in engine and then inside here we can do app dot engine pass hps and then we can do a exp might as well copy this from here and inside here is where you can pass some options and the only option i want to pass is the extension name i want to change this to something shorter so to do this we can do extension name and then this will be dot hbs short 400 bus let's close this and then let's set our view engine so app.set and then view engine comma and the view engine is hbs like so all right this is all good we have our templating engine set but we also need to set up but as a default the express handlebars uses a views folder and a layouts folder for the layout so we're gonna have to create all that before we do a router let's create a new folder called views and inside this folder we're going to have to create another one called layouts and as a default the express handlebars uses a main dot hbs layout so this is going to be our main html layout that we can reuse on many other pages but today we're only going to have one page anyway so i'll show you how it works anyway so if we do html5 in here and save this inside here is where we want to actually render all pages so for example i will be adding a home page so let's add a new page called index.h dot hbs this needs to be inside views so this is going to be a home page so if we do h1 hello and inside main dot hbs this is where we want to render our index page so what we can do is with free curly brackets we can just put body and this should work i will show you how this works in a second uh save this as well and let's go back to app.js and let's create our first router the router that i want to create will be app.get because if we want to when we visit the page we want to be able to render something so this i'm leaving this empty because we only gonna have one page and this is going to be your homepage and then we have request and response as an arrow function like so and inside here we can say res dot render and the page that we want to render which in this case is the home page and that's index we don't have to specify the extension here so let's save this and let's see what happens if we go to or terminal we will see you will see that i'm not getting any errors which is a good sign and then if you go back to your browser and refresh you'll see that we're getting hello if i do control new you will see that we're getting the html from our main handlebars file and then inside here we're rendering the home page which is good so let's zoom out a little bit and continue so first of all for the people that just want to create the upload form let's do that and then later on we're going to create a nice looking card and we're going to hook everything up to a mysql database and everything will be timestamped below anyways so let's start by including the express file upload to do this we can do const and then that will be file upload equals require and then inside here we require express or upload like so to use the express file file upload and to actually use the default option all we have to do is let's do default option all we have to do here is say app.use and then do file upload like so now inside here is where you can pass all sorts of settings like so so you'd normally list your settings in here and you can pass you can change the quality of the image you can set up a temporary folder and there is a lot of options so explore the documentation and obviously see what you need for your project but i'm going to keep it super simple for now and remove all this and this is basically the basic usage and now i'm thinking let's start by doing the html form first and then we can create the logic inside here after so insight or index.hbs is where our phone will be so let's remove everything and let's create a brand new form in here so we can deform press enter and the action of the form will be which means basically we want to post on our home page and as a add the method will be post equals post we also need an encoded type which basically is an attribute that specifies how the form data should be encoded on submit so to do this we can do an enc and then type equals and then we can do multi-part slash form data like so and now we can focus on all inputs before we do this let's tie to this something like upload profile photo and then let's start by creating the input so the first input will be actually a type of file because we want to include a file and this will have the name of let's keep it simple and say sample file and this will accept only images for now but of course you can remove this and it would accept any any files so i'm just gonna say image to make it easy slash and this means all types of images like png jpeg gifs and so on or gifs let's close this and then let's create another input at this time this input will be the type of submit and this will basically play the row of a button so the name for this we don't need we don't need we don't need an id either but i'm just going to give it a class for later on which will be btn and then btn primary that would do let's tidy your form up like so let's go to the top save this and let's have a look at how our form looks like we're going to keep it simple for now just so i can show you how to upload a file but once we are done with this and if you want to have a look at the rest of the stuff i'm going to style everything a little bit and then hook it up mysql database so let's do the logic for the form i'm going to zoom in so you can see a little bit more so first of all we obviously need a folder where we can upload those files and i'm going to keep it simple and just create an upload folder inside here like so and then let's go back to app.js and start writing or functionality because we're posting a form this is fine that we're rendering the home page but the next route will be will be the same page but instead of get we want to post we can keep this as it is because it's the home page then this will be request response and now we can start writing the upload functionality in here and the example that i'm going to give you is actually available on the documentation as well this is where i got it from but of course we i'm going to explain everything in detail we need to create a variable name that will hold the that will hold the file so let's keep everything consistent so in our form here we have it as sample file so what i'm gonna do is i'm gonna do left sample file close and then we're gonna have to do uh upload path one so let's do let upload upload path and close the first thing that we need to do is check the request to see whether we're getting the file and to do this we can do an if statement here and say if the request files or the object dot keys dot case rec dot files dot length is equal sequence equals zero then we want to display that the no file was uploaded so we can return rest.status and then inside here the status will be 400 dot send and inside here we can paste our message which would be no files were uploaded like so so basically what this does is if object is empty no files were uploaded but if there was a file we need to grab that file so i'm going to use the sample file let here so far sample file equals and then we're going to get the file and to do this we can do rack dot files dot rec dot files dot sample file and we can actually console.log this file just so you can see what the object looks like so let's do console.log and then we can do some profile let me remember some of this technically speaking we should be able to post something and console.log some of the file information and we might as well give it a go obviously this might not save the file just yet but we're going to do that next so let's go back refresh and let's grab around the file so i'm going to grab my logo here and submit and if you go back you will see that obviously the page is spinning and this is because we actually didn't render anything or like redirect which is bad but if we go back to the powershell you will see that we're actually getting an object here and you will see that the object has a name data size encoding temp file path and a few different things we're going to need this move function in order to be able to save the file in our uploads folder but as you can see this is how easy it is to actually grab a file and be able to get the data and we just need to save it now let's go back this is going to break obviously but let's go back and do that move function let's say name of the input is name of the input is sample file and let's do use mv function to place file on to place photo on the server okay to use this function what we can do is grab this sample file object so sample file and then we can use the move function mv like so and then we can pass the path which i haven't actually created yet so let's grab the upper path first boom and we can actually paste it in here so upload path will be underscore sorry it will be equals underscore underscore the name which is the main directory name of our project and then we can do plus and then select the folder that we want to upload or file to which is upload slash upload sorry and then slash and then we can save this file with the name and then we can save and then we need to pass a name for the file so i can grab the sample file object and then we can use um we then we can go inside and grab the name by doing dot name like so now that we have all upload path we can actually put it inside here and then we can say function error and then inside here we can do if we have an error then we want to return a status of 500 so return res dot status 500 and then this will be sent and then we can send the error like so that doesn't look very good and it's because that needs to be okay that looks a lot better let's close this let's make some space for the rest of the code and that's pretty much it but the last thing i want to do is if the file gets uploaded i want to either like render a page or i want to display a message so to do this we can just do rest.send and we can just send a message or file upload it like so and close obviously this needs to be tidied up a lot more and i can do right click for my document a little bit okay this would do so if we go to or upload folder as you can see it's now empty but let's see what happens if we try to upload a new file so let's refresh this let's browse a new file let's grab the cat from splash.com and open it and submit i think i broke the server okay let's try again okay file uploaded which is a good sign so if you go back to a folder and in uploads you will see that we have a new phone here and this is the file of the cat and if we upload one more let's grab my logo for example and submit file upload it and if you go back you'll see that my logo is in here which is good okay so now we pretty much have or upload working which is pretty cool all right the next part of this tutorial will be creating the cart on the front page connecting to mysql and obviously saving this uh file upload on the record let's start by creating the card first of all then we're gonna add a little bit of css and then we'll add the mysql if we go back to index.hbs let's create a super simple card that we can display our data in so let's do card and inside this card we're gonna have a couple of things so we're gonna have an image this image is going to have a class of card underscore image that's two in this course by the way and we're gonna have to set up a default image as well in here so we can do slash images slash default default.jpg and have user user profile for now then let's create a title like uh like a name then let's create title four card so this can be wrapped in an h1 and this could be something like ruddy then inside here we can do a class of cards underscore underscore title then let's create another div for the job so this will be card underscore underscore job and inside here i can do web developer then let's add a little bit of a description so for this i'm going to use a paragraph and for the paragraph i'm going to do a class of card i'm just going to score about and i'm going to paste a little of text in here just to make it look a little bit better so let's do toggle wrap and let's format it all right that's looking okay i guess maybe like this at least and then let's create a fake button here for statics so button and then type button and then we can do class of bdn bpn primary view profile all right obviously we're not gonna hook this up we're gonna get some data from the database and the image that's pretty much it all right this is looking good if we save this go back to the browser let's see what we have as you can see i have zoomed in as you can see we're gonna need a little bit of css but if you're not interested at this part feel free to skip it so i'm going to go ahead let's create a public folder inside the public folder i'm going to have images folder and i'm going to have a css folder inside the css folder i'm going to have a main dot scss file and this is where my styles will go so let's watch the scss feel free to use a normal css as well it's not a problem it's just easier with scss and we're gonna have to grab a default image for project so i'm going to do that now here is my default jpeg that i'm going to be using and if we go back now we need to actually hook up the style sheet to our main layout so in views layouts main dot hbs we can do link to stylesheet and this will be linked to main dot css but we also need to specify the folder which is css dash main.css now this won't work because express doesn't know about our public folder um and i want to make the cd and i want to make the path as easy as possible so let's go back to app.js and somewhere around here we can set up a static folder so in fact we can do two of them so let's do static files the first one let's do app.use and the first one is going to be express dot static and then we can have public and then the next one that i want to do is actually to to be able to access the upload folder easily from from html i'm going to do the upload folder as well so upload like so so technically speaking now if i go back to the main dot handlebars this should now work and to test this we can go to main.css and do a little test so background color of aqua or this one here so let's save this refresh and as you can see the color change so i'm going to do a little bit of styling super quickly but as i said feel free to skip this part if you wish to and i'm going to keep this as basic as possible first of all i'm going to include a font from google so let's log that in with import you can include this in your index in your html if you wish i'm just going to import it today and a few things that we need to do is reset the margins so margin and then i'm going to do 0 0 everywhere then we need to set our font family and family to be poppins and then we can do sans da and then we can do comma sans serif like so and we're good and then for the color i'm going to copy and paste a very gray color here which is f4f6f8 and we're done here for the images i'm going to do them kind of responsive so we can do image with hundred percent so basically if the images are too big for the box they'll just scale down and let's create a wrapper if we do a wrapper this will basically help us to center align the boxes so we can do display grid maybe and then we can just do it the lazy way and do place item center i do know that this doesn't work on edge i believe or internet explorer but it works on all other major browsers so i'm going to use it to speed up the process and then let's do a height of 100 vh for now so we will get here if i refresh everything is looking good but we do need to wrap this inside this wrapper so let's grab this go back to main.hps and i'm going to wrap the body so let's do rafa like so and wrap the body nice let's save this and as you can see everything is centered which is fine that's the way i want it and now let's just do a little bit of design on the buttons and the card for the buttons let's keep super simple btn and then this btm will have a border or none to none to remove all the borders the footballers color will be set to you so white then we can have a little bit of padding so maybe like 15 pixels by 32 pixels then we can have the text aligned to the center i want the text decoration to be set to none just in case we add it as a link and then display maybe inline block or you know what uh i'm gonna display this yeah let's see how this works displaying unblock and we'll see how this works we might need to change this and then let's do font size something like 16 pixels then a little bit of margin four pixels two pixels and then the cursor needs to be changed to a pointer and i want to set the width to be always 200 pixels for this button and then the border radius something like three pixels would do and now let's do a colorful button so we can do btn-primary and this will be a background color of blue so i'll be like 0 0 8 6 b b a and this is a very like baby blue color i guess so let's save this refresh and our buttons are looking cool um we have a little bit more let's do the card now should be fairly simple to do so for the card let's create a new class in here card and then inside here i want to center align everything so text align center margin let's reset to zero auto do i need this to center the card maybe i'm not too sure uh the width i'm going to center the width i'm going to do 400 400 pixels we probably don't need this actually let's remove it and then the height we're going to leave us auto so we're not going to specify this let's add a little bit of padding of 20 border radius to make a liquid of 5 pixels i'm going to say that the background color needs to be white and then i'm going to copy and paste a drop shadow that i've prepared now inside this card we're going to have or image the title and the job so let's do that super quickly we can do ampersand underscore underscore image and put image i want to display it as block then margin 0 auto to center align it then let's give it a width of 100 pixels and a height of 100 pixels because we're gonna have to make it a circle so to do this we're gonna do about a radius of fifty percent then overflow hidden do anything probably and then we can do object fit so or fit doesn't get stretched or so basically i want my image to fully fit inside the circle and this will be set to cover and then last but not least i'm going to copy the shadow from the top here and then let's do a little bit of board actually border and the border will be three pixels solid white so this border will stick out because we have a little bit of shadow now let's focus on the title so i'm present in this conscious title and for the title we can do margin zero and actually we're done with this we just need to reset the margin on the h1 i believe and then for the job let's do underscore underscore job and then inside here we can do a color of something like gray so 6 6 e 8 1 9 2. all right i think this is good enough let's how let's have a look at how our page looks like all right i think this is ok so we don't waste any more time on this and now we can focus on creating the database and grabbing the image and then the details in here for the database i will be using xampp just because i already have it installed in here but you can use whatever you like so let's start exam and create a very simple database if you go to localhost phpmyadmin you should be able to get this page the username is important and the password so make sure that you have them available mine is basically username is root and password is password we need to create a new database to do this inside here we can click on new let's give our database a name of something like user profile and then let's click create this will ask us how many fields how many columns would you like and i'm only going to have five fields here so let's do five and create the table to be user so let's click press go and the first one that i always have is id this will be an integer it will be auto increment then we can have a name the name will be varchar 45 45 and that would be fine then we can have maybe or profile image and this could be i don't know this could be a voucher and let's just set it to 100 but of course you can change this to whatever your needs are because there is no one number that fits all then we can do a job title and the job title can be voucher and can be 45 characters and let's just do the description as well description like so and the description let's i don't know let's set it as text which is a quite quite a big number basically but we're not going to have so much text let's save this and as you can see all table of or database of user profile is ready and we have a table of user all of the filter here and we just need to add one record for this example so i'm going to go to insert i'm going to leave the id as the food the name i'm going to set up as ready image leave this empty because we want to update it from the application job title i'm going to put web developer and let's copy some of the description from the page so i'm going to copy this as well and paste it in here all right this is all good we have one record and we can now start by creating by connecting to the database to do this let's go back we'll go to here we'll come back to this later and let's just open up.js and let's start by including mysql so let's do const mysql equals require and then mysql close this but basically we need to create a pool so to do this under maybe like or templating engine here let's make some space so we can see a little bit better and then let's do a connection pull to do this we can do const pull equals mysql dot great pool and then inside here is where we can pass a few options now the first option that i want to pass is the connection limit and i'm going to set this as 10 for now and then we're going to need the host name so this will be for me localhost then i'm going to need the user and the user for me is root i'm going to need the password and for me for this is password i'm going to need the database name and the last thing that we need is the database name so database column and then the user profile is the database that we just created so if i tidy this up somehow maybe like this okay this is looking good just so you can see better we should be good to go here the next thing that we need to do is see whether we can connect to the database and to do this we can do pool dot get connection and then we're gonna have an error here that we can pass an error in here and get the connection connection this will be an arrow function and now inside here we can check for the error by doing if error then throw throw error or do whatever you like so we're not connected not connected but if we don't get an error we can just do console dot log and then we can log connect it right this should be good enough for for us to connect to the database so let's have a look whether this is going to work if i save this let's go to the powershell and as you can see we have no problems we're connected to the database which is good if i make a spelling mistake for example my database name that doesn't exist i put two you will see that we're getting an error now which is saying sql message unknown database user profile too all right let's go back save this and we are good to go we can potentially do a first query to get some data from the database and display some of the information and to do this we can do this on get so inside here we can basically copy this here paste it and continue from here and we need to do is pretty much do a very simple query to do this let's just do so we have the connection so we can do connection dot query and inside here is where we're going to wrap our query so this is a normal masculine query so we can do something like select and i want to select everything from the user table where id is equals one because the record that i have already is one so i'm going to do this manually like so just for this example and then inside here we're going to have an error and we're going to have rows so rows is where we're going to get the data as an object and we can use it we can use handlebars to render in a second so this will be a narrow function sorry this is an arrow function and inside here first of all we might want to release the connection so let's do once done once then release connection and to do this we can do connection dot release and then close and then close if we don't get an error then we want to render the page so i can do the rest.render copy this sorry cut this i'm pasting it here and i want to render the index page of course uh basically we're going to the database grabbing some data and i want to render the index page and i also want to pass the data that we're grabbing from the database by doing comma and then in curly bracket we just pass the rows like so let's tidy this up right click tidy it and it's looking so messy messy than usual i think all right this is much better now and let's save if we go back and if we don't have any errors let's have a look yeah the server crashed earlier and now that it's restarted hopefully we can refresh and as you can see everything is working correctly let's zoom out now we can start populating this data from the database to do this we can go to index.hps and i'm going to make a loop inside the card instead of the outside to do a loop with hana bars we can do curly brackets curly brackets so two curly brackets the hash symbol and then each and then we can pass the object of rows which we're getting from here if you remember from the database and then we can start looping through the data but of course we need to close this so to close it two curly brackets to open two curly braces curly brackets to close and then slash each kind of like html i guess that's why i like handbags it's pretty nice and then we can start by populating some of the data so for example the name here uh let's do curly brackets curly brackets this dot profile underscore now this dot name and for the job would be would be this dot i believe job underscore title and for the description i believe it was just this dot description maybe and save hopefully if this is all working we should be able to get the data from the database so let's refresh as you can see the data is exactly the same but if i put web designer and if i change the name to rd123 you will see that we get ready one two three and one and ready one two three is a web designer and this is also coming from the database which is pretty cool now we need to do the same for the use image but let me swap this to the way it used to be because it looked better all right for the image what we can do is set a default image just in case the user hasn't uploaded one so inside here we can actually write an if statement with ejs and to do this we can do curly brackets curly brackets and then we can do the hash symbol and then if this underscore dot sorry this dot profile image underscore image which is this field here profile underscore image i'll zoom in a little bit so you can see so if this exists we want to grab this image we want to populate the image source with the one from the database and obviously this would come from a folder the folder called uploads this is where our images are going to be uploaded so we can do actually we probably don't need to specify the upload image but we'll see we probably don't need to specify the folder now because i have it as a because i have it set as a static file so let's just do curly bracket curly bracket and inside here we can do this dot profile and it's called image like so and save and then and if this is not true if this image if this doesn't exist then we can do an if statement and for the out statement we can just display a default image so i'm going to grab this and paste it in here and i could have just kept i guess let's do it like this and then i'm going to do slash img which is or images folder in here i'm going to use this image here which is mispo so let's rename this very quickly to default and i'm going to use that so imagedefault.jpg and then of course you can do the alt tags however you like and the last thing that we need to do is of course close the if statement so we can do curly bracket curly bracket if all right let's save this and go back to the page and as you can see we're getting the default image and this is because we don't have anything in the database yet for the next step we're gonna have to actually work with the upload form and update the database here so we can upload profile image and then hopefully the profile image will appear in here so let's have a look at how we can do that looking for us we've already done the hard job so if you go back to app.js and hopefully we should be able to just grab all of this and do another query inside here so where we have res.send i'm thinking of replacing this so let me comment it just in case i'll upload this so people can see it and reuse it and i'm going to paste the database connection here but obviously we need to change the query a little bit so this will be update and let's just remove everything update user set profile underscore image equals question mark and then we can do where id is equals one all right if you don't understand this fully i have done a full tutorial on queries how to do them and why i'm doing the question mark and all that stuff and now we need to do is pass the name of the profile image and to do this we can do another comment here and just pass the data inside here so to do this we can graph the sample name like so and just pass that save this and let's have a look at what we get one issue that we are having here is that we're having we're having to render the page again but instead of rendering what i'm going to do is i'm just going to redirect so what i'm going to do is res redirect and i want to redirect to the to the home page which is just slash and then we're not going to pass any anything in here and of course you can do if there is no error we can redirect but if there is an error we can do an error statement and we can do console.log the error or whatever you like of course so hopefully if i tidy this up a little bit oh my the document let's save this and see what we get so if i go back refresh this let's grab a photo so i'm gonna grab this my logo i'm going to open and submit as you can see this actually submitted updated the data and my logo is now appearing here this is coming from the database if i go to the database and zoom in this is the previous one obviously we need to refresh and you can see that the profile image is now here which is awesome and let me demonstrate it one more time if i do choose file and we select this cat from here open submit we have the cat if i refresh the database you will see that the id the name of the image has changed and also i can remove them from here if you wish just for the example let's delete both of them and re-upload so obviously now if i refresh we're not getting anything and okay um we maybe need to check the object whether the or whether this is empty a little bit better but anyways if we choose a file and upload my logo submit we have the logo which is pretty cool the file is in here and that's brilliant now some of you might be wondering well what about well right what if i want to have a unique image name now there's so many ways that you can do this but if you want to have like for example you could pass a user user id maybe plus something else but basically let me change let me show you how you can change the image name so to do this it's actually fairly simple all you need to do is on this line here all you need to change is this here so what i can do is i can change the name to right rat sorry rad dot jpeg like so save it and look at what happens next so if i refresh if i upload a new image so we upload the cat submit all right the image doesn't show in here but if we go back and have a look at the uploads folder you see that we have an image called write.jpg and this is the cat and the image is actually not shown here and this is because we are still grabbing the actual uh name of the original image so of course you're gonna have to insert the name in here so for example this would have to be in this case rat.jpg save refresh let's upload an image let's upload this one and this will work if that makes sense now if you want a totally unique name what you could do is go to mpm go to npm.js.com and search for uuid and basically you can use this package to generate universally unique ids like the example here and that's pretty much it feel free to explore this but i'm gonna wrap it in here and i'm going to put this back to normal like so but yeah i'm going to put this uh back to normal refresh and that would be everything from this tutorial i hope that you found this useful please consider subscribing to my channel smash the likes and if you have any future suggestions or comments please comment below and i will see you in the next one thank you very much for watching as always my name is ready and you're watching my channel riley the brand [Music] you

Channel: Raddy

Views: 44,453

Keywords: node js, node js tutorial, expressjs mysql, express-handlebars, express-handlebars tutorial, express-fileupload, express-fileupload mysql, javascript, learn nodejs, nodejs profile picture, nodejs upload files, nodejs upload image, nodejs jpg, nodejs server, express server, xampp, raddy, raddythebrand, raddy the brand, nodejs tutorials

Id: hyJiNTFtQic

Length: 52min 45sec (3165 seconds)

Published: Thu Feb 18 2021