# Getting Started with Astro Course: [Astro](https://www.devtutorials.ai/learn/astro) · Section: Get Started Source: https://www.devtutorials.ai/learn/astro/get-started/getting-started > What Astro is and why it was created, its features, the HTML-first approach, what you can build, Astro vs Next.js and React, the ecosystem, system requirements, creating and running a project, its files, and the Astro CLI. ## Astro Introduction - **Astro** is a tool for building websites. - It is best for sites with a lot of content, such as blogs, docs and shop pages. - It turns your code into plain HTML pages that load very fast. - It adds JavaScript only to the parts of a page that need it. - In this lesson, you will see what Astro is and create your first Astro site. **Simple lesson:** Astro builds fast websites from plain HTML, and adds JavaScript only where you ask for it. ### A Real-World Example - Asha is a computer science student in Chennai. - She wants a personal site called **Asha's Dev Journal**. - It will have a home page, an about page and many blog posts. - Visitors only read the pages. Nothing needs to move or change. - She wants it to open fast, even on a slow phone network. - Astro is a good fit, because it sends ready-made HTML and almost no JavaScript. Press **▶ Run** to build Asha's first page. Then click **HTML sent to browser** under the preview. {siteName}

Welcome to {siteName}

Notes from my coding journey.

Page built on {today}.

`, }} /> What happened: - The part between the two `---` lines is the **component script**. It runs when the site is built. - `{siteName}` puts the value of `siteName` into the page. - The **HTML sent to browser** view shows only HTML. There is no ` `, }} /> What to compare: - **The list:** it arrives as three finished `
  • ` tags. The browser runs nothing to make it. - **The button:** it needs the small ` `, }} /> What to compare: - **[terminal] lines:** printed while Astro built the page. - **[browser] lines:** printed by the `