Merge pull request #100043 from archieag/patch-26

Update JS quickstart steps for ready-to-go downloaded sample

Author: shawnmariejones

articles/active-directory/develop/quickstart-v2-javascript.md

@@ -25,9 +25,10 @@ In this quickstart, you use a code sample to learn how a JavaScript single-page
 ## Prerequisites
 
 * Azure subscription - [create one for free](https://azure.microsoft.com/free/?WT.mc_id=A261C142F)
-* [Node.js](https://nodejs.org/en/download/).
+* [Node.js](https://nodejs.org/en/download/)
 * [Visual Studio Code](https://code.visualstudio.com/download) (to edit project files)
 
+
 > [!div renderon="docs"]
 > ## Register and download your quickstart application
 > To start your quickstart application, use either of the following options.
@@ -70,38 +71,39 @@ In this quickstart, you use a code sample to learn how a JavaScript single-page
 
 #### Step 2: Download the project
 
-Select the option that's suitable to your development environment:
+> [!div renderon="docs"]
+> To run the project with a web server by using Node.js, [download the core project files](https://github.com/Azure-Samples/active-directory-javascript-graphapi-v2/archive/quickstart.zip).
 
-* To run the project with a web server by using Node.js, [download the core project files](https://github.com/Azure-Samples/active-directory-javascript-graphapi-v2/archive/quickstart.zip). To open the files, use an editor such as [Visual Studio Code](https://code.visualstudio.com/).
+> [!div renderon="portal"]
+> Run the project with a web server by using Node.js
 
-#### Step 3: Configure your JavaScript app
+> [!div renderon="portal" id="autoupdate" class="nextstepaction"]
+> [Download the code sample]()
 
 > [!div renderon="docs"]
+> #### Step 3: Configure your JavaScript app
+>
 > In the *JavaScriptSPA* folder, edit *authConfig.js*, and set the `clientID` and `authority` values under `msalConfig`.
+> ```javascript
+>
+>  // Config object to be passed to Msal on creation
+>  const msalConfig = {
+>    auth: {
+>      clientId: "Enter_the_Application_Id_Here",
+>      authority: "Enter_the_Cloud_Instance_Id_HereEnter_the_Tenant_Info_Here",
+>      redirectUri: "Enter_the_Redirect_Uri_Here",
+>    },
+>    cache: {
+>      cacheLocation: "sessionStorage", // This configures where your cache will be stored
+>      storeAuthStateInCookie: false, // Set this to "true" if you are having issues on IE11 or Edge
+>      forceRefresh: false // Set this to "true" to skip a cached token and go to the server to get a new
+>    }
+>  };  
+> ```
 
-> [!div class="sxs-lookup" renderon="portal"]
-> In the *JavaScriptSPA* folder, edit *authConfig.js*, and replace `msalConfig` with the following code:
-
-```javascript
-
-  // Config object to be passed to Msal on creation
-  const msalConfig = {
-    auth: {
-      clientId: "Enter_the_Application_Id_Here",
-      authority: "Enter_the_Cloud_Instance_Id_HereEnter_the_Tenant_Info_Here",
-      redirectUri: "Enter_the_Redirect_Uri_Here",
-    },
-    cache: {
-      cacheLocation: "sessionStorage", // This configures where your cache will be stored
-      storeAuthStateInCookie: false, // Set this to "true" if you are having issues on IE11 or Edge
-      forceRefresh: false // Set this to "true" to skip a cached token and go to the server to get a new
-    }
-  };  
-
-```
 > [!div renderon="portal"]
 > > [!NOTE]
-> > This quickstart supports Enter_the_Supported_Account_Info_Here.
+> > Enter_the_Supported_Account_Info_Here
 
 > [!div renderon="docs"]
 >
@@ -116,19 +118,22 @@ Select the option that's suitable to your development environment:
 > > [!TIP]
 > > To find the values of **Application (client) ID**, **Directory (tenant) ID**, and **Supported account types**, go to the app's **Overview** page in the Azure portal.
 >
+> [!div class="sxs-lookup" renderon="portal"]
+> #### Step 3: Your app is configured and ready to run
+> We have configured your project with values of your app's properties. 
 
-#### Step 4: Run the project
+> [!div renderon="docs"]
+> #### Step 4: Run the project
 
-If you're using [Node.js](https://nodejs.org/en/download/):
+Run the project with a web server by using [Node.js](https://nodejs.org/en/download/):
 
 1. To start the server, run the following command from the project directory:
-
-   ```batch
-   npm install
-   npm start
-   ```
-
+    ```batch
+    npm install
+    npm start
+    ```
 1. Open a web browser and go to `http://localhost:3000/`.
+
 1. Select **Sign In** to start the sign-in, and then call Microsoft Graph API.
 
 After the browser loads the application, select **Sign In**. The first time that you sign in, you're prompted to provide your consent to allow the application to access your profile and to sign you in. After you're signed in successfully, your user profile information should be displayed on the page.