How to use a basic Google Sheets javascript script in GitHub Pages?












0















Trying to implement a piece of code to display data from a Google Spreadsheet in my GitHub Pages page. I found Sheetrock.js and the JS Fiddle worked, but I'm missing how to setup a basic javascript file structure. I know I can name files ___.js and call them from the html file, but the Sheetrock.js info doesn't use this format. I remember trying this a while ago and after hitting the same roadblocks gave up, so I'm posting to hopefully save others, coming from a similar search for using GSheets in a static site through javascript, hours of searching on such a simple problem.










share|improve this question





























    0















    Trying to implement a piece of code to display data from a Google Spreadsheet in my GitHub Pages page. I found Sheetrock.js and the JS Fiddle worked, but I'm missing how to setup a basic javascript file structure. I know I can name files ___.js and call them from the html file, but the Sheetrock.js info doesn't use this format. I remember trying this a while ago and after hitting the same roadblocks gave up, so I'm posting to hopefully save others, coming from a similar search for using GSheets in a static site through javascript, hours of searching on such a simple problem.










    share|improve this question



























      0












      0








      0








      Trying to implement a piece of code to display data from a Google Spreadsheet in my GitHub Pages page. I found Sheetrock.js and the JS Fiddle worked, but I'm missing how to setup a basic javascript file structure. I know I can name files ___.js and call them from the html file, but the Sheetrock.js info doesn't use this format. I remember trying this a while ago and after hitting the same roadblocks gave up, so I'm posting to hopefully save others, coming from a similar search for using GSheets in a static site through javascript, hours of searching on such a simple problem.










      share|improve this question
















      Trying to implement a piece of code to display data from a Google Spreadsheet in my GitHub Pages page. I found Sheetrock.js and the JS Fiddle worked, but I'm missing how to setup a basic javascript file structure. I know I can name files ___.js and call them from the html file, but the Sheetrock.js info doesn't use this format. I remember trying this a while ago and after hitting the same roadblocks gave up, so I'm posting to hopefully save others, coming from a similar search for using GSheets in a static site through javascript, hours of searching on such a simple problem.







      javascript github-pages google-sheets-api sheetrock






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Jan 2 at 18:36







      alchemy

















      asked Jan 2 at 18:27









      alchemyalchemy

      13216




      13216
























          1 Answer
          1






          active

          oldest

          votes


















          0














          I searched for hours (through Jekyll tutorials and other JS package installations). I know this seems simple now, but there was only one basic javascript setup I finally found that answered it after searching on 'javascript', 'github pages', and even jquery with GH.



          So the basic answer seems to be to simply create an index.js file next to index.html, and this is of course where all the generic javascript goes. The tags and external http CDN js file imports go in the HTML file.



          You can use other javascript means such as JSON based access to connect to GSheet data, but Sheetrock.js seems to be doing okay.



          There are also ways to adjust the iframe to select columns and use the SQL language base using the Google Google Visualization API Query Language described in this page. The SQL type commands carry over to the Sheetrock.js usage.






          share|improve this answer
























            Your Answer






            StackExchange.ifUsing("editor", function () {
            StackExchange.using("externalEditor", function () {
            StackExchange.using("snippets", function () {
            StackExchange.snippets.init();
            });
            });
            }, "code-snippets");

            StackExchange.ready(function() {
            var channelOptions = {
            tags: "".split(" "),
            id: "1"
            };
            initTagRenderer("".split(" "), "".split(" "), channelOptions);

            StackExchange.using("externalEditor", function() {
            // Have to fire editor after snippets, if snippets enabled
            if (StackExchange.settings.snippets.snippetsEnabled) {
            StackExchange.using("snippets", function() {
            createEditor();
            });
            }
            else {
            createEditor();
            }
            });

            function createEditor() {
            StackExchange.prepareEditor({
            heartbeatType: 'answer',
            autoActivateHeartbeat: false,
            convertImagesToLinks: true,
            noModals: true,
            showLowRepImageUploadWarning: true,
            reputationToPostImages: 10,
            bindNavPrevention: true,
            postfix: "",
            imageUploader: {
            brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
            contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
            allowUrls: true
            },
            onDemand: true,
            discardSelector: ".discard-answer"
            ,immediatelyShowMarkdownHelp:true
            });


            }
            });














            draft saved

            draft discarded


















            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54011347%2fhow-to-use-a-basic-google-sheets-javascript-script-in-github-pages%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown

























            1 Answer
            1






            active

            oldest

            votes








            1 Answer
            1






            active

            oldest

            votes









            active

            oldest

            votes






            active

            oldest

            votes









            0














            I searched for hours (through Jekyll tutorials and other JS package installations). I know this seems simple now, but there was only one basic javascript setup I finally found that answered it after searching on 'javascript', 'github pages', and even jquery with GH.



            So the basic answer seems to be to simply create an index.js file next to index.html, and this is of course where all the generic javascript goes. The tags and external http CDN js file imports go in the HTML file.



            You can use other javascript means such as JSON based access to connect to GSheet data, but Sheetrock.js seems to be doing okay.



            There are also ways to adjust the iframe to select columns and use the SQL language base using the Google Google Visualization API Query Language described in this page. The SQL type commands carry over to the Sheetrock.js usage.






            share|improve this answer




























              0














              I searched for hours (through Jekyll tutorials and other JS package installations). I know this seems simple now, but there was only one basic javascript setup I finally found that answered it after searching on 'javascript', 'github pages', and even jquery with GH.



              So the basic answer seems to be to simply create an index.js file next to index.html, and this is of course where all the generic javascript goes. The tags and external http CDN js file imports go in the HTML file.



              You can use other javascript means such as JSON based access to connect to GSheet data, but Sheetrock.js seems to be doing okay.



              There are also ways to adjust the iframe to select columns and use the SQL language base using the Google Google Visualization API Query Language described in this page. The SQL type commands carry over to the Sheetrock.js usage.






              share|improve this answer


























                0












                0








                0







                I searched for hours (through Jekyll tutorials and other JS package installations). I know this seems simple now, but there was only one basic javascript setup I finally found that answered it after searching on 'javascript', 'github pages', and even jquery with GH.



                So the basic answer seems to be to simply create an index.js file next to index.html, and this is of course where all the generic javascript goes. The tags and external http CDN js file imports go in the HTML file.



                You can use other javascript means such as JSON based access to connect to GSheet data, but Sheetrock.js seems to be doing okay.



                There are also ways to adjust the iframe to select columns and use the SQL language base using the Google Google Visualization API Query Language described in this page. The SQL type commands carry over to the Sheetrock.js usage.






                share|improve this answer













                I searched for hours (through Jekyll tutorials and other JS package installations). I know this seems simple now, but there was only one basic javascript setup I finally found that answered it after searching on 'javascript', 'github pages', and even jquery with GH.



                So the basic answer seems to be to simply create an index.js file next to index.html, and this is of course where all the generic javascript goes. The tags and external http CDN js file imports go in the HTML file.



                You can use other javascript means such as JSON based access to connect to GSheet data, but Sheetrock.js seems to be doing okay.



                There are also ways to adjust the iframe to select columns and use the SQL language base using the Google Google Visualization API Query Language described in this page. The SQL type commands carry over to the Sheetrock.js usage.







                share|improve this answer












                share|improve this answer



                share|improve this answer










                answered Jan 2 at 18:27









                alchemyalchemy

                13216




                13216
































                    draft saved

                    draft discarded




















































                    Thanks for contributing an answer to Stack Overflow!


                    • Please be sure to answer the question. Provide details and share your research!

                    But avoid



                    • Asking for help, clarification, or responding to other answers.

                    • Making statements based on opinion; back them up with references or personal experience.


                    To learn more, see our tips on writing great answers.




                    draft saved


                    draft discarded














                    StackExchange.ready(
                    function () {
                    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54011347%2fhow-to-use-a-basic-google-sheets-javascript-script-in-github-pages%23new-answer', 'question_page');
                    }
                    );

                    Post as a guest















                    Required, but never shown





















































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown

































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown







                    Popular posts from this blog

                    Can a sorcerer learn a 5th-level spell early by creating spell slots using the Font of Magic feature?

                    ts Property 'filter' does not exist on type '{}'

                    Notepad++ export/extract a list of installed plugins