Improve config for codespaces (#71)

Author: KalpanaReddyC

.devcontainer/advanced-integration/devcontainer.json

@@ -1,20 +1,16 @@
 // For more details, see https://aka.ms/devcontainer.json.
 {
 	"name": "PayPal Advanced Integration",
-	"image": "mcr.microsoft.com/devcontainers/universal:2",
+	"image": "mcr.microsoft.com/devcontainers/javascript-node:20",
 	"workspaceFolder": "/workspaces/${localWorkspaceFolderBasename}/advanced-integration",
-
 	// Use 'onCreateCommand' to run commands when creating the container.
 	"onCreateCommand": "bash ../.devcontainer/advanced-integration/welcome-message.sh",
-
 	// Use 'postCreateCommand' to run commands after the container is created.
 	"postCreateCommand": "npm install",
-
 	// Use 'postAttachCommand' to run commands when attaching to the container.
 	"postAttachCommand": {
 		"Start server": "npm start"
 	},
-
 	// Use 'forwardPorts' to make a list of ports inside the container available locally.
 	"forwardPorts": [
 		8888
@@ -25,7 +21,6 @@
 			"onAutoForward": "openBrowserOnce"
 		}
 	},
-
 	"secrets": {
 		"PAYPAL_CLIENT_ID": {
 			"description": "Sandbox client ID of the application.",
@@ -36,7 +31,6 @@
 			"documentationUrl": "https://developer.paypal.com/dashboard/applications/sandbox"
 		}
 	},
-
 	"customizations": {
 		"vscode": {
 			"extensions": [
@@ -47,4 +41,4 @@
 			}
 		}
 	}
-}
+}

.devcontainer/advanced-integration/welcome-message.sh

@@ -7,7 +7,7 @@ WELCOME_MESSAGE="
 
 🛠️  Your environment is fully setup with all the required software.
 
-🚀 Once you rename the \".env.example\" file to \".env\" and update \"CLIENT_ID\" and \"APP_SECRET\", the checkout page will automatically open in the browser after the server is restarted."
+🚀 Once you rename the \".env.example\" file to \".env\" and update \"PAYPAL_CLIENT_ID\" and \"PAYPAL_CLIENT_SECRET\", the checkout page will automatically open in the browser after the server is restarted."
 
 ALTERNATE_WELCOME_MESSAGE="
 👋 Welcome to the \"PayPal Advanced Checkout Integration Example\"
@@ -16,7 +16,7 @@ ALTERNATE_WELCOME_MESSAGE="
 
 🚀 The checkout page will automatically open in the browser after the server is started."
 
-if [ -n "$CLIENT_ID" ] && [ -n "$APP_SECRET" ]; then
+if [ -n "$PAYPAL_CLIENT_ID" ] && [ -n "$PAYPAL_CLIENT_SECRET" ]; then
     WELCOME_MESSAGE="${ALTERNATE_WELCOME_MESSAGE}"
 fi
 

.devcontainer/standard-integration/devcontainer.json

@@ -1,20 +1,16 @@
 // For more details, see https://aka.ms/devcontainer.json.
 {
 	"name": "PayPal Standard Integration",
-	"image": "mcr.microsoft.com/devcontainers/universal:2",
+	"image": "mcr.microsoft.com/devcontainers/javascript-node:20",
 	"workspaceFolder": "/workspaces/${localWorkspaceFolderBasename}/standard-integration",
-
 	// Use 'onCreateCommand' to run commands when creating the container.
 	"onCreateCommand": "bash ../.devcontainer/standard-integration/welcome-message.sh",
-
 	// Use 'postCreateCommand' to run commands after the container is created.
 	"postCreateCommand": "npm install",
-
 	// Use 'postAttachCommand' to run commands when attaching to the container.
 	"postAttachCommand": {
 		"Start server": "npm start"
 	},
-
 	// Use 'forwardPorts' to make a list of ports inside the container available locally.
 	"forwardPorts": [
 		8888
@@ -25,7 +21,6 @@
 			"onAutoForward": "openBrowserOnce"
 		}
 	},
-
 	"secrets": {
 		"PAYPAL_CLIENT_ID": {
 			"description": "Sandbox client ID of the application.",
@@ -36,7 +31,6 @@
 			"documentationUrl": "https://developer.paypal.com/dashboard/applications/sandbox"
 		}
 	},
-
 	"customizations": {
 		"vscode": {
 			"extensions": [
@@ -47,4 +41,4 @@
 			}
 		}
 	}
-}
+}

.devcontainer/standard-integration/welcome-message.sh

@@ -7,7 +7,7 @@ WELCOME_MESSAGE="
 
 🛠️  Your environment is fully setup with all the required software.
 
-🚀 Once you rename the \".env.example\" file to \".env\" and update \"CLIENT_ID\" and \"APP_SECRET\", the checkout page will automatically open in the browser after the server is restarted."
+🚀 Once you rename the \".env.example\" file to \".env\" and update \"PAYPAL_CLIENT_ID\" and \"PAYPAL_CLIENT_SECRET\", the checkout page will automatically open in the browser after the server is restarted."
 
 ALTERNATE_WELCOME_MESSAGE="
 👋 Welcome to the \"PayPal Standard Checkout Integration Example\"
@@ -16,7 +16,7 @@ ALTERNATE_WELCOME_MESSAGE="
 
 🚀 The checkout page will automatically open in the browser after the server is started."
 
-if [ -n "$CLIENT_ID" ] && [ -n "$APP_SECRET" ]; then
+if [ -n "$PAYPAL_CLIENT_ID" ] && [ -n "$PAYPAL_CLIENT_SECRET" ]; then
     WELCOME_MESSAGE="${ALTERNATE_WELCOME_MESSAGE}"
 fi
 

README.md

@@ -38,4 +38,11 @@ Once you've setup a PayPal account, you'll need to obtain a **Client ID** and **
 
 These examples will ask you to run commands like `npm install` and `npm start`.
 
-You'll need a version of node >= 16 which can be downloaded from the [Node.js website](https://nodejs.org/en/download/).
+You'll need a version of node >= 16 which can be downloaded from the [Node.js website](https://nodejs.org/en/download/).
+
+
+### PayPal Codespaces Links
+| Application | Codespaces Link |
+| ---- | ---- |
+| Advanced Integration | [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/paypal-examples/docs-examples?devcontainer_path=.devcontainer%2Fadvanced-integration%2Fdevcontainer.json)|
+| Standard Integration | [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/paypal-examples/docs-examples?devcontainer_path=.devcontainer%2Fstandard-integration%2Fdevcontainer.json)|