Passing Data Between Frontend and Backend | Node.js

[@Smoljames]

Cheers for watching 💛 Get hired faster with a better resume @ www.hyr.sh

[@axelkleven43]

Finally, after weeks of trying to find the answer to a simple F***ing question! Thank you my good sir!

[@davidbaldwin1722]

Have just come across this James. I want to repeat comments already made. I have been trying to understand and get these type of requests working for ages. years. In one excellent, concise and clearly presented tutorial you have presented a basic example that not only works but can be followed easily. Definitely keep up the amazing work. Your teaching method is perfect. Best regards, from Adelaide Australia.

[@erice.3892]

i just wanted to let you know this was the most straight-forward video on this topic when i was learning how to code. thanks for making it. cheers mate.

[@Smoljames]

Glad you found it useful and thanks for the comment :)

[@boo5274]

Honestly the best express video out there. Thanks heaps

[@Smoljames]

cheers bro - thanks for the comment :)

[@brucedordway]

Thanks for the video. This helped clear up some of my confusion with client server communications.

[@turnerwhite8939]

This video saved me on a final project haha. I went from having no clue to being able to build a working website thanks so much! I spent hours watching videos but it only clicked after watching yours. Great explanations and tutorial

[@Smoljames]

Glad it helped my friend :)

[@tryhardnoob1140]

Great vid. To the point without extra fluff. I'm a c#/python dev trying to learn fullstack. Already took javascript and node/express courses. I got a bit stuck when trying to put it all together, and this is exactly what I needed.

[@feastorfeed8541]

Legend. You've taught me a lot with such a short video. Thank you.

[@Smoljames]

Glad you liked it!

[@ianmorris1045]

Great video! Will definitely come back to your channel for concise explanations on whatever topics I need to

[@michaelkomisarenko6426]

Thanks for this short and very informative video. It opened my eyes.

[@Smoljames]

Glad you enjoyed it!

[@АлександрАндреевич-в3э]

A few days I looke anwered and you show me them. Thanks so much!

[@sibbirshahriyar9742]

Really well explained I just found a gold mine of resources for learning webDev

[@Smoljames]

Hope you enjoy them :)

[@kyleclinton4642]

Finally, been trying find a channel that explained something like this, thanks so much man.

[@ronitkumar19]

Thanks A lot you saved me. Was having difficulty in this topic. LOVED IT.

[@Smoljames]

Happy to be of service :)

[@farahabdulahi474]

this was pretty bloody fantastic dude, really cemented the basic idea. and always nice to hear the familiar kiwi accent :)

[@Smoljames]

Glad you enjoyed it my friend :)

[@adocarpel7770]

This information is really necessary, I want back-end and front-end with nodejs

[@Tomy-kc8kf]

This is pure gold. Thank you!

[@Smoljames]

Always a pleasure!

[@apitalismo4150]

dude, way to save a life , thanks, at college everybody just acts like you should just know this implicitly

[@Smoljames]

Glad it helped friend

[@i_am_dumb1070]

Thankyou i was looking for this video and after spending several hours found it

[@VernorsDoctor]

Been looking all over for something like this

[@LiveLifeForReal]

Thank you for the great video. Now I finally understood it

[@jendazemlejna]

this video helped me sooooo much, finally i understood how to do this, thank you so much!

[@Smoljames]

Glad the video helped you!

[@kyleclinton4642]

Damn you too good bro, so straight forward.

[@503476]

Thanks a lot for this, really great. I've been looking for a video like this for aaaaaageeessss. the only criticism i have is it would have been great to see all 3 screens at once.

[@Smoljames]

Glad you enjoyed:) and thanks for the feedback

[@matt112fly]

i'm back to rewatch it, as i wanna re sharpen my backend skills ;)

[@Smoljames]

Glad it's of service :)

[@amanbansal3764]

Superb explanation. Very helpful

[@alimedani0296]

Thank you for the explanation, subscribed!

[@456jkl1]

Such a informative video! thank you so much for making this video.

[@Smoljames]

Glad you found it useful!

[@DEBO5]

