Google Sheets Web App Example - Google Apps Script Web App Tutorial - Part 1

Sdílet
Vložit
  • čas přidán 8. 07. 2024
  • Learn how to create Web App with Google Apps Script and have it interact with Google Sheets using JavaScript & HTML.
    Support the Channel:
    / chicagocomputerclasses
    Full playlist with all parts:
    • Google Apps Script - W...
    MORE TUTORIALS ON THIS TOPIC:
    Userform Level 2 Series
    • Google Sheets Userform...
    Userform Level 3 Series - Google Sheets CRUD
    • Userform Level 3 Serie...
    HTML/CSS/JavaScript Fundamentals
    • HTML & CSS Crash Cours...
    JavaScript Array Methods
    • Google Apps Script Int...
    #webapp #google #spreadsheet

Komentáře • 626

  • @ExcelGoogleSheets
    @ExcelGoogleSheets  Před 2 lety +6

    Watch Full Web App Series czcams.com/play/PLv9Pf9aNgemt82hBENyneRyHnD-zORB3l.html
    Google Sheets Userform Wep App Level 2 czcams.com/play/PLv9Pf9aNgemuzTNWeHd8HziGVNzSlWACh.html
    CRUD Web App Series czcams.com/play/PLv9Pf9aNgemvM36efLpaHxbkZTGp2pfhx.html

    • @nihaalaekka8509
      @nihaalaekka8509 Před 2 lety +3

      I have written code in the same way as mentioned in the video but the sheet is not updating and the fields are not clearing after I hit submit. I can share my code if you want. Please suggest me a solution.

    • @AtiqZabinski
      @AtiqZabinski Před rokem

      @@nihaalaekka8509 Same. Refreshing page actually has no effect on the Execution Log; must run functions from the console. Did you crack it?

    • @ctcc6244
      @ctcc6244 Před rokem +2

      @@nihaalaekka8509 I had same thing. until I see Thinh Nguyen below, solved it. "If you follow the instruction until 19:12 and get nothing in the Log, just go to the menu Run and choose Disable new App Script runtime powered by Chrome V8, then everything will work. " Chrome V8 Probably wasn't a feature when this video was created. On top of that, Google is going to change the APP script Editor interface which will be more confusing. Like Google wants to copy 1990-2010 Microsoft of rolling out new Windows every few years to confuse everyone. also addEventListener didn't work for me, not sure why. I got around it by adding onclick code.

    • @levancanh3927
      @levancanh3927 Před rokem

      Thank you

  • @tedjammers
    @tedjammers Před 5 lety +121

    This is so great. You are opening doors to things that seemed unattainable to a novice like me. Thank you.

  • @heinrichhelmbold419
    @heinrichhelmbold419 Před 5 lety +27

    Almost started to give up on AppScript and then I discovered your channel... THANK YOU! Your way of explaining makes so much more sense than reading through Google's online help.
    If at all possible, could you do some examples of using Google Forms with AppScript and Google Sheets? Things like populating drop downs, button actions etc.

  • @alipouradam4406
    @alipouradam4406 Před 5 lety +4

    I really enjoyed watching this video! Perfect quality, sound, compact teaching, just perfect! Thank you SO MUCH and wish you all the best.

  • @annaandresen7048
    @annaandresen7048 Před 5 lety +16

    This is such an amazing video. You really have a great teaching style, everything is so clear and you explain everything so good! thank you so much for helping out

  • @edgardocometto2051
    @edgardocometto2051 Před 3 lety

    You are so clear! I practically do not speak english, but with your videos I learn both. Thank you for your time..

  • @BarryMilne
    @BarryMilne Před 3 lety

    This is great! I've been using Google App scripts for a while;but, haven't done any UI expect with the Google Apps. This is a great jump start.

  • @avimehenwal
    @avimehenwal Před 4 lety +5

    WOwowow wowo man! This tutorial did just opened my eyes. And all this come free with google if you can program little bit :) Thankyou so much for this tutorial man, loved it. Its mind blowing

  • @AkiraShocking
    @AkiraShocking Před 5 lety

    It's just amazing ! I'm from France and your tutorial is just fantastic for learn. Don't stop yeah, thank you !

  • @gsxmentor
    @gsxmentor Před 5 lety

    I have not found any video material on web, regarding this, better than yours. Salute and Respect for your detailing and convincing method of conveying rather teaching

  • @liangmale
    @liangmale Před 5 lety

    Excellent video, as others people say don't stop, we are waiting for more, thanks a lot. You are a teacher by nature

  • @ashemuh4755
    @ashemuh4755 Před 2 lety

    This tutorial is best of the best of the best That I have seen last 12 years. Simple frontend backend database web app in 30 minutes.
    Thank you for your time.

  • @brintmontgomery8323
    @brintmontgomery8323 Před 5 lety +1

    So VERY glad somebody walked me thru this processes!! Thanks for making this video.

  • @josephus626
    @josephus626 Před 4 lety +11

    Going back to this tutorial, I realized it would be awesome if there is a way to fill out a fillable PDF from information provided in the web app. As always, I appreciate your tutorial bro. Keep them coming.

    • @rafaelwendel1400
      @rafaelwendel1400 Před 4 lety +1

      It is, all you need to to is integrate the form data with Google Docs or Google Slides, for example SlidesApp has the function replace all text which you can run along with DriveApp to create a temporary copy and replace your info, then you can save the blob as PDF and export it, save it in your Google Drive our use MailApp to email it

  • @rachidbeggar711
    @rachidbeggar711 Před 5 lety +5

    You are doing a very noble work, thank you so much.

  • @leonsabit2335
    @leonsabit2335 Před 4 lety

    Excelente tu aporte. Soy de Colombia y estoy sencillamente encantado con la claridad con que explicas. Por cierto, no hablo muy bien Inglés; no obstante comprendo tus videos. Gracias por tu colaboración y dedicación.

  • @steph291
    @steph291 Před 3 lety +1

    developing in the cloud ! OMG... I'm from the old school of the 90's AMAZING ! thanks

  • @hakuna3624
    @hakuna3624 Před 4 lety +1

    Great tutorial... Finally found solution how to make google script app using html service after ui service deprecated warning here. Thanks you!!!

  • @MohamedIbrahim-im5qs
    @MohamedIbrahim-im5qs Před 3 lety +7

    As usual fantastic tutorial, I am learning so much from your channel. Thanks.
    Ref. 9:48 Just in case someone is having trouble passing multiple values with the same parameter, the way to pass different categories is like this: category=6&category=44&category=2. If you just separate the values with commas you end up with one category having the string value "6,44,2".

    • @MaqsoodAlamShafiq
      @MaqsoodAlamShafiq Před 5 měsíci +1

      I also discovered this anomaly (in 2024). I guess your comment being 3 years old and the tutorial 5 years old, maybe Goolge had changed something under the hood.

  • @reie4208
    @reie4208 Před 4 lety +1

    Your tuts have been helping me so much. You're amazing! Thank you very much!

  • @staycalm4957
    @staycalm4957 Před 3 lety +1

    Thanks a lot for those tutorials. They are really helpful, so well organized and much detailed!
    Keep up the good work!

  • @julia.vasilieva
    @julia.vasilieva Před 5 lety

    Genious in teaching! Yes please make an html video explaining these options (output, evaluate etc.), explaining scriptlets and what's the difference in using them with using , when and why. How to properly use a script inside an html file, interaction between them. So appreciate your efforts!!!

  • @sheikhraisulislam4483
    @sheikhraisulislam4483 Před 2 lety

    Bools eye. No bullshitting , just pure knowledge. awesome style.

  • @bigbrother1211
    @bigbrother1211 Před 4 lety +2

    Thank you so much!
    This is the kind of video that changes the world : )

  • @amalprabath7983
    @amalprabath7983 Před 5 lety +2

    you are the best teacher ever

  • @rayongkiteboardingschool7023

    I think your great at doing all these videos. you teaching is clear an concise. Love it.

  • @geremycao4919
    @geremycao4919 Před 5 lety +1

    Really appreciate these, has helped me so much. Please don't stop!!!

  • @fredzecat5993
    @fredzecat5993 Před 4 lety

    Only two words : Great, Thanks !

  • @tiwarirr
    @tiwarirr Před 5 lety +2

    Very nice teaching! Thanks for adding new contents.

  • @robertmaluka2763
    @robertmaluka2763 Před 5 lety +4

    I really enjoyed this video. This is what I have been looking for. I would like to know more on HTML Thanks

  • @tanveerhussain3881
    @tanveerhussain3881 Před 3 lety

    World's Best Teacher
    Best Quality
    Learn Easy and Understand
    I Love And Like All Video

  • @user-rd4tz5sq7s
    @user-rd4tz5sq7s Před 3 lety

    Very nice tutorial. I am writing standalone scripts for myself, not using html interaction. Need arised to share with my colleagues. WebApp deployment is found appropriate, for which this tutorial is apt. Thanks.

  • @chatbot6348
    @chatbot6348 Před 5 lety

    Great video,. The best tutorial about how to use GAS for newbie.

  • @nikluz3807
    @nikluz3807 Před 5 lety

    Dude I love this. THANK YOU!

  • @martinn1071
    @martinn1071 Před 5 lety +7

    THIS IS GOOD STUFF
    I MEAN, REALLY GOOD STUFF
    YOU'RE THE MAN !!

    • @maziarpedram5213
      @maziarpedram5213 Před 4 lety

      google.script.run.userclicked() does not work, please explain why

  • @rustamthomas6381
    @rustamthomas6381 Před 5 lety

    Thank you very much ... This video is a great tutorial for me to enhance my tools. Wonderful and bravo. Really a great information !! You nailed it.

  • @rgenericson5361
    @rgenericson5361 Před 4 lety

    Sweet! Just what I need for a work project!

  • @CBSD1972
    @CBSD1972 Před 5 lety

    Thanks a lot! It's a long awaited video. Please, give us more about google web scripts

  • @fusillertube
    @fusillertube Před 3 lety +2

    Excellent tutorial. Very well explained, the logic is clear. Great job ! Thanks a lot

  • @eneiasmg
    @eneiasmg Před 4 lety

    All I can say is Thanks a lot! 👏👏👏

  • @agentbey
    @agentbey Před 4 lety +1

    Very clear and precise. Way better than all the blogs and videos I've seen in the past 48 hours. Big thanks. Question: I have already have an HTML form with more details. Do I need to add a variable for each input type?

  • @mrpakravian
    @mrpakravian Před 5 lety +1

    You are Awsome as usual
    Every tutorial is a killer

  • @4funrc11
    @4funrc11 Před 4 lety

    Thank you! :) I've been hoping for this type of instruction vid. :)

  • @m07028
    @m07028 Před 3 lety +1

    You are a life saver. Great Job!

  • @AndroidsReview
    @AndroidsReview Před 4 lety

    Very useful video for me, it help me understand work on freelance. Thank you!

  • @lasantharanjith8230
    @lasantharanjith8230 Před rokem

    I have created a valuable online application after watching your videos, thank you very much👍

  • @snwlms
    @snwlms Před 5 lety +2

    Please Add more vids on app script..
    Awesome content as always..

  • @WitoonThreamthakanpon
    @WitoonThreamthakanpon Před 3 lety +1

    Super step to make webpage easy way. I can apply these step for small business. Thank you so much and very much. :))

  • @fhozouri
    @fhozouri Před 3 lety +1

    Great training for novices.

  • @rizkyazandra9651
    @rizkyazandra9651 Před rokem +1

    clearest ever tutorial on appscript

  • @Benji-Hello-World
    @Benji-Hello-World Před 4 lety +46

    If you run into trouble trying to Log the (e) or event click on the "Apps Script Dashboard" link at the bottom of the log window, this will show you the log output that matches the video.

    • @erickk716
      @erickk716 Před 4 lety +2

      may i know why this happen? i mean the null value from the log.

    • @JDLeadam
      @JDLeadam Před 4 lety +3

      @@erickk716 They must have updated Apps Script. On the pop up page with "null" click on the text link at the bottom "Apps Script Dashboard" and if you click on each log it will show you what's referenced in the video.

    • @addasmusic
      @addasmusic Před 4 lety +2

      i should have came to comments 15 mins earlier😑 thank you btw😂

    • @hubertprayogo5858
      @hubertprayogo5858 Před 4 lety +3

      I just started making one myself (total newbie on this)
      Apparently this is not the only thing that has been slightly changed, the part where function 'userClicked' is now considered TypeError & cannot get the log for "Someone Clicked the Button".
      Any idea how to fix this?

    • @jimarl2002
      @jimarl2002 Před 4 lety

      Inhabilitar el nuevo tiempo de ejecución de Apps Script con tecnología de Chrome V8

  • @brilliantpy
    @brilliantpy Před rokem

    Thank you for creating a very helpful and easy to follow video! Great job!!!

  • @marwanshwaiki777
    @marwanshwaiki777 Před rokem

    This is really a great video. I think this would change my methods with the registration in my educational spreadsheets.

  • @chandrakantsurwase2881

    Great video by Google thanks for sharing this valuable video.

  • @ro.gerioj
    @ro.gerioj Před 5 lety

    You have saved me! Thank you a lot!

  • @intissarchneb6789
    @intissarchneb6789 Před 5 lety

    u r simply a genius !

  • @leonsabit2335
    @leonsabit2335 Před 2 lety +1

    You´re a genius. Amazing video. Here again.

  • @jasonstraurss6974
    @jasonstraurss6974 Před 2 lety

    very fun first go, thank you for the tutorial, in programing it is always gratifyingly to get results quickly

  • @jodhvirsingh8677
    @jodhvirsingh8677 Před 3 lety +1

    Excellent tutorial as usual

  • @alfredocoindreau9876
    @alfredocoindreau9876 Před 3 lety

    Estoy flipando pepinillos, apenas vi que se podía incluir css, js, html, y sigo flipando leyendo la documentación , ya estoy diseñando en el papel la app que voy a armar, muy buenos videos!!! like vitalicio para los videos de este canal

  • @dyaaserag6727
    @dyaaserag6727 Před 4 lety

    Woow ! That is great !!!
    That tut was so helpful,thx bro❤

  • @pedrotomasdominguezcardena9206

    Haces lo que nadie cuenta, gracias, muchas gracias!

  • @emingunduz4690
    @emingunduz4690 Před 2 lety

    Thank you for these information. They helps a lot. You teach step by step and easy to understand. It helps me to be better at my work.

  • @netboy1102
    @netboy1102 Před 4 lety

    Great tutorial again!

  • @mask75260
    @mask75260 Před 4 lety

    Great I learn a lot from you.

  • @tarunsukhpalani9514
    @tarunsukhpalani9514 Před 4 lety +2

    First 10 seconds and I was like this is what I am searching for years😋🐒

  • @sandermann
    @sandermann Před 3 lety

    Great Tutorial. Thank you for sharing.

  • @mannifrosh
    @mannifrosh Před 4 lety

    Great job, thank you!

  • @edidiongesu4035
    @edidiongesu4035 Před 3 lety +1

    Thank you for this Video, man

  • @pymathsstepbystep490
    @pymathsstepbystep490 Před 4 lety

    Very useful. Thank you for sharing.

  • @Benji-Hello-World
    @Benji-Hello-World Před 4 lety

    This is great I learned a lot

  • @erickk716
    @erickk716 Před 4 lety

    really amazing! learn a lot!

  • @sohailmalik5481
    @sohailmalik5481 Před 4 lety

    Very Nice Tutorials.. Please keep on making such useful stuff

  • @douglasteixeiradeabreu

    Hello my friend, I really appreciate the videos that on google sheets, I work at a university and I really do a lot of discipline controls and teaching plans using this incredible tool.
    I prepared a script that helps me with different titles written in Brazilian Portuguese, these titles or names need to have their first letters in uppercase, however in my language there are stopwords that should not be with the first letter in upper case. I decided to search and got a script using a database on a spreadsheet sheet as a reference to disregard the stopwords and thus result in the real upper case of my names and titles.
    My wish is to create a web application of this sheet that is open to the public of the university I work in, but because it has a script, it ends up needing a login so that friends can use it.
    So if I can make a web application, it will be useful for all of us
    I have seen your work on web application, but I haven't seen anything I need for this project of mine. It would exactly return the result of the operation and a script.
    In this case, the user accesses the web application and there he pastes several lines of titles or names, there he will have a button that he clicks so that the script (which is already ready) returns the result in the web application.
    It seems to be something really simple, but my knowledge still doesn't help me. I am looking to make this possible so I ask for your help.
    Strong hug!

  • @SofianMW
    @SofianMW Před 5 lety

    thanks its a good introduction....looking to all tuto

  • @donniecooper1190
    @donniecooper1190 Před 5 lety

    Thank you, excellent

  • @---ml4jd
    @---ml4jd Před 11 měsíci

    thanks for a great vid, i reference this vid mabye 10 times over the years LOL
    loov u

  • @thinhse
    @thinhse Před 3 lety +6

    If you follow the instruction until 19:12 and get nothing in the Log, just go to the menu Run and choose Disable new App Script runtime powered by Chrome V8, then everything will work.

  • @africaglobalcorporateservi6535

    Hi there, thank you for this interesting video and channel.
    Really helpfull

  • @ph5874
    @ph5874 Před 3 lety

    You are the best, well done!

  • @leonelcontreras9914
    @leonelcontreras9914 Před 3 lety

    Thank you, this is really useful.

  • @valadares462
    @valadares462 Před 5 lety +1

    Fantastic. This is your best video until now.

  • @minabenjamin3660
    @minabenjamin3660 Před 3 lety

    Thank you so much mate!
    Your videos are so informative.
    Great job.

  • @EnriqueGonzalezOrtiz
    @EnriqueGonzalezOrtiz Před 5 lety

    Great! Thanks so much!!

  • @kenrowan2242
    @kenrowan2242 Před rokem

    I love this. It's so easy to follow you and understand. Thanks for sharing.

  • @fpwilliams71
    @fpwilliams71 Před 3 lety +2

    Awesome. well done for the good job.

  • @PropertiDong
    @PropertiDong Před 4 lety

    Very helpful information , thanks 🙏

  • @wirot125
    @wirot125 Před 5 lety

    Thank you very much.

  • @sukhwinderrahal7153
    @sukhwinderrahal7153 Před 4 lety

    amazing explanation.

  • @guitarman7575
    @guitarman7575 Před 3 lety +1

    Great. Thank you 👍👍👍 you're the best

  • @theAnandKarna
    @theAnandKarna Před 4 lety

    Thanks for sharing this.

  • @tinkershukla1725
    @tinkershukla1725 Před 5 lety

    Your are the best I have come across . Even better than the bozos on other paid edu-portals

  • @user-td8ns3oz1q
    @user-td8ns3oz1q Před 3 lety +1

    Nice, Helpful video,saya 😘

  • @pierredeman66
    @pierredeman66 Před 5 lety

    Nice video. Just the thing I was looking for. Hope many more will follow. And I hope you also maybe will show something about search from Google Sheets and how to edit the search results. Keep it up. :-)

  • @VVSite
    @VVSite Před 4 lety

    Tnank's! It's helpfull.

  • @genaminin
    @genaminin Před 3 lety +1

    Nice! Very useful

  • @levancanh3927
    @levancanh3927 Před rokem

    Cảm ơn bạn, bài viết rất hữu ích, đã giúp mình rất nhiều.

  • @gallowsmere3183
    @gallowsmere3183 Před 5 lety

    Thank you very much

  • @mashupstudio.youtube
    @mashupstudio.youtube Před 4 lety

    me encanto buena guia para empezar.

  • @TomMiLLeRThailand
    @TomMiLLeRThailand Před 5 lety +1

    Really Great much helpful great information like the door to door hit it, may be possible some more Tutorial about creating an application:) Thankyou.