바로바로 바이브 코딩 with 커서 AI

바로바로 바이브 코딩 with 커서 AI · 04장 바이브 코딩의 핵심, 웹 기술 · 04.1 웹 기술의 기초, HTML, CSS, 자바스크립트 알아보기

웹사이트에 기능을 추가하는 자바스크립트

박현규30 / 35절읽는 시간 약 1분

자바스크립트는 그럼 무엇일까요? 자바스크립트는 평범한 웹사이트에 기능을 추가하는 역할을 합니다. 요즘은 그 이상도 할 수 있죠. 예를 들어 [다크 모드/라이트 모드] 버튼을 눌렀을 때 다르게 보이게 하면 어떨까요? 또는 좋아하는 사이트에 마우스를 오버하면 해당 주소가 보이게 하는 기능은요? 다음은 앞에서 본 사이트에 [다크 모드/라이트 모드] 버튼을 추가해서 실제로 동작하게 만든 겁니다.

실습 화면 1

이처럼 사용자와의 상호작용으로 사이트가 어떤 기능을 하게 하려면 자바스크립트가 필요합니다. 지금 여러분이 접속하는 대부분의 사이트는 이렇게 HTML, CSS, 자바스크립트의 조합으로 만들어진 것들이 상당히 많습니다. 웹 개발에 관심이 있다면 들어봤을 리액트라는 기술도 자바스크립트를 기반으로 만든 기술이죠. 이렇게 웹을 지탱하는 핵심인 세 가지 기술을 이해할 수 있도록 커서와 함께 코딩을 해봅시다.

바로바로 바이브 코딩 with 커서 AI
글자 크기