Amazing tutorial. Very simple and straight to the point.

[@ametuet7518]

ty bro. you helped me. good luck!❤❤

[@facundolandaida582]

Amazing job bro!

[@lucas2436]

Amazing video, thank you.

[@draganbogdan4267]

This is great, thank you very much, it would be really nice if you could make a tutorial as clear as this about how to retrieve data and how to write in a database(Sql) using nodejs. Maybe the whole process frontend->backend->database -->backend -->frontend

[@Smoljames]

I would be happy to do that

[@draganbogdan4267]

@@Smoljames I will stay tuned

[@Nkhugkvivnihy]

nice,point to point

[@abdallahnagy1]

thank you very much for that amazing tutor.

[@GrinLOLZ]

amazing for beginners

[@pabagg]

love ya, literally saved me

[@Martindaoo]

Thank you! This was very helpful. Also, how would you deploy the localhost backend when you host the website?

[@Smoljames]

On aws amplify :P

[@matt112fly]

hello from Reddit - thanks for making this.. im learning new things already 🤓

[@Smoljames]

Haha I'm happy it helps :)

[@wildjorphneydorvilas7758]

I've just realized my waste of time on the other videos. Great Job!!!

[@arnoldwork2450]

Thank you for this great video! But could you pls use a darker background? It's really hard to see e.g. the yellow brackets.

[@Smoljames]

Happy you enjoyed :) and yep I absolutely can. Thanks for the feedback

[@Psammystprime]

Useful indeed

[@shivaniadimulam6796]

Its very helpful...Thank You

[@Smoljames]

More than welcome!

[@espoirTr-g9o]

I didn't get why the "prest text 🐝" was not printed at the first try when the url was at the home page route "/" , but then after changing both of the routes on the srever and on the fron-end script to "/info" it appears ? at the first and second requests the route was the same so why ?

[@vogadok4695]

seu video me salvou!

[@MBrega]

Hi Smoljames, thanks for your video and your ability to be really clear in teaching stuff, I found it truly helpful. As a beginner in javascript programming language itself, I find it a little too advanced for me, even though somehow intuitive. Would you mind recommending which of your video to follow along in order to have an in-depth understanding of all the statements and steps here illustrated? Thank you in advance.

[@Smoljames]

Hello hello - thanks for your comment! I'm glad you found the video useful. If you're looking to continue with nodejs then I would recommend watching my nodejs crash course that I recently uploaded :) hope the helps

[@Becksbradley]

great video !!

[@haihoduc5393]

A little bit weird seeing you coding on a bright background but your tutorial is great.

[@Smoljames]

Haha glad you enjoyed the video and don't worry I've switched to dark themes

[@flaviopalomba6577]

I love you bro, I wasn't able to send a post request from client to server, I was about to kill my self, THANK YOU

[@Smoljames]

haha cheers for the comment :) glad it helped you!

[@chepparmaps]

Please code in dark mode. All in all it was great

[@davidsaavedravazquez5890]

You also saved me! Thanks a lot! But for dynamic pages is it possible to use html without a template engine?

[@Smoljames]

glad it helps :) it absolutely is - there is two methods. One, save to local storage from main page and then access that local storage material of the dynamic route. Two, client side render the content by fetching JSON information from the server, and then populate the document with that using javascript & the DOM.

[@hamzazaidan620]

Does it save the posted value after refreshing or closing the page?

[@MikeTsak]

Awsome video. Although i Copied the Code line by liby I can not POST I get a (Bad Request) error, and an undefined error on my console...

[@Smoljames]

Hey dude - sorry for my slow reply. I made a discord where you can post screenshots of your errors and stuff so feel free to post a bit more of a detailed error log in there and I can take a look. hope that helps :)

[@MikeTsak]

@@Smoljames Hey dude, I have figured it out. Your code works perfectly. It was an environment problem. Still Thanks for taking the Time to reply! 🙌

[@tompryor349]

@@MikeTsak what was your environment problem? I have the same issue!

[@AB-kq9xm]

@@tompryor349 Did you figure it out?

