지난 편에서 만든 화면, 아직은 '사진'처럼 가만히 있죠? 이번엔 살아 움직이게 해볼게요.
화면에 '행동'을 넣는 건 자바스크립트(JS)가 맡아요. 버튼을 누르면 알림이 뜨고, 숫자를 입력하면 계산되고… 이런 '반응'이 전부 JS예요.
방법은 똑같이 쉬워요. 두 번째 이미지처럼 "버튼 누르면 환영 알림 뜨게 해줘"라고 클로드에 부탁하면, 코드와 '어디에 넣는지'까지 알려줘요. 붙여넣고 저장한 뒤 새로고침하면 끝!
팁은 '작게 하나씩'이에요. 한 번에 여러 동작을 넣으면 어디가 문제인지 찾기 어려워요. 한 동작 → 확인 → 다음 동작 순서로 가세요.
참고로 화면(HTML)·꾸밈(CSS)·동작(JS) 이 셋이 '프론트엔드 3총사'예요. 여기까진 내 컴퓨터 안에서 다 할 수 있어요.
다음 편(#5)에서는 드디어 '정보를 저장하는 곳' — 데이터베이스 이야기를 쉽게 풀어볼게요. 여러분은 어떤 '동작'을 넣어보고 싶으세요?