Merge pull request #1251 from newrelic/capitalize-nerd-words

chore: Capitalize Nerdlet and Nerdpack

src/markdown-pages/build-apps/create-an-ab-test-application/catalog-info.mdx

@@ -22,7 +22,7 @@ In the last lesson, you finished the A/B test application you've been building t
 
 ## Create catalog information
 
-To supply information to the catalog about your app, you need to create the _catalog_ directory in your nerdpack.
+To supply information to the catalog about your app, you need to create the _catalog_ directory in your Nerdpack.
 
 <Steps>
 

src/markdown-pages/build-apps/create-an-ab-test-application/confirmation-modal.mdx

@@ -250,7 +250,7 @@ export default class EndTestSection extends React.Component {
 
 Your new modal contains a heading, a confirmation message, the winning design version, and two buttons. You'll explore some of these components later in this course.
 
-With your nerdpack served locally, [view your application](https://one.newrelic.com?nerdpacks=local) to see your new `Modal`:
+With your Nerdpack served locally, [view your application](https://one.newrelic.com?nerdpacks=local) to see your new `Modal`:
 
 ![End test modal](../../../images/ab-test/end-test-modal.png)
 

src/markdown-pages/build-apps/create-an-ab-test-application/end-test.mdx

@@ -162,7 +162,7 @@ These items each span one column, but instead of using `columnSpan`, they use a
 
 <Step>
 
-In your Nerdlet's _index.js_ file, add `EndTestSection` to your nerdlet:
+In your Nerdlet's _index.js_ file, add `EndTestSection` to your Nerdlet:
 
 ```js fileName=nerdlets/ab-test-nerdlet/index.js lineHighlight=3,45
 import React from 'react';

src/markdown-pages/build-apps/create-an-ab-test-application/grid.mdx

@@ -41,7 +41,7 @@ cd nru-programmability-course/add-a-grid/ab-test
 
 <Step>
 
-In your Nerdlet's _index.js_ file, import `Grid` and `GridItem`. Then, update your nerdlet's `render()` method by placing each chart in a `GrildItem`. Finally, place all your items in a `Grid`:
+In your Nerdlet's _index.js_ file, import `Grid` and `GridItem`. Then, update your Nerdlet's `render()` method by placing each chart in a `GrildItem`. Finally, place all your items in a `Grid`:
 
 ```js fileName=nerdlets/ab-test-nerdlet/index.js lineHighlight=2,13-28
 import React from 'react';

src/markdown-pages/build-apps/create-an-ab-test-application/nerdstoragevault.mdx

@@ -128,7 +128,7 @@ export default class AbTestNerdletNerdlet extends React.Component {
 }
 ```
 
-Your nerdlet uses this `token` state to manage the authorization token you'll later pass to the third-party service. However, a component's `state` is not a long-term solution for data management. For that, you need `NerdStorageVault`.
+Your Nerdlet uses this `token` state to manage the authorization token you'll later pass to the third-party service. However, a component's `state` is not a long-term solution for data management. For that, you need `NerdStorageVault`.
 
 </Step>
 
@@ -247,7 +247,7 @@ export default class AbTestNerdletNerdlet extends React.Component {
 }
 ```
 
-When you call `storeToken()` with a new token value, your nerdlet uses `NerdGraph` APIs to mutate `NerdStorageVault` data for the `api_token` key. If the request to `NerdGraph` is successful, `storeToken()` updates `state.token` so that the new token is locally accessible.
+When you call `storeToken()` with a new token value, your Nerdlet uses `NerdGraph` APIs to mutate `NerdStorageVault` data for the `api_token` key. If the request to `NerdGraph` is successful, `storeToken()` updates `state.token` so that the new token is locally accessible.
 
 Unlike `NerdStorage`, which has query and mutation components for your convenience, `NerdStorageVault` has no components in the SDK. Instead, you have to use `NerdGraphQuery` and `NerdGraphMutation` to interact with it
 
@@ -693,7 +693,7 @@ class ApiTokenPrompt extends React.Component {
 
 `ApiTokenPrompt` renders a `Modal` with a `TextField`, a `Button`, and an explanatory prompt. You use the `Modal` to enter your API token. It also provides basic error handling if you try to submit the form with no token value.
 
-It's important to distinguish the `token` in `AbTestNerdletNerdlet.state` and the `token` in `ApiTokenPrompt.state`. The `token` in your nerdlet's `state` is the current token that your nerdlet knows about. It's this token that matches what's in `NerdStorageVault`. The `token` in `ApiTokenPrompt.state` is a fluid value that changes as you update the text in the `TextField`. When you press **Submit** in the modal, `ApiTokenPrompt` submits its `token` to your nerdlet's `storeToken()` method. Then, `storeToken()` mutates `NerdStorageVault` with the new token.
+It's important to distinguish the `token` in `AbTestNerdletNerdlet.state` and the `token` in `ApiTokenPrompt.state`. The `token` in your Nerdlet's `state` is the current token that your Nerdlet knows about. It's this token that matches what's in `NerdStorageVault`. The `token` in `ApiTokenPrompt.state` is a fluid value that changes as you update the text in the `TextField`. When you press **Submit** in the modal, `ApiTokenPrompt` submits its `token` to your Nerdlet's `storeToken()` method. Then, `storeToken()` mutates `NerdStorageVault` with the new token.
 
 You also implemented a few methods to improve the user experience:
 
@@ -1000,7 +1000,7 @@ nr1 nerdpack:serve
 
 ![API token prompt](../../../images/ab-test/api-token-prompt.png)
 
-When you visit your application for the first time, the prompt is automatically revealed. Enter "ABC123" in the `TextField`, as that's the token that the third-party service expects. Once you submit your token and your nerdlet hides the prompt, click **Update API token** at the bottom of your New Relic One application to reveal it again:
+When you visit your application for the first time, the prompt is automatically revealed. Enter "ABC123" in the `TextField`, as that's the token that the third-party service expects. Once you submit your token and your Nerdlet hides the prompt, click **Update API token** at the bottom of your New Relic One application to reveal it again:
 
 ![Update API token button](../../../images/ab-test/update-api-token-button.png)
 
@@ -1260,15 +1260,15 @@ export default class TotalCancellations extends React.Component {
 }
 ```
 
-Here, you've implemented another React lifecycle method, called `componentDidUpdate()`. Now, every time your nerdlet's `state.token` changes, `TotalCancellations` gets a new token prop, which triggers `componentDidUpdate()`. In `componentDidUpdate()`, you check that the incoming token is not the same as the last token it knew about, which is stored in local state. If the incoming token is different, you log a message with the new token and update `state.lastToken`.
+Here, you've implemented another React lifecycle method, called `componentDidUpdate()`. Now, every time your Nerdlet's `state.token` changes, `TotalCancellations` gets a new token prop, which triggers `componentDidUpdate()`. In `componentDidUpdate()`, you check that the incoming token is not the same as the last token it knew about, which is stored in local state. If the incoming token is different, you log a message with the new token and update `state.lastToken`.
 
 This logic prepares your code for a future change to use your API token in a request to a third-party service.
 
 </Step>
 
 <Step>
 
-With your nerdpack served locally, [view your application](https://one.newrelic.com?nerdpacks=local) to see the log from `TotalCancellations` in your browser's console:
+With your Nerdpack served locally, [view your application](https://one.newrelic.com?nerdpacks=local) to see the log from `TotalCancellations` in your browser's console:
 
 ![Total cancellations request log](../../../images/ab-test/request-log.png)
 

src/markdown-pages/build-apps/create-an-ab-test-application/nrql-customizations.mdx

@@ -468,7 +468,7 @@ By similar logic, page view data should go to `state.tableData.data[1].count`.
 
 <Step>
 
-With your nerdpack served locally, [view your application](https://one.newrelic.com?nerdpacks=local) to see your charts serving real data:
+With your Nerdpack served locally, [view your application](https://one.newrelic.com?nerdpacks=local) to see your charts serving real data:
 
 ![Your New Relic One application showing real subscription and page view data](../../../images/ab-test/real-table-chart-data.png)
 

src/markdown-pages/build-apps/create-an-ab-test-application/nrql.mdx

@@ -364,7 +364,7 @@ You don't need the `TIMESERIES` clause because the pie chart only shows numerica
 
 <Step>
 
-With your nerdpack served locally, [view your application](https://one.newrelic.com?nerdpacks=local) to see your charts serving real data:
+With your Nerdpack served locally, [view your application](https://one.newrelic.com?nerdpacks=local) to see your charts serving real data:
 
 ![Your New Relic One application showing real subscription totals data](../../../images/ab-test/nr1-app-subscription-totals.png)
 
@@ -449,7 +449,7 @@ Make sure you replace `<YOUR NEW RELIC ACCOUNT ID>` with your actual New Relic [
 
 <Step>
 
-With your nerdpack served locally, [view your application](https://one.newrelic.com?nerdpacks=local) to see your charts serving real data:
+With your Nerdpack served locally, [view your application](https://one.newrelic.com?nerdpacks=local) to see your charts serving real data:
 
 ![Your New Relic One application showing real page view data](../../../images/ab-test/page-views-charts.png)
 

src/markdown-pages/build-apps/create-an-ab-test-application/platform-state-context.mdx

@@ -86,6 +86,12 @@ Make sure you replace `<YOUR NEW RELIC ACCOUNT ID>` with your actual New Relic [
 
 </Callout>
 
+Notice that `NrqlQuery` uses a constant called `ACCOUNT_ID`. Instead of hardcoding an account identifier in your Nerdlet, you can use `accountId` from the platform URL state.
+
+</Step>
+
+<Step>
+
 `PlatformStateContext.Consumer` provides access to the platform's URL state. This context contains an important value you'll use in your app, called `timeRange`.
 
 Notice that your `NrqlQuery` uses a `SINCE` clause that identifies the historical timeframe your query should fetch data from. Right now, that `SINCE` clause is set to `30 MINUTES AGO`. With `timeRange`, you can use the platform's time picker to make this timeframe adjustable.
@@ -270,7 +276,7 @@ Of all the charts in your New Relic One application, these three charts are the
 
 <Step>
 
-While still serving your nerdpack locally, view your NR1 app to see your charts updating with the time range you choose:
+While still serving your Nerdpack locally, view your NR1 app to see your charts updating with the time range you choose:
 
 ![Your charts showing your selected time period](../../../images/ab-test/page-views-time-range.png)
 

src/markdown-pages/build-apps/create-an-ab-test-application/publish.mdx

@@ -26,7 +26,7 @@ Publishing an application requires two key pieces of information:
 - version
 - tag
 
-An application's version identifies the code it contains and is stored in the nerdpack's root-level _package.json_ file. Every time you modify code in your nerdpack and are ready to release it, you'll update the version in _package.json_. For example, if you fix some bugs in the first major version your application code, you might publish the changes under version `1.0.1`.
+An application's version identifies the code it contains and is stored in the Nerdpack's root-level _package.json_ file. Every time you modify code in your Nerdpack and are ready to release it, you'll update the version in _package.json_. For example, if you fix some bugs in the first major version your application code, you might publish the changes under version `1.0.1`.
 
 An app version's tags describe its state. For example, version `0.0.1` of a work-in-progress application might be published with a `DEV` tag to indicate that it's in development.
 

src/markdown-pages/build-apps/create-an-ab-test-application/subscribe.mdx

@@ -131,7 +131,7 @@ If you navigate back to **Apps**, you will see your app in the catalog.
 
 </Steps>
 
-Throughout this course, you've built a New Relic One application from the ground up. You've used the `nr1` CLI to create a nerdpack, launcher, and nerdlet. You've used many components from the SDK. You've learned how to publish, tag, subscribe, and unsubscribe to and from apps in the catalog. You've also learned how to submit metadata to the catalog.
+Throughout this course, you've built a New Relic One application from the ground up. You've used the `nr1` CLI to create a Nerdpack, launcher, and Nerdlet. You've used many components from the SDK. You've learned how to publish, tag, subscribe, and unsubscribe to and from apps in the catalog. You've also learned how to submit metadata to the catalog.
 
 ## Next steps
 

src/markdown-pages/build-apps/create-an-ab-test-application/table-charts.mdx

@@ -17,7 +17,7 @@ Each lesson in the course builds upon the last, so make sure you've completed th
 
 </HideWhenEmbedded>
 
-In each hands-on lesson in this course, you have been adding something new to your A/B test application. You’ve spun up a new launcher and added multiple chart components to your nerdlet. In this lesson, you’ll create two new `TableChart` components that display information about each version of your website, such as the ratio of customers who subscribe to those who unsubscribe. Review your design guide to understand where these tables will fit into your application:
+In each hands-on lesson in this course, you have been adding something new to your A/B test application. You’ve spun up a new launcher and added multiple chart components to your Nerdlet. In this lesson, you’ll create two new `TableChart` components that display information about each version of your website, such as the ratio of customers who subscribe to those who unsubscribe. Review your design guide to understand where these tables will fit into your application:
 
 ![Design guide for chart components](../../../images/ab-test/charts-design-guide.png)