- 6
- 273 470
James Grimshaw
United Kingdom
Приєднався 6 чер 2014
Web development videos, primarily JavaScript tutorials. I make videos for fun :-)
Control Google Sheets with Node.js / JavaScript (v4 API)
In this tutorial, we use the Google Sheets API v4 with Node.js & Express to completely control Google Sheets (read & write) and at the end create a demo video request application! This API can help you create anything from a totally custom "Google Forms" replica, all the way to using Google Sheets as your database solution! I hope you enjoy and find this tutorial useful!
----------------------------------------------------------
👀 Tutorial Links:
----------------------------------------------------------
GitHub Repository: github.com/jrgrimshaw/google-sheets-node
Google API Console: console.cloud.google.com
----------------------------------------------------------
💻 Commands Used:
----------------------------------------------------------
npm init
npm install express ejs googleapis
npm install -D nodemon
nodemon index.js
----------------------------------------------------------
⏰ Timestamps:
----------------------------------------------------------
0:00 Introduction
0:30 Get Google API Credentials
4:39 Setup Node.js/Express Application
8:28 Use the Google Sheets API!
20:19 Optional Extra: Create a Video Requester Demo Application!
25:39 Outro
----------------------------------------------------------
📚 Resources
----------------------------------------------------------
Editor (Visual Studio Code): code.visualstudio.com/ Theme: Synthwave '84
Web Browser (Back on Chrome!): www.google.com/intl/en_uk/chrome/
Terminal (iTerm, Mac only): iterm2.com/
MDN (where I reference JavaScript documentation): developer.mozilla.org/en-US/docs/Web/JavaScript
----------------------------------------------------------
🔗 My Links
----------------------------------------------------------
GitHub: github.com/jrgrimshaw/
Instagram: jrgrimshaw
LinkedIn: linkedin.com/in/jrgrimshaw
Personal site: jgrimshaw.com
#jamesgrimshaw #nodejs #googlesheets
----------------------------------------------------------
👀 Tutorial Links:
----------------------------------------------------------
GitHub Repository: github.com/jrgrimshaw/google-sheets-node
Google API Console: console.cloud.google.com
----------------------------------------------------------
💻 Commands Used:
----------------------------------------------------------
npm init
npm install express ejs googleapis
npm install -D nodemon
nodemon index.js
----------------------------------------------------------
⏰ Timestamps:
----------------------------------------------------------
0:00 Introduction
0:30 Get Google API Credentials
4:39 Setup Node.js/Express Application
8:28 Use the Google Sheets API!
20:19 Optional Extra: Create a Video Requester Demo Application!
25:39 Outro
----------------------------------------------------------
📚 Resources
----------------------------------------------------------
Editor (Visual Studio Code): code.visualstudio.com/ Theme: Synthwave '84
Web Browser (Back on Chrome!): www.google.com/intl/en_uk/chrome/
Terminal (iTerm, Mac only): iterm2.com/
MDN (where I reference JavaScript documentation): developer.mozilla.org/en-US/docs/Web/JavaScript
----------------------------------------------------------
🔗 My Links
----------------------------------------------------------
GitHub: github.com/jrgrimshaw/
Instagram: jrgrimshaw
LinkedIn: linkedin.com/in/jrgrimshaw
Personal site: jgrimshaw.com
#jamesgrimshaw #nodejs #googlesheets
Переглядів: 121 974
Відео
What's the Difference Between var, let and const? | JavaScript Pro Tips #2
Переглядів 2,1 тис.3 роки тому
JavaScript variables explained! In this tutorial and episode of JavaScript Pro Tips, we are going to look at the confusing world of JavaScript variables! Should you use const, let or var? Why is var bad? What does block-scoped and function-scoped mean?! This video should answer everything in just over 5 minutes! Hope you find it useful and don't forget to leave a comment with any cool JavaScrip...
Hidden console.log Features! | JavaScript Pro Tips #1
Переглядів 4,2 тис.3 роки тому
In this tutorial and pilot episode of JavaScript Pro Tips, we are going to learn about the large number of functions available to use in the JavaScript console. We are going to look at console.log, console.warn, console.error, console.table, console.group and console.time. Hope you find it useful and don't forget to leave a comment with any cool JavaScript tips you find! ⏰ Timestamps 0:00 Intro...
Host React.js App for FREE in 5 mins with GitHub Pages
Переглядів 95 тис.3 роки тому
In this short video, we will use the awesome GitHub Pages feature to deploy our React.js app for free. You can even add a custom domain later! This technique would also work for other static websites too. Hope you enjoy the video and find it useful! ⌨️ Commands Used Step 1 ▶️ git remote add origin [YOUR REPO LINK] ▶️ git add -A ▶️ git commit -m "Initial commit" ▶️ git push -u origin main Step 2...
Build a Notes App with React.js (for Beginners)
Переглядів 43 тис.3 роки тому
LIVE DEMO: github.jamesgrimshaw.com/notes-app-tutorial/ GET YOUR CSS HERE: github.com/jrgrimshaw/notes-app-tutorial/blob/main/src/App.css GITHUB REPO: github.com/jrgrimshaw/notes-app-tutorial Following on from my getting started with React.js for beginners guide, in this video I'm going to create an iOS-like notes application that is compatible with Markdown for instant formatting, and towards ...
Getting Started with React.js Tutorial for Beginners (v17 2021)
Переглядів 8 тис.3 роки тому
A getting started tutorial to React.js (v17) for beginners. In around 1 hour, you should have a good understanding of React and be able to apply it to your own projects. If you got through this video and are looking for a project to try, try creating a notes application. There should be a list of notes in the sidebar, and when clicking on a note there should be two input boxes where you can edi...
Thaank you sooo much!!
this video is life saver!
bro please make more on react js projects video,simple website for beginners i love the way explain
рахмет, Жеміс
onaddnote is not defined error occurs, how to resolve it?
Thanks a lot!
28:36 45:20
For those using Vite, npm run build will by default use a "dist" folder rather than a build folder, so deploy won't recognize it. You can instead add the following to your package.json scripts! "predeploy": "npm run build", "build": "vite build", "deploy": "gh-pages -d dist"
Isn't keeping the credentials.json in the code base not a good practice. Is there an alternative way of authenticating?
Your video is really helpful 🙌🙌
Does it have qouta or limits?
Looks like there is no need to use "auth.getClient()" as it throws an error just passing auth to auth as he does with the get request worked.
wow this video saved me from constant head ache, thanks bruv
Fantastic video!!!!
You skipped the vital part of having to show people to "Create React APP" there is no point of this vidoe if you are not teaching this... if anyone were to follow your steps they would not be able to complete it as their is no explination of how to "Create React APP"
Great!!
THANK YOU VEEEERRRRYYY MUCH. you are the best. i am so glad i found this vid
Hi! Great video. It worked for me. I have a question tho. The read of the csv WORKS just if I have a csv with just 1 sheet. I have another with 3 sheets and when i Try to get the values says errors: [ { message: 'This operation is not supported for this document', domain: 'global', reason: 'failedPrecondition' } ] what could it be?
Nevermind. I diplucated the file, get that id and work. Weird tho
great video.thanks!!
Hey does, this still work? Let me know
helpful.. thanks
Quite a handful of instructions. I think is a lot easier to just create a google app script to handle the CRUD operations on google sheets. That way you only need the deployment url in your nodejs to initiate reads and writes. Thanks though, it was very informative!
but this process can only host one page site
Real nice and concise tutorial! Thanks man. I was wondering however; how it is possible to make this more modular and make the spreadsheetId dependant on the user input - which ofcourse brings us to the following point; having the right read/write permissions on the spreadsheet.
yes check alternative video from neuralnine but in python
A massive thank you for this incredible hosting guide! Ive experimented with Bluehost and GoDaddy, however Cloudways with TST20 couppon is the best deal.
If you are using Vite, then your build folder called "dist", and you will have an error ENOENT no such file or directory... To deploy app based on vite you need to change the last script: "deploy": "gh-pages -d dist"
Building something at the moment where I need to read from a Google Sheet... I'm back here reminding myself how to do it 😂
Hi James, if i update a cell, will it show in edit history of the individual cell? I'm looking for a way to edit a cell without it showing in the edit history.
🤣
thanks man
Great tutorial on working with Google sheet api , that is get starter for everyone. Thnx
Great tutorial, thanks ! Worth mentioning : googleapis ONLY works on the server side. This will not work in a client side application like React or Vue alone.
Thanks for the video @James Can I get the details about integrating the same from react ?
Thank you so much, I was really hoping that I don't run into issues the night before the big career fair day at my university, so I can show them my react-app portfolio.
Thank you! This video was extremely helpful.
it doesnt work :( not really understand why?
Thank you so much for this tutorial. it's perfect for me because I'm working with express and google sheets API.
Failed to load resource: the server responded with a status of 404 () content.js:2 Uncaught TypeError: Cannot read properties of null (reading 'target') at e (content.js:2:88025) VM87:5407 page lang detection: 5.156982421875 ms please help mee(((((
I like that, thanks for lesson Bro 😄👍
Clean, Clear, and Concise. Bravo!
Keep it up bro!!!! top notch content 👏👏👏👏👏
Thank you this was explained brilliantly
Thank you so much, idol!!
thanks a lot to put a sense of humor around it
Hi, I know it was a long time ago, but... Is it free for commercial usage?
github pages is no longer free
Thanks a lot! Great video
Doesn't work to me, when i write npm run deploy it's starts building but in the end it gives me this error: ENOENT: no such file or directory, stat 'C:\Users\fabio\Desktop\fabio-psd\build'. Idk how to fix it and when i open the web page it gives me site not found. Help
Hey, I am facing same issue, so how did you solve this problem
Can we upload files on Google sheet from registation form when user upload it
is there anyone who can explain me how onChange is working and how it is updating the input and textarea. I've understood the code so far, but I'd appreciate a more detailed explanation of this specific aspect.
When I run i in my local machine it's working well, but i sent it to git hub and published with github pages. But it isn't working online, I don't know why. The pages redirect to an error: 405 Not Allowed And I receive a console error that says. POST ... 405
Thank you brother