mirror of
https://github.com/angular/angular
synced 2026-05-24 09:28:37 +00:00
104 lines
4 KiB
Markdown
104 lines
4 KiB
Markdown
|
|
# First Angular app lesson \[TODO: lesson # as digit \] - \[TODO: Topic title\]
|
||
|
|
|
||
|
|
<div class="callout is-important">
|
||
|
|
|
||
|
|
<header>This topic is a work in progress</header>
|
||
|
|
|
||
|
|
\[TODO: pick the one that applies to the doc: \]
|
||
|
|
|
||
|
|
This topic is a rough draft. Many sections are incomplete and some or all content might change before its final draft.
|
||
|
|
|
||
|
|
This topic is a first draft. It is complete, but it some or all content might change before its final draft.
|
||
|
|
|
||
|
|
This topic is a final draft. It is complete and ready for review.
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
* \[TODO: Delete after reading. This is a guide to adapt to a specific tutorial lesson. Add/Remove/Change the contents as required, but keep the general outline intact as much as possible to provide a consistent experience across lessons. \]
|
||
|
|
|
||
|
|
This tutorial lesson demonstrates how to \[TODO: do something interesting in Angular\].
|
||
|
|
|
||
|
|
**Time required:** expect to spend about \[TODO: XX\] minutes to complete this lesson.
|
||
|
|
|
||
|
|
## Before you start
|
||
|
|
|
||
|
|
This lesson starts with the code from the previous lesson, so you can:
|
||
|
|
|
||
|
|
* Use the code that you created in Lesson \[TODO: insert previous lesson number\] in your interactive development environment (IDE).
|
||
|
|
<!-- update previous lesson link: vv -->
|
||
|
|
* Start with the code example from the previous lesson. Choose the <live-example name="first-app-lesson-00"></live-example> from Lesson \[TODO: previous lesson number\] where you can:
|
||
|
|
* Use the *live example* in StackBlitz, where the StackBlitz interface is your IDE.
|
||
|
|
* Use the *download example* and open it in your IDE.
|
||
|
|
|
||
|
|
If you haven't reviewed the introduction, visit the [Introduction to Angular tutorial](tutorial/first-app) to make sure you have everything you need to complete this lesson.
|
||
|
|
|
||
|
|
If you have any trouble during this lesson, you can review the completed code for this lesson, in the <live-example></live-example> for this lesson.
|
||
|
|
|
||
|
|
## After you finish
|
||
|
|
|
||
|
|
* Your app has \[TODO: something new and interesting in Angular\].
|
||
|
|
|
||
|
|
## Conceptual preview of \[TODO: concepts being introduced in this lesson\]
|
||
|
|
|
||
|
|
Include this section only if concepts are being introduced that don't appear in a previous lesson
|
||
|
|
|
||
|
|
\[TODO: provide a brief overview of any new concepts introduced in this lesson.\]
|
||
|
|
\[TODO: limit new concepts introduced in this lesson to only one, if possible.\]
|
||
|
|
|
||
|
|
## Lesson steps
|
||
|
|
|
||
|
|
Perform these steps on the app code in your IDE.
|
||
|
|
|
||
|
|
### Step 1 - \[TODO: Describe goal of this step\]
|
||
|
|
|
||
|
|
\[TODO: describe goal of this step in a sentence. \]
|
||
|
|
|
||
|
|
In the **Terminal** pane of your IDE:
|
||
|
|
|
||
|
|
1. In your project directory, navigate to the `first-app` directory.
|
||
|
|
1. \[TODO: describe how to do this in numbered actions.\]
|
||
|
|
1. Confirm that the app builds without error.
|
||
|
|
Correct any errors before you continue to the next step.
|
||
|
|
|
||
|
|
### Step 2 - \[TODO: Describe goal of this step\]
|
||
|
|
|
||
|
|
\[TODO: describe goal of this step in a sentence. \]
|
||
|
|
|
||
|
|
In the **Terminal** pane of your IDE:
|
||
|
|
|
||
|
|
1. In your project directory, navigate to the `first-app` directory.
|
||
|
|
1. \[TODO: describe how to do this in numbered actions.\]
|
||
|
|
1. Confirm that the app builds without error.
|
||
|
|
Correct any errors before you continue to the next step.
|
||
|
|
|
||
|
|
### Step 3 - \[TODO: Describe goal of this step\]
|
||
|
|
|
||
|
|
\[TODO: describe goal of this step in a sentence. \]
|
||
|
|
|
||
|
|
In the **Terminal** pane of your IDE:
|
||
|
|
|
||
|
|
1. In your project directory, navigate to the `first-app` directory.
|
||
|
|
1. \[TODO: describe how to do this in numbered actions.\]
|
||
|
|
1. Confirm that the app builds without error.
|
||
|
|
Correct any errors before you continue to the next step.
|
||
|
|
|
||
|
|
### Step 4 - \[TODO: Try not to have this many steps\]
|
||
|
|
|
||
|
|
## Lesson review
|
||
|
|
|
||
|
|
In this lesson, \[TODO: describe goal of this lesson and what they should remember \]
|
||
|
|
|
||
|
|
If you are having any trouble with this lesson, you can review the completed code for it in the <live-example></live-example>.
|
||
|
|
|
||
|
|
## Next steps
|
||
|
|
|
||
|
|
\[TODO: text/links to the next lesson go here.\]
|
||
|
|
|
||
|
|
## More information
|
||
|
|
|
||
|
|
For more information about the topics covered in this lesson, visit:
|
||
|
|
|
||
|
|
* \[TODO: links to related topic.\]
|
||
|
|
* \[TODO: links to related topic.\]
|
||
|
|
* \[TODO: links to related topic.\]
|