Test what you learned.

8 questions on Astro Basics. Pass 70% to clear the chapter.

← Review chapter lessons

Quiz

Astro Basics — Chapter Quiz

Eight questions on the .astro file, frontmatter, templates.

0/ 8

Question 1
1
Where does Astro frontmatter code run?
AIn the browser, like a <script>BOn the server (Node), at build time or per requestCInside a Web WorkerDBoth server and browser, simultaneously
The fenced --- ... --- block is server-side TypeScript. The browser never sees it — only the resulting HTML.
Question 2
2
A <style> block in an .astro file is global by default.
TTrueFFalse
It's SCOPED to the component by default. Use <style is:global> or :global(...) to escape the scope.
Question 3
3
How do you write a class attribute in an .astro template?
AclassName="x"Bclass="x"Ccss="x"Dstyle.class="x"
Astro uses HTML attribute names — class, not className.
Question 4
4
What does this render?
```
---
const tags = ["js", "astro"];
---
<ul>
  {tags.map(t => <li>{t}</li>)}
</ul>
```
A<ul><li>js</li><li>astro</li></ul>B<ul>{[<li>js</li>, <li>astro</li>]}</ul>C<ul></ul>DTypeError
The expression inside { } is an array of <li> elements; Astro renders each one inside the <ul>.
Question 5
5
Where do unprocessed static assets (favicon, robots.txt) go?
Asrc/assets/Bpublic/Csrc/pages/DAnywhere — Astro finds them
public/ is served as-is from the site root. src/assets/ is for files Astro should process (optimize, fingerprint).
Question 6
6
An .astro file must return one root element.
TTrueFFalse
Unlike JSX, Astro's template allows multiple top-level elements without a wrapper.
Question 7
7
What does class:list={["btn", isActive && "active"]} do?
AJoins all truthy items into a class stringBThrows — Astro doesn't support arrays for classCRenders a <List> componentDSame as class="btn,active"
class:list accepts arrays, objects, and strings — joins truthy items into the class attribute.
Question 8
8
The <slot /> element is where a component's _________ content renders.
Whatever you put between a component's opening and closing tags renders where the component places <slot />.