Writing our first component

The first component we will build shows all the blog posts on a site. To be fair, we haven't written any blog posts yet but we will temporarily solve that so we can start doing something fun.

In Chapter 3, Introducing Entity Framework Core, we created a database and an API (or interface); now it is time to use them.

The first thing we want to see is a list of blog posts, so we want our route to be "/". The index page already has that route, so we are going to reuse that page.

To create our first component, follow these instructions:

1. In the MyBlogServerSide project, open Pages/Index.razor.
2. Replace the contents of that file with the following code:

   @page "/"
   @using MyBlog.Data.Interfaces
   @using MyBlog.Data.Models
   @inject IMyBlogApi api
   @code{
       protected async Task AddSomePosts()
       {
           for (int i = 1; i <= 10; i++)
    ...