[@tompryor349]

@@AB-kq9xm no, not yet. My friend got it working for me but he rewrote some of it. I was quite happy following and understanding this tutorial, I just couldn’t get it to work

[@kalimac2602]

nice

[@Sushanta-Das]

Sir , is this an example of client side rendering?

[@stoyansarov2647]

Thank you mate. Is there a way to add an api key to the post request on server.js? I don’t want my key to be exposed ?

[@Smoljames]

There absolutely is - I think the npm package called 'dotenv' is what you're looking for :) let me know if that works for you

[@stoyansarov2647]

@@Smoljames Yep. I used dotenv and it worked. Thanks again mate. Brilliant content and explanation.

[@thomasmagner5200]

Hi James, I love the content and it seems to have everything I’ve been looking for. However, when I enter npm run dev, I receive the following error. Error: listen EADDRINUSE: address already in use :::8383

[@Smoljames]

Glad you're enjoying the content :) hard to immediately say what the issue is but if you post a screenshot in the discord server linked in my bio I can take a proper look and give you my thoughts :)

[@thomasmagner5200]

Brilliant, I’ll do that in about an hour. Can’t believe you replied so soon. I also find it strange you only have about 800 subscribers. I thought it would be at least 50k, because the way you teach really is totally spot on

[@Smoljames]

@@thomasmagner5200 haha thanks dude appreciate the compliment - hopefully we'll get there some day

[@thomasmagner5200]

@@Smoljames Well, I will say, the part that really grabbed me was you saying, let me know your challenges, and I'll create a solution, more or less those words (at the end of the video). I've seen loads of people make a big speech about uploading a new video every week. That in my opinion is almost like sahying nothing. It may be reassuring that you'll be around in the future, but it says nothing toward solving a problem someone has right now. You seem happy about helping people with immeidiate challenges, so if my opinion is of any help, that's what I'd be focusing on, rather than saying you release a video every week

[@thomasmagner5200]

Oh here we go, I might have it working. i changed the port number from 8383 to 8386 and I'm not receiving the crash error. So, maybe I'm good to go. I am still a bit new to this, so forgive me for not attempting that earlier :D

[@brian9790]

I dont get it. You have frontend on your server? Isnt it supposed to be separated to commonly have two different devs to develop it? How people gonna merge this? I thought its the whole idea about front and backend dev to seperate it?

[@Smoljames]

This is a more first principles demonstration. Whenever you deploy your frontend code, it ends up being a server system just like the one I have developed here that serves your frontend code. Every website in the world is served up by a server, which is exactly what this is. And the served website is known as the frontend, and the code that serves it is the backend. The code is still separate, as the html file in the public folder handles the javascript and the server.js file handles the server logic. The point of the video is to demonstrate how you can communicate between the frontend using javascript in the browser, to the Express + Node server that we have as the backend and runs on the server. You can apply this concept exactly to a different frontend / backend setup as you like, say if you had a React frontend and a Django backend.

[@pjmclenon]

Hello plz zoom in i cannot understand why so many video online and we can't even see the text too small zoomed out Lisa thank you

[@christophergodfrey9130]

Dude, what is your accent? Do you live on St. Helena?

[@Smoljames]

@@christophergodfrey9130 new Zealand!

[@elnariouss]

W

[@RAJESH_.M]

@Smoljames Hi , I have created a project Classroom availability checker..that will check the availability of the classroom whether it is free or occupied by using data in the database..Explain me how to Retrieve the data from the backend and use it on the javascript of my live website and display the output according to input...

[@RAJESH_.M]

I have published my website classroom availability checker...by using html css and Javascript..In that I have added the classroom data in the frontend (javascript)..Now the problem is I have used my data in javascript, which is visible to everyone..they can see the data by viewing the source code ...it will affect the data privacy..so I decided to create a database in the back-end and retrieve the data to Front-end..for my website...Can you please explain me how it can be solved or Can you please make a video for that

[@Chacha355]

Can't see your screen...like at all...

[@Smoljames]

haha good thing I've changed my editor theme