# a. StackBlitz instructions

We'll use the Angular Generator to create a new component.

Right click on the `app` folder and select **Angular Generator**, then select **Component**.

![StackBlitz Angular Generator](/files/T671ZTiV6FBPNSghZAlN)

A small text input box displays at the top of the middle editor pane. Type `input-button-unit` to create the component.

![Input component name](/files/-Libq5730bL3KTwp1Wkd)

You now have a new component!

Now we'll manually move the HTML to make this component use inline templates. We'll repeat what we did in the [#3: 📐 Component chapter](https://ng-girls.gitbook.io/todo-list-tutorial/workshop-todo-list/component#inline-template).

Copy all the code from the `input-button-unit.html`. In the `input-button-unit.component.ts` file, change `templateUrl` to `template`, and paste the HTML code between **backticks**.

You may delete the `input-button-unit.html` file.

Press the **Save** button on the toolbar to save your work.

Return to the previous page to [continue the tutorial](https://ng-girls.gitbook.io/todo-list-tutorial/workshop-todo-list/a-new-component/).


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ng-girls.gitbook.io/todo-list-tutorial/workshop-todo-list/a-new-component/stackblitz.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
