From 382245592801480ea9bc6bc782d23ac82f883cb7 Mon Sep 17 00:00:00 2001 From: Judy Bogart Date: Mon, 13 Jan 2020 10:37:43 -0800 Subject: [PATCH] docs: modify toh titles and intro (#34758) PR Close #34758 --- aio/content/navigation.json | 12 ++++++------ aio/content/tutorial/index.md | 23 +++++++++++++---------- aio/content/tutorial/toh-pt0.md | 2 +- aio/content/tutorial/toh-pt1.md | 2 +- aio/content/tutorial/toh-pt2.md | 2 +- aio/content/tutorial/toh-pt3.md | 2 +- aio/content/tutorial/toh-pt4.md | 6 +++--- aio/content/tutorial/toh-pt5.md | 2 +- aio/content/tutorial/toh-pt6.md | 2 +- 9 files changed, 28 insertions(+), 25 deletions(-) diff --git a/aio/content/navigation.json b/aio/content/navigation.json index 6023077ead..6428757c59 100644 --- a/aio/content/navigation.json +++ b/aio/content/navigation.json @@ -118,27 +118,27 @@ }, { "url": "tutorial/toh-pt2", - "title": "2. Displaying a List", + "title": "2. Display a List", "tooltip": "Part 2: Build a master/detail page with a list of heroes." }, { "url": "tutorial/toh-pt3", - "title": "3. Master/Detail Components", - "tooltip": "Part 3: Refactor the master/detail view into separate components." + "title": "3. Create a Feature Component", + "tooltip": "Part 3: Refactor the master/detail views into separate components." }, { "url": "tutorial/toh-pt4", - "title": "4. Services", + "title": "4. Add Services", "tooltip": "Part 4: Create a reusable service to manage hero data." }, { "url": "tutorial/toh-pt5", - "title": "5. Routing", + "title": "5. Add In-app Navigation", "tooltip": "Part 5: Add the Angular router and navigate among the views." }, { "url": "tutorial/toh-pt6", - "title": "6. HTTP", + "title": "6. Get Data from a Server", "tooltip": "Part 6: Use HTTP to retrieve and save hero data." } ] diff --git a/aio/content/tutorial/index.md b/aio/content/tutorial/index.md index 9ddf21ddde..028766b558 100644 --- a/aio/content/tutorial/index.md +++ b/aio/content/tutorial/index.md @@ -1,19 +1,22 @@ -

Tour of Heroes App and Tutorial

+

Tour of Heroes app and tutorial

-
Getting Started Tutorial
+
Getting Started
-If you're new to Angular, see the [**Getting Started tutorial.**](start) -The Getting Started tutorial covers the same major topics as this Tour of Heroes—components, template syntax, routing, services, and accessing data via HTTP—in a condensed format, following the most current best practices. +If you're new to Angular, you might want to try the [**Getting Started**](start) quick-start app first. +The Getting Started tutorial covers the same major topics—components, template syntax, routing, services, and accessing data via HTTP—in a condensed format, following the most current best practices. It uses a partially-completed StackBlitz project, so that you can make modifications and see the results in real time. -**This Tour of Heroes tutorial** is the conceptual basis for many examples in this documentation set. Reading this introduction page provides sufficient context for working with those examples. You do not need to do this tutorial to understand those other examples. The Tour of Heroes tutorial is maintained here for context and continuity. +In this tutorial, you build your own app from the ground up, providing experience with the development process as well as a more thorough introduction to basic concepts. -
+The **Tour of Heroes app** that you create with this tutorial serves as the conceptual basis for many examples throughout Angular documentation. +Reading this introduction page provides sufficient context for working with those examples. +You do not need to do this tutorial to understand those other examples. + -This _Tour of Heroes_ tutorial provides an introduction to the fundamentals of Angular. -It shows you how to set up your local development environment and develop an app using the [Angular CLI tool](cli "CLI command reference"). +This _Tour of Heroes_ tutorial provides an introduction to the fundamentals of Angular. +It shows you how to set up your local development environment and develop an app using the [Angular CLI tool](cli "CLI command reference"). In this _Tour of Heroes_ tutorial, you will build an app that helps a staffing agency manage its stable of heroes. @@ -27,13 +30,13 @@ By the end of this tutorial you will be able to do the following: * Use one-way data binding for read-only data. * Add editable fields to update a model with two-way data binding. * Bind component methods to user events, like keystrokes and clicks. -* Enable users to select a hero from a master list and edit that hero in the details view. +* Enable users to select a hero from a master list and edit that hero in the details view. * Format data with pipes. * Create a shared service to assemble the heroes. * Use routing to navigate among different views and their components. You'll learn enough Angular to get started and gain confidence that -Angular can do whatever you need it to do. +Angular can do whatever you need it to do.
Solution
diff --git a/aio/content/tutorial/toh-pt0.md b/aio/content/tutorial/toh-pt0.md index b510cf5e81..48f80d723b 100644 --- a/aio/content/tutorial/toh-pt0.md +++ b/aio/content/tutorial/toh-pt0.md @@ -1,4 +1,4 @@ -# The Application Shell +# Create a new project You begin by creating an initial application using the Angular CLI. Throughout this tutorial, you’ll modify and extend that starter application to create the Tour of Heroes app. diff --git a/aio/content/tutorial/toh-pt1.md b/aio/content/tutorial/toh-pt1.md index 9d250dd7ad..9b84306af6 100644 --- a/aio/content/tutorial/toh-pt1.md +++ b/aio/content/tutorial/toh-pt1.md @@ -1,4 +1,4 @@ -# The Hero Editor +# The hero editor The application now has a basic title. Next you will create a new component to display hero information diff --git a/aio/content/tutorial/toh-pt2.md b/aio/content/tutorial/toh-pt2.md index ad18e1aa8b..e80fda62b3 100644 --- a/aio/content/tutorial/toh-pt2.md +++ b/aio/content/tutorial/toh-pt2.md @@ -1,4 +1,4 @@ -# Display a Heroes List +# Display a selection list In this page, you'll expand the Tour of Heroes app to display a list of heroes, and allow users to select a hero and display the hero's details. diff --git a/aio/content/tutorial/toh-pt3.md b/aio/content/tutorial/toh-pt3.md index 7c30439c97..9e8a4dbd58 100644 --- a/aio/content/tutorial/toh-pt3.md +++ b/aio/content/tutorial/toh-pt3.md @@ -1,4 +1,4 @@ -# Master/Detail Components +# Create a feature component At the moment, the `HeroesComponent` displays both the list of heroes and the selected hero's details. diff --git a/aio/content/tutorial/toh-pt4.md b/aio/content/tutorial/toh-pt4.md index 241e34050f..22a78ae90f 100644 --- a/aio/content/tutorial/toh-pt4.md +++ b/aio/content/tutorial/toh-pt4.md @@ -1,4 +1,4 @@ -# Services +# Create services The Tour of Heroes `HeroesComponent` is currently getting and displaying fake data. @@ -11,8 +11,8 @@ Components shouldn't fetch or save data directly and they certainly shouldn't kn They should focus on presenting data and delegate data access to a service. In this tutorial, you'll create a `HeroService` that all application classes can use to get heroes. -Instead of creating that service with the [`new` keyword](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new), -you'll rely on Angular [*dependency injection*](guide/dependency-injection) +Instead of creating that service with the [`new` keyword](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new), +you'll rely on Angular [*dependency injection*](guide/dependency-injection) to inject it into the `HeroesComponent` constructor. Services are a great way to share information among classes that _don't know each other_. diff --git a/aio/content/tutorial/toh-pt5.md b/aio/content/tutorial/toh-pt5.md index 759746cc13..562bd1a276 100644 --- a/aio/content/tutorial/toh-pt5.md +++ b/aio/content/tutorial/toh-pt5.md @@ -1,4 +1,4 @@ -# Routing +# Add in-app navigation (routing) There are new requirements for the Tour of Heroes app: diff --git a/aio/content/tutorial/toh-pt6.md b/aio/content/tutorial/toh-pt6.md index af9689e657..4b33cef9aa 100644 --- a/aio/content/tutorial/toh-pt6.md +++ b/aio/content/tutorial/toh-pt6.md @@ -1,4 +1,4 @@ -# HTTP +# Get data from a server In this tutorial, you'll add the following data persistence features with help from Angular's `HttpClient`.