diff --git a/adev/src/content/tutorials/first-app/steps/05-inputs/README.md b/adev/src/content/tutorials/first-app/steps/05-inputs/README.md
index ffc276f9361..e15c0e15fe1 100644
--- a/adev/src/content/tutorials/first-app/steps/05-inputs/README.md
+++ b/adev/src/content/tutorials/first-app/steps/05-inputs/README.md
@@ -21,9 +21,9 @@ Learn more in the [Accepting data with input properties](guide/components/inputs
 <docs-workflow>
 
 <docs-step title="Import the input() function">
-In the code editor, import the `input` helper method from `@angular/core` and the `HousingLocation` component.
+In the code editor, import the `input` helper method from `@angular/core` into the `HousingLocation` component.
 
-<docs-code header="Import HousingLocation and Input in housing-location.ts" path="adev/src/content/tutorials/first-app/steps/06-property-binding/src/app/housing-location/housing-location.ts" visibleLines="[1]"/>
+<docs-code header="Import input in housing-location.ts" path="adev/src/content/tutorials/first-app/steps/06-property-binding/src/app/housing-location/housing-location.ts" visibleLines="[1]"/>
 
 </docs-step>
 
@@ -32,14 +32,14 @@ Add a required property called `housingLocation` and initialize it using `input.
 
   <docs-code header="Declare the input property in housing-location.ts" path="adev/src/content/tutorials/first-app/steps/06-property-binding/src/app/housing-location/housing-location.ts" visibleLines="[12]"/>
 
-You have to invoked the  `required` method on `input` to indicate that the parent component must provide a value. In our example application, we know this value will always be passed in — this is by design. The `.required()` call ensures that the TypeScript compiler enforces this and treats the property as non-nullable when this component is used in a template.
+You have to invoke the `required` method on `input` to indicate that the parent component must provide a value. In our example application, we know this value will always be passed in — this is by design. The `.required()` call ensures that the TypeScript compiler enforces this and treats the property as non-nullable when this component is used in a template.
 
 </docs-step>
 
 <docs-step title="Pass data to the input">
 Send the `housingLocation` value from the `Home` component to the `housingLocation` property of the HousingLocation component.
 
-<docs-code header="Declare the input property in housing-location.ts" path="adev/src/content/tutorials/first-app/steps/06-property-binding/src/app/home/home.ts" visibleLines="[16]"/>
+<docs-code header="Declare the input property for HousingLocation in home.ts" path="adev/src/content/tutorials/first-app/steps/06-property-binding/src/app/home/home.ts" visibleLines="[16]"/>
 
 </docs-step>
 
diff --git a/adev/src/content/tutorials/first-app/steps/07-dynamic-template-values/README.md b/adev/src/content/tutorials/first-app/steps/07-dynamic-template-values/README.md
index 0eded217b91..e9d294a562f 100644
--- a/adev/src/content/tutorials/first-app/steps/07-dynamic-template-values/README.md
+++ b/adev/src/content/tutorials/first-app/steps/07-dynamic-template-values/README.md
@@ -11,9 +11,9 @@ This tutorial lesson demonstrates how to add interpolation to Angular templates
 
 ## Conceptual preview of interpolation
 
-In this step you will display values (properties and `Input` values) in a template using interpolation.
+In this step you will display values read from `input` properties in a template using interpolation.
 
-Using the `{{ expression }}` in Angular templates, you can render values from properties, `Inputs` and valid JavaScript expressions.
+Using the `{{ expression }}` in Angular templates, you can render values from properties, `inputs`, and valid JavaScript expressions.
 
 For a more in depth explanation, please refer to the [Displaying values with interpolation](guide/templates/binding#render-dynamic-text-with-text-interpolation) guide.
 
@@ -27,7 +27,7 @@ In the code editor:
 1.  Navigate to `src/app/housing-location/housing-location.ts`
 1.  In the template property of the `@Component` decorator, replace the existing HTML markup with the following code:
 
-<docs-code header="Update HousingLocation template" path="adev/src/content/tutorials/first-app/steps/08-ngFor/src/app/housing-location/housing-location.ts" visibleLines="[6,17]"/>
+<docs-code header="Update HousingLocation template in housing-location.ts" path="adev/src/content/tutorials/first-app/steps/08-ngFor/src/app/housing-location/housing-location.ts" visibleLines="[6,17]"/>
 
   In this updated template code you have used property binding to bind the `housingLocation.photo` to the `src` attribute. The `alt` attribute uses interpolation to give more context to the alt text of the image.
 
diff --git a/adev/src/content/tutorials/first-app/steps/08-ngFor/README.md b/adev/src/content/tutorials/first-app/steps/08-ngFor/README.md
index d9bcdb77c54..9ecc63e52bc 100644
--- a/adev/src/content/tutorials/first-app/steps/08-ngFor/README.md
+++ b/adev/src/content/tutorials/first-app/steps/08-ngFor/README.md
@@ -27,7 +27,7 @@ In the `Home` there is only a single housing location. In this step, you will ad
 
 1. In `src/app/home/home.ts`, remove the `housingLocation` property from the `Home` class.
 1. Update the `Home` class to have a property called `housingLocationList`. Update your code to match the following code:
-    <docs-code header="Add housingLocationList property" path="adev/src/content/tutorials/first-app/steps/09-services/src/app/home/home.ts" visibleLines="26-131"/>
+    <docs-code header="Add housingLocationList property in home.ts" path="adev/src/content/tutorials/first-app/steps/09-services/src/app/home/home.ts" visibleLines="26-131"/>
 
     IMPORTANT: Do not remove the `@Component` decorator, you will update that code in an upcoming step.
 
@@ -37,7 +37,7 @@ In the `Home` there is only a single housing location. In this step, you will ad
 Now the app has a dataset that you can use to display the entries in the browser using the `@for` block.
 
 1. Update the `<app-housing-location>` tag in the template code to this:
-    <docs-code header="Add @for to Home template" path="adev/src/content/tutorials/first-app/steps/09-services/src/app/home/home.ts" visibleLines="[14,20]"/>
+    <docs-code header="Add @for to Home template in home.ts" path="adev/src/content/tutorials/first-app/steps/09-services/src/app/home/home.ts" visibleLines="[15,19]"/>
 
     Note, in the code `[housingLocation] = "housingLocation"` the `housingLocation` value now refers to the variable used in the `@for` block. Before this change, it referred to the property on the `Home` class.
 
diff --git a/adev/src/content/tutorials/first-app/steps/11-details-page/README.md b/adev/src/content/tutorials/first-app/steps/11-details-page/README.md
index 775b606c7af..09b4790c6f5 100644
--- a/adev/src/content/tutorials/first-app/steps/11-details-page/README.md
+++ b/adev/src/content/tutorials/first-app/steps/11-details-page/README.md
@@ -29,7 +29,7 @@ In this case, `:id` is dynamic and will change based on how the route is request
 
 1. In `src/app/housing-location/housing-location.ts`, add an anchor tag to the `section` element and include the `routerLink` directive:
 
-    <docs-code header="Add anchor with a routerLink directive to housing-location.ts" path="adev/src/content/tutorials/first-app/steps/12-forms/src/app/housing-location/housing-location.ts" visibleLines="[19]"/>
+    <docs-code header="Add anchor with a routerLink directive to housing-location.ts" path="adev/src/content/tutorials/first-app/steps/12-forms/src/app/housing-location/housing-location.ts" visibleLines="[18]"/>
 
     The `routerLink` directive enables Angular's router to create dynamic links in the application. The value assigned to the `routerLink` is an array with two entries: the static portion of the path and the dynamic data.
 
@@ -57,11 +57,11 @@ In this step, you will get the route parameter in the `Details`. Currently, the
 
     <docs-code language="javascript">
     export class Details {
-        route: ActivatedRoute = inject(ActivatedRoute);
-        housingLocationId = -1;
-        constructor() {
-            this.housingLocationId = Number(this.route.snapshot.params['id']);
-        }
+      route: ActivatedRoute = inject(ActivatedRoute);
+      housingLocationId = -1;
+      constructor() {
+        this.housingLocationId = Number(this.route.snapshot.params['id']);
+      }
     }
     </docs-code>
 
@@ -93,7 +93,10 @@ To access the data you will add a call to the `HousingService`.
 
     <docs-code header="Add styles for the Details" path="adev/src/content/tutorials/first-app/steps/12-forms/src/app/details/details.css" visibleLines="[1,71]"/>
 
-1. Save your changes.
+    and save your changes
+
+1. In `Details` use the just created `details.css` file as the source for the styles: 
+    <docs-code header="Update details.ts to use the created css file" path="adev/src/content/tutorials/first-app/steps/12-forms/src/app/details/details.ts" visibleLines="[30]"/>
 
 1. In the browser refresh the page and confirm that when you click on the "Learn More" link for a given housing location the details page displays the correct information based on the data for that selected item.
 
@@ -101,14 +104,14 @@ To access the data you will add a call to the `HousingService`.
 
 </docs-step>
 
-<docs-step title="Add navigation to the `Home`">
+<docs-step title="Check navigation in the `Home`">
 In a previous lesson you updated the `App` template to include a `routerLink`. Adding that code updated your app to enable navigation back to the `Home` whenever the logo is clicked.
 
 1. Confirm that your code matches the following:
 
-    <docs-code header="Add routerLink to App" path="adev/src/content/tutorials/first-app/steps/12-forms/src/app/app.ts" visibleLines="[8,19]"/>
+    <docs-code header="Confirm the routerLink in app.ts" path="adev/src/content/tutorials/first-app/steps/12-forms/src/app/app.ts" visibleLines="[8,19]"/>
 
-    Your code may already be up-to-date but confirm to be sure.
+    Your code should already be up-to-date but confirm to be sure.
 </docs-step>
 
 </docs-workflow>
diff --git a/adev/src/content/tutorials/first-app/steps/13-search/README.md b/adev/src/content/tutorials/first-app/steps/13-search/README.md
index fd5e0687eed..d9726574356 100644
--- a/adev/src/content/tutorials/first-app/steps/13-search/README.md
+++ b/adev/src/content/tutorials/first-app/steps/13-search/README.md
@@ -20,13 +20,13 @@ In this step, you'll update the `Home` class to store data in a new array proper
 
 1. In `src/app/home/home.ts`, add new property to the class called `filteredLocationList`.
 
-   <docs-code header="Add the filtered results property" path="adev/src/content/tutorials/first-app/steps/14-http/src/app/home/home.ts" visibleLines="[29]"/>
+   <docs-code header="Add the filteredLocationList property in home.ts" path="adev/src/content/tutorials/first-app/steps/14-http/src/app/home/home.ts" visibleLines="[27]"/>
 
    The `filteredLocationList` hold the values that match the search criteria entered by the user.
 
 1. The `filteredLocationList` should contain the total set of housing locations values by default when the page loads. Update the `constructor` for the `Home` to set the value.
 
-<docs-code header="Set the value of filteredLocationList" path="adev/src/content/tutorials/first-app/steps/14-http/src/app/home/home.ts" visibleLines="[29,32]"/>
+   <docs-code header="Set the value of filteredLocationList" path="adev/src/content/tutorials/first-app/steps/14-http/src/app/home/home.ts" visibleLines="[29,32]"/>
 
 </docs-step>
 
@@ -35,27 +35,18 @@ The `Home` already contains an input field that you will use to capture input fr
 
 1. Update the `Home` template to include a template variable in the `input` element called `#filter`.
 
-   <docs-code header="Add a template variable to Home's template" language="html">
-       <input type="text" placeholder="Filter by city" #filter>
-   </docs-code>
-
+   <docs-code header="Add a template variable to the input HTML element in home.ts" path="adev/src/content/tutorials/first-app/steps/14-http/src/app/home/home.ts" visibleLines="[12]"/>
    This example uses a [template reference variable](guide/templates) to get access to the `input` element as its value.
 
 1. Next, update the component template to attach an event handler to the "Search" button.
 
-   <docs-code header="Bind the click event" language="html">
-       <button class="primary" type="button" (click)="filterResults(filter.value)">Search</button>
-   </docs-code>
+   <docs-code header="Bind the button click event to a method in home.ts" path="adev/src/content/tutorials/first-app/steps/14-http/src/app/home/home.ts" visibleLines="[13]"/>
 
    By binding to the `click` event on the `button` element, you are able to call the `filterResults` function. The argument to the function is the `value` property of the `filter` template variable. Specifically, the `.value` property from the `input` HTML element.
 
-1. The last template update is to the `ngFor` directive. Update the `ngFor` value to iterate over values from the `filteredLocationList` array.
+1. The last template update is to the `@for` directive. Update the `@for` to iterate over values from the `filteredLocationList` array.
 
-<docs-code header="Update the ngFor directive value" language="html">
-@for(housingLocation of housingLocationList; track $index) {
-   <app-housing-location [housingLocation]="housingLocation"></app-housing-location>
-}
-</docs-code>
+   <docs-code header="Update the @for template directive in home.ts" path="adev/src/content/tutorials/first-app/steps/14-http/src/app/home/home.ts" visibleLines="[17,19]" language="html"/>
 
 </docs-step>
 
diff --git a/adev/src/content/tutorials/first-app/steps/14-http/README.md b/adev/src/content/tutorials/first-app/steps/14-http/README.md
index 9c0502f350b..c9bd6e91195 100644
--- a/adev/src/content/tutorials/first-app/steps/14-http/README.md
+++ b/adev/src/content/tutorials/first-app/steps/14-http/README.md
@@ -26,110 +26,110 @@ JSON Server is an open source tool used to create mock REST APIs. You'll use it
 
 1. Open `db.json` and copy the following code into the file
     <docs-code language="json">
+    {
+      "locations": [
         {
-            "locations": [
-                {
-                    "id": 0,
-                    "name": "Acme Fresh Start Housing",
-                    "city": "Chicago",
-                    "state": "IL",
-                    "photo": "https://angular.dev/assets/images/tutorials/common/bernard-hermant-CLKGGwIBTaY-unsplash.jpg",
-                    "availableUnits": 4,
-                    "wifi": true,
-                    "laundry": true
-                },
-                {
-                    "id": 1,
-                    "name": "A113 Transitional Housing",
-                    "city": "Santa Monica",
-                    "state": "CA",
-                    "photo": "https://angular.dev/assets/images/tutorials/common/brandon-griggs-wR11KBaB86U-unsplash.jpg",
-                    "availableUnits": 0,
-                    "wifi": false,
-                    "laundry": true
-                },
-                {
-                    "id": 2,
-                    "name": "Warm Beds Housing Support",
-                    "city": "Juneau",
-                    "state": "AK",
-                    "photo": "https://angular.dev/assets/images/tutorials/common/i-do-nothing-but-love-lAyXdl1-Wmc-unsplash.jpg",
-                    "availableUnits": 1,
-                    "wifi": false,
-                    "laundry": false
-                },
-                {
-                    "id": 3,
-                    "name": "Homesteady Housing",
-                    "city": "Chicago",
-                    "state": "IL",
-                    "photo": "https://angular.dev/assets/images/tutorials/common/ian-macdonald-W8z6aiwfi1E-unsplash.jpg",
-                    "availableUnits": 1,
-                    "wifi": true,
-                    "laundry": false
-                },
-                {
-                    "id": 4,
-                    "name": "Happy Homes Group",
-                    "city": "Gary",
-                    "state": "IN",
-                    "photo": "https://angular.dev/assets/images/tutorials/common/krzysztof-hepner-978RAXoXnH4-unsplash.jpg",
-                    "availableUnits": 1,
-                    "wifi": true,
-                    "laundry": false
-                },
-                {
-                    "id": 5,
-                    "name": "Hopeful Apartment Group",
-                    "city": "Oakland",
-                    "state": "CA",
-                    "photo": "https://angular.dev/assets/images/tutorials/common/r-architecture-JvQ0Q5IkeMM-unsplash.jpg",
-                    "availableUnits": 2,
-                    "wifi": true,
-                    "laundry": true
-                },
-                {
-                    "id": 6,
-                    "name": "Seriously Safe Towns",
-                    "city": "Oakland",
-                    "state": "CA",
-                    "photo": "https://angular.dev/assets/images/tutorials/common/phil-hearing-IYfp2Ixe9nM-unsplash.jpg",
-                    "availableUnits": 5,
-                    "wifi": true,
-                    "laundry": true
-                },
-                {
-                    "id": 7,
-                    "name": "Hopeful Housing Solutions",
-                    "city": "Oakland",
-                    "state": "CA",
-                    "photo": "https://angular.dev/assets/images/tutorials/common/r-architecture-GGupkreKwxA-unsplash.jpg",
-                    "availableUnits": 2,
-                    "wifi": true,
-                    "laundry": true
-                },
-                {
-                    "id": 8,
-                    "name": "Seriously Safe Towns",
-                    "city": "Oakland",
-                    "state": "CA",
-                    "photo": "https://angular.dev/assets/images/tutorials/common/saru-robert-9rP3mxf8qWI-unsplash.jpg",
-                    "availableUnits": 10,
-                    "wifi": false,
-                    "laundry": false
-                },
-                {
-                    "id": 9,
-                    "name": "Capital Safe Towns",
-                    "city": "Portland",
-                    "state": "OR",
-                    "photo": "https://angular.dev/assets/images/tutorials/common/webaliser-_TPTXZd9mOo-unsplash.jpg",
-                    "availableUnits": 6,
-                    "wifi": true,
-                    "laundry": true
-                }
-            ]
+          "id": 0,
+          "name": "Acme Fresh Start Housing",
+          "city": "Chicago",
+          "state": "IL",
+          "photo": "https://angular.dev/assets/images/tutorials/common/bernard-hermant-CLKGGwIBTaY-unsplash.jpg",
+          "availableUnits": 4,
+          "wifi": true,
+          "laundry": true
+        },
+        {
+          "id": 1,
+          "name": "A113 Transitional Housing",
+          "city": "Santa Monica",
+          "state": "CA",
+          "photo": "https://angular.dev/assets/images/tutorials/common/brandon-griggs-wR11KBaB86U-unsplash.jpg",
+          "availableUnits": 0,
+          "wifi": false,
+          "laundry": true
+        },
+        {
+          "id": 2,
+          "name": "Warm Beds Housing Support",
+          "city": "Juneau",
+          "state": "AK",
+          "photo": "https://angular.dev/assets/images/tutorials/common/i-do-nothing-but-love-lAyXdl1-Wmc-unsplash.jpg",
+          "availableUnits": 1,
+          "wifi": false,
+          "laundry": false
+        },
+        {
+          "id": 3,
+          "name": "Homesteady Housing",
+          "city": "Chicago",
+          "state": "IL",
+          "photo": "https://angular.dev/assets/images/tutorials/common/ian-macdonald-W8z6aiwfi1E-unsplash.jpg",
+          "availableUnits": 1,
+          "wifi": true,
+          "laundry": false
+        },
+        {
+          "id": 4,
+          "name": "Happy Homes Group",
+          "city": "Gary",
+          "state": "IN",
+          "photo": "https://angular.dev/assets/images/tutorials/common/krzysztof-hepner-978RAXoXnH4-unsplash.jpg",
+          "availableUnits": 1,
+          "wifi": true,
+          "laundry": false
+        },
+        {
+          "id": 5,
+          "name": "Hopeful Apartment Group",
+          "city": "Oakland",
+          "state": "CA",
+          "photo": "https://angular.dev/assets/images/tutorials/common/r-architecture-JvQ0Q5IkeMM-unsplash.jpg",
+          "availableUnits": 2,
+          "wifi": true,
+          "laundry": true
+        },
+        {
+          "id": 6,
+          "name": "Seriously Safe Towns",
+          "city": "Oakland",
+          "state": "CA",
+          "photo": "https://angular.dev/assets/images/tutorials/common/phil-hearing-IYfp2Ixe9nM-unsplash.jpg",
+          "availableUnits": 5,
+          "wifi": true,
+          "laundry": true
+        },
+        {
+          "id": 7,
+          "name": "Hopeful Housing Solutions",
+          "city": "Oakland",
+          "state": "CA",
+          "photo": "https://angular.dev/assets/images/tutorials/common/r-architecture-GGupkreKwxA-unsplash.jpg",
+          "availableUnits": 2,
+          "wifi": true,
+          "laundry": true
+        },
+        {
+          "id": 8,
+          "name": "Seriously Safe Towns",
+          "city": "Oakland",
+          "state": "CA",
+          "photo": "https://angular.dev/assets/images/tutorials/common/saru-robert-9rP3mxf8qWI-unsplash.jpg",
+          "availableUnits": 10,
+          "wifi": false,
+          "laundry": false
+        },
+        {
+          "id": 9,
+          "name": "Capital Safe Towns",
+          "city": "Portland",
+          "state": "OR",
+          "photo": "https://angular.dev/assets/images/tutorials/common/webaliser-_TPTXZd9mOo-unsplash.jpg",
+          "availableUnits": 6,
+          "wifi": true,
+          "laundry": true
         }
+      ]
+    }
     </docs-code>
 
 1. Save this file.
@@ -150,33 +150,31 @@ The data source has been configured, the next step is to update your web app to
 
 1. In `src/app/housing.service.ts`, make the following changes:
 
-    1. Update the code to remove `housingLocationList` property and the array containing the data.
+1. Update the code to remove `housingLocationList` property and the array containing the data, as well as the `baseUrl` property.
 
-    1. Add a string property called `url` and set its value to `'http://localhost:3000/locations'`
+1. Add a string property called `url` and set its value to `'http://localhost:3000/locations'`
 
-        <docs-code language="javascript">
-        url = 'http://localhost:3000/locations';
-        </docs-code>
+    <docs-code header="Add url property to housing.service.ts" path="adev/src/content/tutorials/first-app/steps/14-http/src-final/app/housing.service.ts" visibleLines="[8]"/>
 
-        This code will result in errors in the rest of the file because it depends on the `housingLocationList` property. We're going to update the service methods next.
+    This code will result in errors in the rest of the file because it depends on the `housingLocationList` property. We're going to update the service methods next.
 
-    1. Update the `getAllHousingLocations` function to make a call to the web server you configured.
+1. Update the `getAllHousingLocations` function to make a call to the web server you configured.
 
-        <docs-code header="" path="adev/src/content/tutorials/first-app/steps/14-http/src-final/app/housing.service.ts" visibleLines="[10,13]"/>
+    <docs-code header="Update the getAllHousingLocations method in housing.service.ts" path="adev/src/content/tutorials/first-app/steps/14-http/src-final/app/housing.service.ts" visibleLines="[10,13]"/>
 
-        The code now uses asynchronous code to make a **GET** request over HTTP.
+    The code now uses asynchronous code to make a **GET** request over HTTP.
 
-        HELPFUL: For this example, the code uses `fetch`. For more advanced use cases consider using `HttpClient` provided by Angular.
+   HELPFUL: For this example, the code uses `fetch`. For more advanced use cases consider using `HttpClient` provided by Angular.
 
-    1. Update the `getHousingLocationsById` function to make a call to the web server you configured.
-  
-       HELPFUL: Notice the `fetch` method has been updated to _query_ the data for location with a matching `id` property value. See [URL Search Parameter](https://developer.mozilla.org/en-US/docs/Web/API/URL/search) for more information.
+1. Update the `getHousingLocationsById` function to make a call to the web server you configured.
 
-        <docs-code header="" path="adev/src/content/tutorials/first-app/steps/14-http/src-final/app/housing.service.ts" visibleLines="[15,19]"/>
+   HELPFUL: Notice the `fetch` method has been updated to _query_ the data for location with a matching `id` property value. See [URL Search Parameter](https://developer.mozilla.org/en-US/docs/Web/API/URL/search) for more information.
 
-    1. Once all the updates are complete, your updated service should match the following code.
+    <docs-code header="Update the getHousingLocationById method in housing.service.ts" path="adev/src/content/tutorials/first-app/steps/14-http/src-final/app/housing.service.ts" visibleLines="[15,19]"/>
 
-        <docs-code header="Final version of housing.service.ts" path="adev/src/content/tutorials/first-app/steps/14-http/src-final/app/housing.service.ts" visibleLines="[1,25]" />
+1. Once all the updates are complete, your updated service should match the following code.
+
+    <docs-code header="Final version of housing.service.ts" path="adev/src/content/tutorials/first-app/steps/14-http/src-final/app/housing.service.ts" visibleLines="[1,25]" />
 
 </docs-step>
 
@@ -185,12 +183,11 @@ The server is now reading data from the HTTP request but the components that rel
 
 1. In `src/app/home/home.ts`, update the `constructor` to use the new asynchronous version of the `getAllHousingLocations` method.
 
-    <docs-code header="" path="adev/src/content/tutorials/first-app/steps/14-http/src-final/app/home/home.ts" visibleLines="[29,36]"/>
+    <docs-code header="Update constructor in home.ts" path="adev/src/content/tutorials/first-app/steps/14-http/src-final/app/home/home.ts" visibleLines="[29,36]"/>
 
 1. In `src/app/details/details.ts`, update the `constructor` to use the new asynchronous version of the `getHousingLocationById` method.
 
-    <docs-code header="" path="adev/src/content/tutorials/first-app/steps/14-http/src-final/app/details/details.ts" visibleLines="[59,64]"/>
-
+    <docs-code header="Update constructor in details.ts" path="adev/src/content/tutorials/first-app/steps/14-http/src-final/app/details/details.ts" visibleLines="[59,64]"/>
 2. Save your code.
 
 3. Open the application in the browser and confirm that it runs without any errors.
diff --git a/adev/src/content/tutorials/first-app/steps/14-http/src-final/app/home/home.ts b/adev/src/content/tutorials/first-app/steps/14-http/src-final/app/home/home.ts
index a4a967e27e0..6949c27ea75 100644
--- a/adev/src/content/tutorials/first-app/steps/14-http/src-final/app/home/home.ts
+++ b/adev/src/content/tutorials/first-app/steps/14-http/src-final/app/home/home.ts
@@ -14,7 +14,7 @@ import {HousingService} from '../housing.service';
       </form>
     </section>
     <section class="results">
-      @for(housingLocation of housingLocationList; track $index) {
+      @for(housingLocation of filteredLocationList; track $index) {
         <app-housing-location [housingLocation]="housingLocation"></app-housing-location>
       }
     </section>
diff --git a/adev/src/content/tutorials/first-app/steps/14-http/src/app/home/home.ts b/adev/src/content/tutorials/first-app/steps/14-http/src/app/home/home.ts
index fa9fe91d856..7f8e1ed01b1 100644
--- a/adev/src/content/tutorials/first-app/steps/14-http/src/app/home/home.ts
+++ b/adev/src/content/tutorials/first-app/steps/14-http/src/app/home/home.ts
@@ -14,7 +14,7 @@ import {HousingService} from '../housing.service';
       </form>
     </section>
     <section class="results">
-      @for(housingLocation of housingLocationList; track $index) {
+      @for(housingLocation of filteredLocationList; track $index) {
         <app-housing-location [housingLocation]="housingLocation"></app-housing-location>
       }
     </section>
diff --git a/adev/src/content/tutorials/learn-angular/steps/11-optimizing-images/README.md b/adev/src/content/tutorials/learn-angular/steps/11-optimizing-images/README.md
index 6c085fe927c..f40d54d5e2e 100644
--- a/adev/src/content/tutorials/learn-angular/steps/11-optimizing-images/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/11-optimizing-images/README.md
@@ -35,7 +35,8 @@ To enable the `NgOptimizedImage` directive, swap out the `src` attribute for `ng
 import { NgOptimizedImage } from '@angular/common';
 
 @Component({
-template: `     ...
+  template: `
+    ...
     <li>
       Static Image:
       <img ngSrc="/assets/logo.svg" alt="Angular logo" width="32" height="32" />
@@ -46,7 +47,7 @@ template: `     ...
     </li>
     ...
   `,
-imports: [NgOptimizedImage],
+  imports: [NgOptimizedImage],
 })
 </docs-code>
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/12-enable-routing/README.md b/adev/src/content/tutorials/learn-angular/steps/12-enable-routing/README.md
index 3009baa3143..fd0fbfef48c 100644
--- a/adev/src/content/tutorials/learn-angular/steps/12-enable-routing/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/12-enable-routing/README.md
@@ -39,7 +39,7 @@ import {provideRouter} from '@angular/router';
 import {routes} from './app.routes';
 
 export const appConfig: ApplicationConfig = {
-providers: [provideRouter(routes)],
+  providers: [provideRouter(routes)],
 };
 </docs-code>
 
@@ -55,15 +55,16 @@ Update the template for `App` by adding `<router-outlet />`
 import {RouterOutlet} from '@angular/router';
 
 @Component({
-...
-template: `     <nav>
+  ...
+  template: `
+    <nav>
       <a href="/">Home</a>
       |
       <a href="/user">User</a>
     </nav>
     <router-outlet />
   `,
-imports: [RouterOutlet],
+  imports: [RouterOutlet],
 })
 export class App {}
 </docs-code>
diff --git a/adev/src/content/tutorials/learn-angular/steps/13-define-a-route/README.md b/adev/src/content/tutorials/learn-angular/steps/13-define-a-route/README.md
index 61fc58fb0d9..307ede1c9e3 100644
--- a/adev/src/content/tutorials/learn-angular/steps/13-define-a-route/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/13-define-a-route/README.md
@@ -21,7 +21,6 @@ To define a route, add a route object to the `routes` array in `app.routes.ts` t
 
 ```ts
 import {Routes} from '@angular/router';
-
 import {Home} from './home/home';
 
 export const routes: Routes = [
@@ -46,15 +45,14 @@ In `app.routes.ts`, add the `title` property to the default route (`path: ''`) a
 
 <docs-code language="ts" highlight="[8]">
 import {Routes} from '@angular/router';
-
 import {Home} from './home/home';
 
 export const routes: Routes = [
-{
-path: '',
-title: 'App Home Page',
-component: Home,
-},
+  {
+    path: '',
+    title: 'App Home Page',
+    component: Home,
+  },
 ];
 </docs-code>
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/15-forms/README.md b/adev/src/content/tutorials/learn-angular/steps/15-forms/README.md
index e58201ad60a..29544a418c4 100644
--- a/adev/src/content/tutorials/learn-angular/steps/15-forms/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/15-forms/README.md
@@ -36,8 +36,8 @@ import {Component} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 
 @Component({
-...
-imports: [FormsModule],
+  ...
+  imports: [FormsModule],
 })
 export class User {}
 </docs-code>
diff --git a/adev/src/content/tutorials/learn-angular/steps/16-form-control-values/README.md b/adev/src/content/tutorials/learn-angular/steps/16-form-control-values/README.md
index c8ac0f1f84d..531058c09d1 100644
--- a/adev/src/content/tutorials/learn-angular/steps/16-form-control-values/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/16-form-control-values/README.md
@@ -51,9 +51,9 @@ export class User {
   favoriteFramework = '';
   ...
 
-showFramework() {
-alert(this.favoriteFramework);
-}
+  showFramework() {
+    alert(this.favoriteFramework);
+  }
 }
 </docs-code>
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/19-creating-an-injectable-service/README.md b/adev/src/content/tutorials/learn-angular/steps/19-creating-an-injectable-service/README.md
index d5c0f685902..88aafe5cde9 100644
--- a/adev/src/content/tutorials/learn-angular/steps/19-creating-an-injectable-service/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/19-creating-an-injectable-service/README.md
@@ -14,10 +14,10 @@ To make a service eligible to be injected by the DI system use the `@Injectable`
 
 <docs-code language="ts" highlight="[1, 2, 3]">
 @Injectable({
-    providedIn: 'root'
+  providedIn: 'root'
 })
 class UserService {
-    // methods to retrieve and return data
+  // methods to retrieve and return data
 }
 </docs-code>
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/20-inject-based-di/README.md b/adev/src/content/tutorials/learn-angular/steps/20-inject-based-di/README.md
index c0f01583aa0..e02e67ec6c2 100644
--- a/adev/src/content/tutorials/learn-angular/steps/20-inject-based-di/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/20-inject-based-di/README.md
@@ -13,7 +13,7 @@ It is often helpful to initialize class properties with values provided by the D
 <docs-code language="ts" highlight="[3]">
 @Component({...})
 class PetCareDashboard {
-    petRosterService = inject(PetRosterService);
+  petRosterService = inject(PetRosterService);
 }
 </docs-code>
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/22-pipes/README.md b/adev/src/content/tutorials/learn-angular/steps/22-pipes/README.md
index 7ffde709cbb..08d243af67a 100644
--- a/adev/src/content/tutorials/learn-angular/steps/22-pipes/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/22-pipes/README.md
@@ -14,12 +14,12 @@ To use a pipe in a template include it in an interpolated expression. Check out
 import {UpperCasePipe} from '@angular/common';
 
 @Component({
-...
-template: `{{ loudMessage | uppercase }}`,
-imports: [UpperCasePipe],
+  ...
+  template: `{{ loudMessage | uppercase }}`,
+  imports: [UpperCasePipe],
 })
 class App {
-loudMessage = 'we think you are doing great!'
+  loudMessage = 'we think you are doing great!'
 }
 </docs-code>
 
@@ -41,8 +41,8 @@ Next, update `@Component()` decorator `imports` to include a reference to `Lower
 
 <docs-code language="ts" highlight="[3]">
 @Component({
-    ...
-    imports: [LowerCasePipe]
+  ...
+  imports: [LowerCasePipe]
 })
 </docs-code>
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/23-pipes-format-data/README.md b/adev/src/content/tutorials/learn-angular/steps/23-pipes-format-data/README.md
index b0df4b440c1..07cfe9e69a8 100644
--- a/adev/src/content/tutorials/learn-angular/steps/23-pipes-format-data/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/23-pipes-format-data/README.md
@@ -26,8 +26,8 @@ In `app.ts`, update the template to include parameter for the `decimal` pipe.
 
 <docs-code language="ts" highlight="[3]">
 template: `
-    ...
-    <li>Number with "decimal" {{ num | number:"3.2-2" }}</li>
+  ...
+  <li>Number with "decimal" {{ num | number:"3.2-2" }}</li>
 `
 </docs-code>
 
@@ -41,8 +41,8 @@ Now, update the template to use the `date` pipe.
 
 <docs-code language="ts" highlight="[3]">
 template: `
-    ...
-    <li>Date with "date" {{ birthday | date: 'medium' }}</li>
+  ...
+  <li>Date with "date" {{ birthday | date: 'medium' }}</li>
 `
 </docs-code>
 
@@ -56,8 +56,8 @@ For your last task, update the template to use the `currency` pipe.
 
 <docs-code language="ts" highlight="[3]">
 template: `
-    ...
-    <li>Currency with "currency" {{ cost | currency }}</li>
+  ...
+  <li>Currency with "currency" {{ cost | currency }}</li>
 `
 </docs-code>
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/24-create-a-pipe/README.md b/adev/src/content/tutorials/learn-angular/steps/24-create-a-pipe/README.md
index 405669e7902..b6f2fef2fd8 100644
--- a/adev/src/content/tutorials/learn-angular/steps/24-create-a-pipe/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/24-create-a-pipe/README.md
@@ -38,7 +38,7 @@ In `reverse.pipe.ts` add the `@Pipe` decorator to the `ReversePipe` class and pr
 
 ```ts
 @Pipe({
-    name: 'reverse'
+  name: 'reverse'
 })
 ```
 
@@ -50,16 +50,15 @@ Now the `ReversePipe` class is a pipe. Update the `transform` function to add th
 
 <docs-code language="ts" highlight="[3,4,5,6,7,8,9]">
 export class ReversePipe implements PipeTransform {
-    transform(value: string): string {
-        let reverse = '';
+  transform(value: string): string {
+    let reverse = '';
 
-        for (let i = value.length - 1; i >= 0; i--) {
-            reverse += value[i];
-        }
-
-        return reverse;
+    for (let i = value.length - 1; i >= 0; i--) {
+      reverse += value[i];
     }
 
+    return reverse;
+  }
 }
 </docs-code>
 
@@ -70,9 +69,9 @@ With the pipe logic implemented, the final step is to use it in the template. In
 
 <docs-code language="angular-ts" highlight="[3,4]">
 @Component({
-    ...
-    template: `Reverse Machine: {{ word | reverse }}`
-    imports: [ReversePipe]
+  ...
+  template: `Reverse Machine: {{ word | reverse }}`
+  imports: [ReversePipe]
 })
 </docs-code>
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/6-property-binding/README.md b/adev/src/content/tutorials/learn-angular/steps/6-property-binding/README.md
index a74f6791b2e..fd72fb0a23e 100644
--- a/adev/src/content/tutorials/learn-angular/steps/6-property-binding/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/6-property-binding/README.md
@@ -25,7 +25,7 @@ Update the code in `app.ts` by adding a property to the `App` class called `isEd
 
 <docs-code highlight="[2]">
 export class App {
-    isEditable = true;
+  isEditable = true;
 }
 </docs-code>
 </docs-step>
@@ -35,8 +35,8 @@ Next, bind the `contentEditable` attribute of the `div` to the `isEditable` prop
 
 <docs-code highlight="[3]" language="angular-ts">
 @Component({
-    ...
-    template: `<div [contentEditable]="isEditable"></div>`,
+  ...
+  template: `<div [contentEditable]="isEditable"></div>`,
 })
 </docs-code>
 </docs-step>
diff --git a/adev/src/content/tutorials/learn-angular/steps/7-event-handling/README.md b/adev/src/content/tutorials/learn-angular/steps/7-event-handling/README.md
index 19d59608ef7..49cbf52e4ab 100644
--- a/adev/src/content/tutorials/learn-angular/steps/7-event-handling/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/7-event-handling/README.md
@@ -12,13 +12,13 @@ In Angular you bind to events with the parentheses syntax `()`. On a given eleme
 
 ```angular-ts
 @Component({
-    ...
-    template: `<button (click)="greet()">`
+  ...
+  template: `<button (click)="greet()">`
 })
 class App {
-    greet() {
-        console.log('Hello, there 👋');
-    }
+  greet() {
+    console.log('Hello, there 👋');
+  }
 }
 ```
 
@@ -33,7 +33,7 @@ Add the `onMouseOver` event handler function in the `App` class. Use the followi
 
 ```ts
 onMouseOver() {
-    this.message = 'Way to go 🚀';
+  this.message = 'Way to go 🚀';
 }
 ```
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/9-output/README.md b/adev/src/content/tutorials/learn-angular/steps/9-output/README.md
index 156455148c2..8a830884f80 100644
--- a/adev/src/content/tutorials/learn-angular/steps/9-output/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/9-output/README.md
@@ -15,7 +15,7 @@ To create the communication path from child to parent components, use the `outpu
 <docs-code header="child.ts" language="ts">
 @Component({...})
 class Child {
-    incrementCountEvent = output<number>();
+  incrementCountEvent = output<number>();
 }
 </docs-code>
 
@@ -23,13 +23,12 @@ Now the component can generate events that can be listened to by the parent comp
 
 <docs-code header="child.ts" language="ts">
 class Child {
-    ...
-
-    onClick() {
-        this.count++;
-        this.incrementCountEvent.emit(this.count);
-    }
+  ...
 
+  onClick() {
+    this.count++;
+    this.incrementCountEvent.emit(this.count);
+  }
 }
 </docs-code>