How to build a Contact Form in Node.js and Google Sheets?
Вставка
- Опубліковано 20 лип 2024
- Hello, my friends and fellow developers!
In this video, we cover how you can build a contact form that integrates with Google Sheets and all the details are stored in the sheet once the form is submitted! We will use Node.js, Express and Google Sheets API to make it work.
Let me know in the comments below if you want more Node.js content or something else.
This tutorial is heavily inspired by @Fireship. His video on using Google Sheets as a database helped me build this and many other cool projects.
Links mentioned in the video:
Google Dev Console - console.cloud.google.com/apis...
GitHub Repo - github.com/max-programming/co...
Fireship's video - • Google Sheets… Your Ne...
🔥 Timestamps Start 🔥
00:00 - Intro & Demo
01:23 - Creating the project
02:17 - Installing dependencies
03:32 - package.json changes
03:54 - Set up Google Sheets API
07:08 - Download key file
08:09 - Create and configure the sheet
09:32 - Back-end coding starts
16:17 - Set up sheet client in code
22:15 - Appending test data to sheet
26:49 - Adding user's info to sheet
30:49 - Front-end coding starts
36:24 - Outro
🔥 Timestamps End 🔥
Other Tutorials:
⚛️ React and Material UI Todo App: bit.ly/reactmattodo
🟨 Other JavaScript videos: bit.ly/jstutorials
📘 Visual Studio Code videos: bit.ly/vscodevids
🔋 Build a Battery App in JS: • 🔋 Build a Battery Info...
Connect 🔗 :
Twitter: / maxprogramming1
Facebook: / max-programming-103081...
GitHub: github.com/max-programming/
VS Code Theme used: Default Dark+
Font used: Cascadia Code
Suggest, ask doubts in the comments and share these videos to help!
Thanks for Watching!
#nodejs #javascript #programming
This is what I was looking for!
Thanks!
Hope you understand it well 😀
great. i am not a back end person and I am not either a front end developer, but you video has changed my life :) well done Usman. I hope I can see more videos like this one in the same direction
This worked!, Thanks
works, thank you
Nice video 🔥🔥🔥
Thank you very much 🙂
keep it up :)
Thank you very much 😊
Thanks Brother
Make some videos on Next js 13.
Sure! Thank you 🙂🙂
Amazing Brother, can we retrieve data through excel to nodeJs and then show data using any frontend framework.
Yep. You can make an API with Node and fetch data from Excel there.
Then you can fetch data from the Node API in your frontend framework
@@MaxProgramming it would be great for us if you make a video on this.
Thanks a lot!
@@Abdulazizweb Thank you. I'd love to do that. Thanks for the suggestion
I've not been able to run the server. Localhost:5000 returns a white screen wwith a message that reads 'Cannot GET /'. I swear I've followed you step by step
Hey come over to my discord. Let's fix your problem there. usmans.me/discord
How to deploy the app to Netlify?
You can't deploy a nodejs app to Netlify. You'd have to deploy it to a node server provider like Railway, Render, Fly, Heroku
Or else you can use Netlify serverless functions (that is nodejs code Netlify can run - check the documentation), the code might be a little bit different but it's possible and free as well
Here's a short tutorial on Netlify serverless functions: ua-cam.com/video/NZRZJqChwa8/v-deo.html
@@MaxProgramming Ah, got it! Its straightforward to deploy with Heroku , though due to Google auth library with Node v18 issues, process.env.PRIVATE_KEY should be process.env.PRIVATE_KEY .replace(/\
/g, '
')
Just a small thing. You can skip putting the values in const values, just use the body object.
requestBody: {
values: [[body.name, body.email, body.message]],
Yeah that works too. Thanks for sharing 😄