Astro Components에서 JavaScript를 component frontmatter에

사용 가능하다

---
const name = 'joe'
---

<p>test</p>
<p>{name}</p> // inside markup 

이 javascript는 build time에 진행된다

user가 request할떄마다 실행되는 것이 아님! ( 중요 )

만약 client-side에서 실행되는 자바스크립트를 원하면

<script> 태그를 코드안에 wrap 하면 된다.

<script>
	alert('test')
</script>

하지만 이 코드는 DOM이 fully load가 되기전에 실행완료되므로

DevTools에서 볼 수 없다.

이런식으로 작성하게 되면 DomContent가 Load될때까지 기다리므로 볼 수 있다.

<script is:inline>
    document.addEventListener(
        . 'DomContentLoaded', () =>{
            alert('test')
        }
    )
  </script>

또한 js 자체를 Astro templates 안에 넣을 수도 있다.