docs: modify toh titles and intro (#34758)

PR Close #34758
This commit is contained in:
Judy Bogart 2020-01-13 10:37:43 -08:00 committed by Andrew Kushnir
parent 8fd2a97c44
commit 3822455928
9 changed files with 28 additions and 25 deletions

View File

@ -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."
}
]

View File

@ -1,19 +1,22 @@
<h1 class="no-toc">Tour of Heroes App and Tutorial</h1>
<h1 class="no-toc">Tour of Heroes app and tutorial</h1>
<div class="callout is-helpful">
<header>Getting Started Tutorial</header>
<header>Getting Started</header>
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&mdash;components, template syntax, routing, services, and accessing data via HTTP&mdash;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&mdash;components, template syntax, routing, services, and accessing data via HTTP&mdash;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.
</div>
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.
</div>
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.
<div class="callout is-helpful">
<header>Solution</header>

View File

@ -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, youll modify and extend that starter application to create the Tour of Heroes app.

View File

@ -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

View File

@ -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.

View File

@ -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.

View File

@ -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_.

View File

@ -1,4 +1,4 @@
# Routing
# Add in-app navigation (routing)
There are new requirements for the Tour of Heroes app:

View File

@ -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`.