From 6a6eeb21ef386c30a81ca6172b4557a4c92f5223 Mon Sep 17 00:00:00 2001 From: Long Phan Date: Mon, 16 Nov 2020 10:18:22 +0400 Subject: [PATCH 1/6] Update intallation doc regarding Github API configuration --- developer_docs/installation.md | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/developer_docs/installation.md b/developer_docs/installation.md index 2a788c02b2..500e760047 100644 --- a/developer_docs/installation.md +++ b/developer_docs/installation.md @@ -80,3 +80,10 @@ name, you can also set it using this variable. I.e.: For more information on using a custom domain, see this documentation link: http://docs.aws.amazon.com/AmazonS3/latest/dev/VirtualHosting.html#VirtualHostingCustomURLs + +## Github API Configuration + +This is an optional part, unless you are working on the part of the project that requires you to work with Github API (i.e: login with your Github Account, make request to Github API to download example sketches,...). An overview about Github API can be found [here](https://developer.github.com/v3/) + +Since the new update of Github API, when you go to your Developers Settings, you will see two types of Apps `Github Apps` and `OAuth Apps`. For this project, you should create an OAuth App since some Github API calls will not accept your Credentials if you create a Github App. One of the key differences between the two is that while `Oauth Apps` act on your behalf, `Github Apps` act on its own. More differences between these two can be found [here](https://docs.github.com/en/free-pro-team@latest/developers/apps/differences-between-github-apps-and-oauth-apps) + From 379628fa950609c74f1a6a33de372610ebca5093 Mon Sep 17 00:00:00 2001 From: Long Phan Date: Tue, 17 Nov 2020 12:39:34 +0400 Subject: [PATCH 2/6] update the installation guide with the github api config --- developer_docs/installation.md | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/developer_docs/installation.md b/developer_docs/installation.md index 500e760047..d3c0de7ac3 100644 --- a/developer_docs/installation.md +++ b/developer_docs/installation.md @@ -83,7 +83,16 @@ http://docs.aws.amazon.com/AmazonS3/latest/dev/VirtualHosting.html#VirtualHostin ## Github API Configuration -This is an optional part, unless you are working on the part of the project that requires you to work with Github API (i.e: login with your Github Account, make request to Github API to download example sketches,...). An overview about Github API can be found [here](https://developer.github.com/v3/) +This is neccessary for step 9 in [Manual Installation](https://github.com/processing/p5.js-web-editor/blob/develop/developer_docs/installation.md#manual-installation) section and step 6 in [Docker Installation](https://github.com/processing/p5.js-web-editor/blob/6a6eeb21ef386c30a81ca6172b4557a4c92f5223/developer_docs/installation.md#docker-installation) section -Since the new update of Github API, when you go to your Developers Settings, you will see two types of Apps `Github Apps` and `OAuth Apps`. For this project, you should create an OAuth App since some Github API calls will not accept your Credentials if you create a Github App. One of the key differences between the two is that while `Oauth Apps` act on your behalf, `Github Apps` act on its own. More differences between these two can be found [here](https://docs.github.com/en/free-pro-team@latest/developers/apps/differences-between-github-apps-and-oauth-apps) +In this application, Github Credentials are used for: +* Authentication with GitHub +* Importing the p5.js examples to your local database +* Rendering the 404 pages + +If you are working on a part of the application that requires one of the above uses then you will need to get GitHub API credentials. + +An overview about Github API can be found [here](https://developer.github.com/v3/). + +When you go to your Developers Settings, you will see two types of Apps `Github Apps` and `OAuth Apps`. For this application, you should create an OAuth App since some Github API calls will not accept your Credentials if you create a Github App. One of the key differences between the two is that while `Oauth Apps` act on your behalf, `Github Apps` act on its own. More differences between these two can be found [here](https://docs.github.com/en/free-pro-team@latest/developers/apps/differences-between-github-apps-and-oauth-apps) From 182b60a0980583d8a532d9c057bf5fd445ac8fe5 Mon Sep 17 00:00:00 2001 From: Long Phan Date: Wed, 18 Nov 2020 00:10:16 +0400 Subject: [PATCH 3/6] update the installation doc with github api configuration section linked to manual and docker installation --- developer_docs/installation.md | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/developer_docs/installation.md b/developer_docs/installation.md index d3c0de7ac3..9c5f233ddc 100644 --- a/developer_docs/installation.md +++ b/developer_docs/installation.md @@ -26,7 +26,7 @@ _Note_: The installation steps assume you are using a Unix-like shell. If you ar * For Windows and Linux: [MongoDB Installation](https://docs.mongodb.com/manual/installation/) 7. `$ cp .env.example .env` 8. (Optional) Update `.env` with necessary keys to enable certain app behaviors, i.e. add Github ID and Github Secret if you want to be able to log in with Github. -9. `$ npm run fetch-examples` - this downloads the example sketches into a user called 'p5' +9. `$ npm run fetch-examples` - this downloads the example sketches into a user called 'p5'. Note that you need to configure your Github API, details can be found in the [Github API Configuration] section(https://github.com/vulongphan/p5.js-web-editor/blob/fix/installation-guide-update/developer_docs/installation.md#github-api-configuration) 10. `$ npm start` 11. Navigate to [http://localhost:8000](http://localhost:8000) in your browser 12. Install the [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en) @@ -47,7 +47,7 @@ Note that this takes up a significant amount of space on your machine. Make sure 3. `$ docker-compose -f docker-compose-development.yml build` 4. `$ cp .env.example .env` 5. (Optional) Update `.env` with necessary keys to enable certain app behavoirs, i.e. add Github ID and Github Secret if you want to be able to log in with Github. -6. `$ docker-compose -f docker-compose-development.yml run --rm app npm run fetch-examples` +6. `$ docker-compose -f docker-compose-development.yml run --rm app npm run fetch-examples` - note that you need to configure your Github API, details can be found in the [Github API Configuration] section(https://github.com/vulongphan/p5.js-web-editor/blob/fix/installation-guide-update/developer_docs/installation.md#github-api-configuration) Now, anytime you wish to start the server with its dependencies, you can run: @@ -83,8 +83,6 @@ http://docs.aws.amazon.com/AmazonS3/latest/dev/VirtualHosting.html#VirtualHostin ## Github API Configuration -This is neccessary for step 9 in [Manual Installation](https://github.com/processing/p5.js-web-editor/blob/develop/developer_docs/installation.md#manual-installation) section and step 6 in [Docker Installation](https://github.com/processing/p5.js-web-editor/blob/6a6eeb21ef386c30a81ca6172b4557a4c92f5223/developer_docs/installation.md#docker-installation) section - In this application, Github Credentials are used for: * Authentication with GitHub * Importing the p5.js examples to your local database From d1f5de4c59484ed95e47df0a816eebc3cfde57eb Mon Sep 17 00:00:00 2001 From: Long Phan Date: Wed, 18 Nov 2020 00:17:30 +0400 Subject: [PATCH 4/6] update the installation doc with github api configuration section linked to manual and docker installation --- developer_docs/installation.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/developer_docs/installation.md b/developer_docs/installation.md index 9c5f233ddc..60f25bc56e 100644 --- a/developer_docs/installation.md +++ b/developer_docs/installation.md @@ -26,7 +26,7 @@ _Note_: The installation steps assume you are using a Unix-like shell. If you ar * For Windows and Linux: [MongoDB Installation](https://docs.mongodb.com/manual/installation/) 7. `$ cp .env.example .env` 8. (Optional) Update `.env` with necessary keys to enable certain app behaviors, i.e. add Github ID and Github Secret if you want to be able to log in with Github. -9. `$ npm run fetch-examples` - this downloads the example sketches into a user called 'p5'. Note that you need to configure your Github API, details can be found in the [Github API Configuration] section(https://github.com/vulongphan/p5.js-web-editor/blob/fix/installation-guide-update/developer_docs/installation.md#github-api-configuration) +9. Run `$ npm run fetch-examples` to download the example sketches into a user called 'p5'. Note that you need to configure your Github API, details can be found in the [Github API Configuration](https://github.com/vulongphan/p5.js-web-editor/blob/fix/installation-guide-update/developer_docs/installation.md#github-api-configuration) section 10. `$ npm start` 11. Navigate to [http://localhost:8000](http://localhost:8000) in your browser 12. Install the [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en) @@ -47,7 +47,7 @@ Note that this takes up a significant amount of space on your machine. Make sure 3. `$ docker-compose -f docker-compose-development.yml build` 4. `$ cp .env.example .env` 5. (Optional) Update `.env` with necessary keys to enable certain app behavoirs, i.e. add Github ID and Github Secret if you want to be able to log in with Github. -6. `$ docker-compose -f docker-compose-development.yml run --rm app npm run fetch-examples` - note that you need to configure your Github API, details can be found in the [Github API Configuration] section(https://github.com/vulongphan/p5.js-web-editor/blob/fix/installation-guide-update/developer_docs/installation.md#github-api-configuration) +6. `$ docker-compose -f docker-compose-development.yml run --rm app npm run fetch-examples` - note that you need to configure your Github API, details can be found in the [Github API Configuration](https://github.com/vulongphan/p5.js-web-editor/blob/fix/installation-guide-update/developer_docs/installation.md#github-api-configuration) section Now, anytime you wish to start the server with its dependencies, you can run: From c97ef3006d9fe18f845ac1e8a2bdbd621687849b Mon Sep 17 00:00:00 2001 From: Long Phan Date: Wed, 18 Nov 2020 09:18:22 +0400 Subject: [PATCH 5/6] update the installation doc with github api configuration section linked to manual and docker installation --- developer_docs/installation.md | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/developer_docs/installation.md b/developer_docs/installation.md index 60f25bc56e..2ef1daddc4 100644 --- a/developer_docs/installation.md +++ b/developer_docs/installation.md @@ -26,7 +26,8 @@ _Note_: The installation steps assume you are using a Unix-like shell. If you ar * For Windows and Linux: [MongoDB Installation](https://docs.mongodb.com/manual/installation/) 7. `$ cp .env.example .env` 8. (Optional) Update `.env` with necessary keys to enable certain app behaviors, i.e. add Github ID and Github Secret if you want to be able to log in with Github. -9. Run `$ npm run fetch-examples` to download the example sketches into a user called 'p5'. Note that you need to configure your Github API, details can be found in the [Github API Configuration](https://github.com/vulongphan/p5.js-web-editor/blob/fix/installation-guide-update/developer_docs/installation.md#github-api-configuration) section +9. Run `$ npm run fetch-examples` to download the example sketches into a user called 'p5'. Note that you need to configure your GitHub Credentials, which you can do by following the [Github API Configuration](#github-api-configuration) section. + 10. `$ npm start` 11. Navigate to [http://localhost:8000](http://localhost:8000) in your browser 12. Install the [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en) @@ -47,7 +48,8 @@ Note that this takes up a significant amount of space on your machine. Make sure 3. `$ docker-compose -f docker-compose-development.yml build` 4. `$ cp .env.example .env` 5. (Optional) Update `.env` with necessary keys to enable certain app behavoirs, i.e. add Github ID and Github Secret if you want to be able to log in with Github. -6. `$ docker-compose -f docker-compose-development.yml run --rm app npm run fetch-examples` - note that you need to configure your Github API, details can be found in the [Github API Configuration](https://github.com/vulongphan/p5.js-web-editor/blob/fix/installation-guide-update/developer_docs/installation.md#github-api-configuration) section +6. `$ docker-compose -f docker-compose-development.yml run --rm app npm run fetch-examples` - note that you need to configure your GitHub Credentials, which you can do by following the [Github API Configuration](#github-api-configuration) section. + Now, anytime you wish to start the server with its dependencies, you can run: From 94ae6a7f84f3bbb3b2172c6d53eb9ca66f71bdf0 Mon Sep 17 00:00:00 2001 From: Cassie Tarakajian Date: Wed, 18 Nov 2020 19:46:18 -0500 Subject: [PATCH 6/6] [#1679] Update GitHub API credentials documentation --- developer_docs/installation.md | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/developer_docs/installation.md b/developer_docs/installation.md index 2ef1daddc4..01f53f3ad3 100644 --- a/developer_docs/installation.md +++ b/developer_docs/installation.md @@ -83,16 +83,18 @@ For more information on using a custom domain, see this documentation link: http://docs.aws.amazon.com/AmazonS3/latest/dev/VirtualHosting.html#VirtualHostingCustomURLs -## Github API Configuration +## GitHub API Configuration -In this application, Github Credentials are used for: +In this application, GitHub credentials are used for: * Authentication with GitHub * Importing the p5.js examples to your local database * Rendering the 404 pages -If you are working on a part of the application that requires one of the above uses then you will need to get GitHub API credentials. +If you are working on a part of the application that requires one of the above uses, then you will need to get GitHub API credentials. -An overview about Github API can be found [here](https://developer.github.com/v3/). - -When you go to your Developers Settings, you will see two types of Apps `Github Apps` and `OAuth Apps`. For this application, you should create an OAuth App since some Github API calls will not accept your Credentials if you create a Github App. One of the key differences between the two is that while `Oauth Apps` act on your behalf, `Github Apps` act on its own. More differences between these two can be found [here](https://docs.github.com/en/free-pro-team@latest/developers/apps/differences-between-github-apps-and-oauth-apps) +When you go to the Developer settings in your GitHub account, you will see that you can create two types of Apps: `GitHub Apps` and `OAuth Apps` ([differences between GitHub Apps and OAuth Apps](https://docs.github.com/en/free-pro-team@latest/developers/apps/differences-between-github-apps-and-oauth-apps)). This project requires you to make an `OAuth App`. After clicking on "New OAuth App", you will need to fill in the following fields: +- **Application name**: `p5.js Web Editor - Local` +- **Homepage URL**: `http://localhost:8000` +- **Authorization Callback URL**: `http://localhost:8000/auth/github/callback` +If you would like to learn more about what you can do with the GitHub API, you can look at the [API documentation](https://developer.github.com/v3/).