Giter Club home page Giter Club logo

gwao_github's Introduction

Sample add-on: GitHub Reader

This is a sample add-on that demonstrates using external services to bring rich information into Gmail, as well as contextual triggering based on email content. It triggers in response to messages containing links GitHub issues or pull requests and displays additional relevant information.

Screenshot

Note: This is not an official Google product.

Before you begin

If you're new to add-on development or Apps Script, try the quickstart before proceeding.

This sample requires the following:

  • Node.js is installed with npm and npx commands.
  • A GitHub account, as well as notification emails for an issue or pull request from from a hosted repository.

Downloading the sample

Download the sample app and navigate into the app directory:

  1. Clone the Gmail add-ons samples, to your local machine:

    git clone https://github.com/googleworkspace/add-ons-samples.git
    

    Alternatively, you can download the sample as a zip file and extract it.

  2. Change to the sample directory:

    cd add-ons-samples/apps-script/github
    
  3. Initialize the project:

    npm install
    
  4. Bundle the dependencies:

    npm run build
    

Deploy the add-on

Deploy the add-on by following these steps:

  1. Authorize clasp to manage your scripts

    npx @google/clasp login
    
  2. Create a new project:

    npx @google/clasp create --type standalone --title "GitHub Reader"
    
  3. Push the code:

    npx @google/clasp push -f
    

Configure GitHub credentials

Access the GitHub API requires registration. To register your own application:

  1. Open the script editor:

    npx @google/clasp open
    
  2. Get the script id by clicking on File > Project properties and note the value of the Script ID field.

  3. Follow GitHub's guide to create an OAuth Application. Use the value https://script.google.com/macros/d/{SCRIPT_ID}/usercallback for the Authorization callback URL, replacing {SCRIPT_ID} with the script id located in the previous step.

  4. Create a script property with the credentials:

    a. Click on File > Project properties > Script properties.

    b. Click Add row.

    c. Enter the property name githubCredentials.

    d. Click on the blank area in the Value column.

    e. Enter the value below, subsituting the {CLIENT_ID} and {CLIENT_SECRET} with the values provided by GitHub.

    {"clientId": "{CLIENT_ID}", "clientSecret": "{CLIENT_SECRET}" }
    

    f. Click Save.

Install the add-on

Once the add-on is deployed, install the add-on on your account using these steps:

  1. Open the project

    npx @google/clasp open
    
  2. In the Apps Script editor, select Publish > Deploy from manifest... to open the Deployments dialog.

  3. In the Latest Version (Head) row, click Install add-on to install the currently saved version of the add-on in development-mode.

Run the add-on

  1. Open Gmail. If Gmail was open prior to enabling the add-on, you may need to refresh the tab.

  2. Open a message in Gmail.

  3. The add-on should place a contextual card on the right-side of the window, with a message asking for authorization. Click the Authorize access link to open a dialog where you can authorize the add-on.

  4. Select the account that should authorize the add-on.

  5. Read the notice in the next dialog carefully, then click Allow.

  6. Once authorized, the add-on should automatically refresh and start operating.

Contributing

Please read our guidelines for contributors.

License

This sample is licensed under the Apache 2 license.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.