diff --git a/adev/src/content/tutorials/learn-angular/steps/1-components-in-angular/README.md b/adev/src/content/tutorials/learn-angular/steps/1-components-in-angular/README.md
index e29a796943d..f67cf24b792 100644
--- a/adev/src/content/tutorials/learn-angular/steps/1-components-in-angular/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/1-components-in-angular/README.md
@@ -2,9 +2,11 @@
 
 Components are the foundational building blocks for any Angular application. Each component has three parts:
 
-* TypeScript class
-* HTML template
-* CSS styles
+- TypeScript class
+- HTML template
+- CSS styles
+
+Note: Learn more about [components in the essentials guide](/essentials/components).
 
 In this activity, you'll learn how to update the template and styles of a component.
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/10-deferrable-views/README.md b/adev/src/content/tutorials/learn-angular/steps/10-deferrable-views/README.md
index d63b8a5b9ea..fc0a174101a 100644
--- a/adev/src/content/tutorials/learn-angular/steps/10-deferrable-views/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/10-deferrable-views/README.md
@@ -4,6 +4,8 @@ Sometimes in app development, you end up with a lot of components that you need
 
 Maybe they are below the visible fold or are heavy components that aren't interacted with until later. In that case, we can load some of those resources later with deferrable views.
 
+Note: Learn more about [deferred loading with @defer in the in-depth guide](/guide/templates/defer).
+
 In this activity, you'll learn how to use deferrable views to defer load a section of your component template.
 
 <hr>
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 9e54971f0ce..6c085fe927c 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
@@ -2,7 +2,11 @@
 
 Images are a big part of many applications, and can be a major contributor to application performance problems, including low [Core Web Vitals](https://web.dev/explore/learn-core-web-vitals) scores.
 
-Image optimization can be a complex topic, but Angular handles most of it for you, with the `NgOptimizedImage` directive. In this activity, you'll learn how to use `NgOptimizedImage` to ensure your images are loaded efficiently.
+Image optimization can be a complex topic, but Angular handles most of it for you, with the `NgOptimizedImage` directive.
+
+Note: Learn more about [image optimization with NgOptimizedImage in the in-depth guide](/guide/image-optimization).
+
+In this activity, you'll learn how to use `NgOptimizedImage` to ensure your images are loaded efficiently.
 
 <hr>
 
@@ -31,8 +35,7 @@ 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" />
@@ -43,7 +46,7 @@ import { NgOptimizedImage } from '@angular/common';
     </li>
     ...
   `,
-  imports: [NgOptimizedImage],
+imports: [NgOptimizedImage],
 })
 </docs-code>
 
@@ -86,6 +89,7 @@ providers: [
 ```
 
 Final URL will be 'https://my.base.url/image.png'
+
 ```angular-html
 <img ngSrc="image.png" height="600" width="800" />
 ```
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 4464975e2a1..f559032b264 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
@@ -2,6 +2,8 @@
 
 For most apps, there comes a point where the app requires more than a single page. When that time inevitably comes, routing becomes a big part of the performance story for users.
 
+Note: Learn more about [routing in the in-depth guide](/guide/routing).
+
 In this activity, you'll learn how to set up and configure your app to use Angular Router.
 
 <hr>
@@ -13,7 +15,7 @@ In this activity, you'll learn how to set up and configure your app to use Angul
 Inside `app.routes.ts`, make the following changes:
 
 1. Import `Routes` from the `@angular/router` package.
-1. Export a constant called `routes` of type `Routes`, assign it `[]` as the value.
+2. Export a constant called `routes` of type `Routes`, assign it `[]` as the value.
 
 ```ts
 import {Routes} from '@angular/router';
@@ -37,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>
 
@@ -53,16 +55,15 @@ Update the template for `AppComponent` 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 AppComponent {}
 </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 74024bf69b1..37b25fe0ff2 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
@@ -2,6 +2,8 @@
 
 Now that you've set up the app to use Angular Router, you need to define the routes.
 
+Note: Learn more about [defining a basic route in the in-depth guide](/guide/routing/common-router-tasks#defining-a-basic-route).
+
 In this activity, you'll learn how to add and configure routes with your app.
 
 <hr>
@@ -48,11 +50,11 @@ import {Routes} from '@angular/router';
 import {HomeComponent} from './home/home.component';
 
 export const routes: Routes = [
-  {
-    path: '',
-    title: 'App Home Page',
-    component: HomeComponent,
-  },
+{
+path: '',
+title: 'App Home Page',
+component: HomeComponent,
+},
 ];
 </docs-code>
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/14-routerLink/README.md b/adev/src/content/tutorials/learn-angular/steps/14-routerLink/README.md
index f01ad405eca..c3c486d70a2 100644
--- a/adev/src/content/tutorials/learn-angular/steps/14-routerLink/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/14-routerLink/README.md
@@ -2,6 +2,8 @@
 
 In the app's current state, the entire page refreshes when we click on an internal link that exists within the app. While this may not seem significant with a small app, this can have performance implications for larger pages with more content where users have to redownload assets and run calculations again.
 
+Note: Learn more about [adding routes to your application in the in-depth guide](/guide/routing/common-router-tasks#add-your-routes-to-your-application).
+
 In this activity, you'll learn how to leverage the `RouterLink` directive to make the most use of Angular Router.
 
 <hr>
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 534f9cb603c..dfba1b0fa1d 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
@@ -4,6 +4,8 @@ Forms are a big part of many apps because they enable your app to accept user in
 
 In Angular, there are two types of forms: template-driven and reactive. You'll learn about both over the next few activities.
 
+Note: Learn more about [forms in Angular in the in-depth guide](/guide/forms).
+
 In this activity, you'll learn how to set up a form using a template-driven approach.
 
 <hr>
@@ -34,8 +36,8 @@ import {Component} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 
 @Component({
-  ...
-  imports: [FormsModule],
+...
+imports: [FormsModule],
 })
 export class UserComponent {}
 </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 f1e673d3757..b3e5c61593c 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
@@ -2,6 +2,8 @@
 
 Now that your forms are set up with Angular, the next step is to access the values from the form controls.
 
+Note: Learn more about [adding a basic form control in the in-depth guide](/guide/forms/reactive-forms#adding-a-basic-form-control).
+
 In this activity, you'll learn how to get the value from your form input.
 
 <hr>
@@ -49,9 +51,9 @@ export class UserComponent {
   favoriteFramework = '';
   ...
 
-  showFramework() {
-    alert(this.favoriteFramework);
-  }
+showFramework() {
+alert(this.favoriteFramework);
+}
 }
 </docs-code>
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/17-reactive-forms/README.md b/adev/src/content/tutorials/learn-angular/steps/17-reactive-forms/README.md
index bfc4b213c6e..869337fb138 100644
--- a/adev/src/content/tutorials/learn-angular/steps/17-reactive-forms/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/17-reactive-forms/README.md
@@ -2,6 +2,8 @@
 
 When you want to manage your forms programmatically instead of relying purely on the template, reactive forms are the answer.
 
+Note: Learn more about [reactive forms in the in-depth guide](/guide/forms/reactive-forms).
+
 In this activity, you'll learn how to set up reactive forms.
 
 <hr>
diff --git a/adev/src/content/tutorials/learn-angular/steps/18-forms-validation/README.md b/adev/src/content/tutorials/learn-angular/steps/18-forms-validation/README.md
index 0eb6c53c643..bd60d766784 100644
--- a/adev/src/content/tutorials/learn-angular/steps/18-forms-validation/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/18-forms-validation/README.md
@@ -2,6 +2,8 @@
 
 Another common scenario when working with forms is the need to validate the inputs to ensure the correct data is submitted.
 
+Note: Learn more about [validating form input in the in-depth guide](/guide/forms/reactive-forms#validating-form-input).
+
 In this activity, you'll learn how to validate forms with reactive forms.
 
 <hr>
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 cdfea9012d6..d5c0f685902 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
@@ -2,9 +2,9 @@
 
 Dependency injection (DI) in Angular is one of the framework's most powerful features. Consider dependency injection to be the ability for Angular to _provide_ resources you need for your application at runtime. A dependency could be a service or some other resources.
 
-You can learn more about [dependency injection in the Angular docs](guide/di). For now, you will get practice creating `injectable` resources.
+Note: Learn more about [dependency injection in the essentials guide](/essentials/dependency-injection).
 
-In this activity, you'll learn how to create an injectable service.
+In this activity, you'll learn how to create an `injectable` service.
 
 <hr>
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/2-updating-the-component-class/README.md b/adev/src/content/tutorials/learn-angular/steps/2-updating-the-component-class/README.md
index 2c49ac1ea84..66cb5fb0f28 100644
--- a/adev/src/content/tutorials/learn-angular/steps/2-updating-the-component-class/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/2-updating-the-component-class/README.md
@@ -2,6 +2,8 @@
 
 In Angular, the component's logic and behavior are defined in the component's TypeScript class.
 
+Note: Learn more about [showing dynamic text in the essentials guide](/essentials/templates#showing-dynamic-text).
+
 In this activity, you'll learn how to update the component class and how to use [interpolation](/guide/templates/binding#render-dynamic-text-with-text-interpolation).
 
 <hr />
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 7757fdf74ca..088d3b567a5 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
@@ -2,7 +2,7 @@
 
 Creating an injectable service is the first part of the dependency injection (DI) system in Angular. How do you inject a service into a component? Angular has a convenient function called `inject()` that can be used in the proper context.
 
-NOTE: Injection contexts are beyond the scope of this tutorial, but you can find more information in the [Angular Docs](guide/di/dependency-injection-context) if you would like to learn more.
+NOTE: Injection contexts are beyond the scope of this tutorial, but you can learn more in the [dependency injection (DI) essentials guide](/essentials/dependency-injection)and [DI context guide](guide/di/dependency-injection-context).
 
 In this activity, you'll learn how to inject a service and use it in a component.
 
diff --git a/adev/src/content/tutorials/learn-angular/steps/21-constructor-based-di/README.md b/adev/src/content/tutorials/learn-angular/steps/21-constructor-based-di/README.md
index b84f366e85b..7feda9c8698 100644
--- a/adev/src/content/tutorials/learn-angular/steps/21-constructor-based-di/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/21-constructor-based-di/README.md
@@ -3,7 +3,9 @@
 In previous activities you used the `inject()` function to make resources available, "providing" them to your components. The `inject()` function is one pattern and it is useful to know that there is another pattern for injecting resources called constructor-based dependency injection.
 
 You specify the resources as parameters to the `constructor` function of a component. Angular will make those resources available to your component.
-<br><br>
+
+Note: Learn more about [injecting services in the in-depth guide](/guide/di/creating-injectable-service#injecting-services).
+
 In this activity, you will learn how to use constructor-based dependency injection.
 
 <hr>
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 9395409c3fd..0e5ee1d7765 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
@@ -2,6 +2,8 @@
 
 Pipes are functions that are used to transform data in templates. In general, pipes are "pure" functions that don't cause side effects. Angular has a number of helpful built-in pipes you can import and use in your components. You can also create a custom pipe.
 
+Note: Learn more about [pipes in the in-depth guide](/guide/templates/pipes).
+
 In this activity, you will import a pipe and use it in the template.
 
 <hr>
@@ -12,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 AppComponent {
-    loudMessage = 'we think you are doing great!'
+loudMessage = 'we think you are doing great!'
 }
 </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 2d7d960bdcb..5582954aa38 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
@@ -2,6 +2,8 @@
 
 You can take your use of pipes even further by configuring them. Pipes can be configured by passing options to them.
 
+Note: Learn more about [formatting data with pipes in the in-depth guide](/guide/templates/pipes).
+
 In this activity, you will work with some pipes and pipe parameters.
 
 <hr>
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 601f6460b6a..d24302989c3 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
@@ -2,6 +2,8 @@
 
 You can create custom pipes in Angular to fit your data transformation needs.
 
+Note: Learn more about [creating custom pipes in the in-depth guide](/guide/templates/pipes#creating-custom-pipes).
+
 In this activity, you will create a custom pipe and use it in your template.
 
 <hr>
diff --git a/adev/src/content/tutorials/learn-angular/steps/3-composing-components/README.md b/adev/src/content/tutorials/learn-angular/steps/3-composing-components/README.md
index d7f92b4935a..2071c876131 100644
--- a/adev/src/content/tutorials/learn-angular/steps/3-composing-components/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/3-composing-components/README.md
@@ -4,6 +4,8 @@ You've learned to update the component template, component logic, and component
 
 The `selector` property of the component configuration gives you a name to use when referencing the component in another template. You use the `selector` like an HTML tag, for example `app-user` would be `<app-user />` in the template.
 
+Note: Learn more about [using components in the essentials guide](/essentials/components#using-components).
+
 In this activity, you'll learn how to compose components.
 
 <hr/>
diff --git a/adev/src/content/tutorials/learn-angular/steps/4-control-flow-if/README.md b/adev/src/content/tutorials/learn-angular/steps/4-control-flow-if/README.md
index 9767fc201bd..8627de26183 100644
--- a/adev/src/content/tutorials/learn-angular/steps/4-control-flow-if/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/4-control-flow-if/README.md
@@ -4,6 +4,8 @@ Deciding what to display on the screen for a user is a common task in applicatio
 
 To express conditional displays in templates, Angular uses the `@if` template syntax.
 
+Note: Learn more about [control flow in the essentials guide](/essentials/templates#control-flow-with-if-and-for).
+
 In this activity, you'll learn how to use conditionals in templates.
 
 <hr/>
diff --git a/adev/src/content/tutorials/learn-angular/steps/5-control-flow-for/README.md b/adev/src/content/tutorials/learn-angular/steps/5-control-flow-for/README.md
index e648edb118e..902ae9bdcbd 100644
--- a/adev/src/content/tutorials/learn-angular/steps/5-control-flow-for/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/5-control-flow-for/README.md
@@ -2,7 +2,10 @@
 
 Often when building web applications, you need to repeat some code a specific number of times - for example, given an array of names, you may want to display each name in a `<p>` tag.
 
+Note: Learn more about [control flow in the essentials guide](/essentials/templates#control-flow-with-if-and-for).
+
 In this activity, you'll learn how to use `@for` to repeat elements in a template.
+
 <hr/>
 
 The syntax that enables repeating elements in a template is `@for`.
@@ -25,8 +28,8 @@ export class AppComponent {
 
 Two things to take note of:
 
-* There is an `@` prefix for the `for` because it is a special syntax called [Angular template syntax](guide/templates)
-* For applications using v16 and older please refer to the [Angular documentation for NgFor](guide/directives/structural-directives)
+- There is an `@` prefix for the `for` because it is a special syntax called [Angular template syntax](guide/templates)
+- For applications using v16 and older please refer to the [Angular documentation for NgFor](guide/directives/structural-directives)
 
 <docs-workflow>
 
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 f00b852fac6..f661200ab5a 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
@@ -4,6 +4,8 @@ Property binding in Angular enables you to set values for properties of HTML ele
 
 Use property binding to dynamically set values for properties and attributes. You can do things such as toggle button features, set image paths programmatically, and share values between components.
 
+Note: Learn more about [setting dynamic properties and attributes in the essentials guide](/essentials/templates#setting-dynamic-properties-and-attributes).
+
 In this activity, you'll learn how to use property binding in templates.
 
 <hr />
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 a98d3b9179a..21e774f002d 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
@@ -2,6 +2,8 @@
 
 Event handling enables interactive features on web apps. It gives you the ability as a developer to respond to user actions like button presses, form submissions and more.
 
+Note: Learn more about [handling user interaction in the essentials guide](/essentials/templates#handling-user-interaction).
+
 In this activity, you'll learn how to add an event handler.
 
 <hr />
diff --git a/adev/src/content/tutorials/learn-angular/steps/8-input/README.md b/adev/src/content/tutorials/learn-angular/steps/8-input/README.md
index 44807ee5cff..2a950934adf 100644
--- a/adev/src/content/tutorials/learn-angular/steps/8-input/README.md
+++ b/adev/src/content/tutorials/learn-angular/steps/8-input/README.md
@@ -4,6 +4,8 @@ Sometimes app development requires you to send data into a component. This data
 
 Angular uses a concept called `Input`. This is similar to `props` in other frameworks. To create an `Input` property, use the `@Input` decorator.
 
+Note: Learn more about [accepting data with input properties in the inputs guide](/guide/components/inputs).
+
 In this activity, you'll learn how to use the `@Input` decorator to send information to components.
 
 <hr>
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 94a21207a47..69438c08d46 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
@@ -4,6 +4,8 @@ When working with components it may be required to notify other components that
 
 Angular uses the `@Output` decorator to enable this type of behavior.
 
+Note: Learn more about [custom events in the outputs guide](/guide/components/outputs).
+
 In this activity, you'll learn how to use the `@Output` decorator and `EventEmitter` to communicate with components.
 
 <hr />