#지난주에 이어서...

4주차에서 Grid와 고급 선택자로 CSS의 구조를 완성했다면,
5주차는 정적인 화면에 움직임과 동작을 붙이는 단계로 넘어가는 구간이었다.

# 트랜지션과 애니메이션

CSS로 화면에 움직임과 흐름을 주는 방법을 다룬다.

• transform 속성 알아보기

• transition으로 부드러운 변화 만들기

• animation으로 반복 동작 구현하기

* 단순히 스타일을 바꾸는 게 아니라
사용자 행동에 반응하는 시각적 피드백를 만들 수 있다는 점이 인상적이었다.
CSS만으로도 충분히 ‘동적인 화면’을 만들 수 있다는 걸 체감한 파트.

# 자바스크립트와 첫 만남

이제 본격적으로 자바스크립트 등장!

• 자바스크립트로 무엇을 할 수 있는지

• 웹 브라우저와 자바스크립트의 관계

• 기본 용어와 입출력 방법

• 자바스크립트 스타일 가이드

* 자바스크립트는
HTML, CSS와 완전히 다른 역할을 맡고 있는 언어라는 점이 분명해졌다.
“화면을 조작하고, 사용자와 상호작용하는 역할”이라는 개념을 잡는 데 집중한 장.

# 자바스크립트 기본 문법

프로그래밍 언어로서의 자바스크립트를 배우기 시작한다.

• 변수 개념

• 자료형

• 연산자

• 조건문

• 반복문

* 다른 언어를 접해본 사람이라면 익숙한 개념들이지만,
웹 맥락에서 어떻게 쓰이는지가 새롭게 느껴졌다.
이제부터 ‘생각을 코드로 옮기는 연습’이 본격적으로 시작된 느낌.

# 함수와 이벤트

자바스크립트의 핵심 개념 중 하나인 함수와 이벤트를 다룬다.

• 함수의 개념과 사용 방법

• 변수 스코프 이해하기

• 이벤트의 개념

* 여기서부터 진짜 “웹이 살아 움직인다”는 느낌이 들었다.
사용자의 클릭, 입력 같은 행동이
코드와 직접 연결되는 구조가 인상적이었다.

# 5주차를 마치며

5주차는 한마디로
정적인 웹에서 동적인 웹으로 넘어가는 분기점이었다.

• CSS로 시각적인 움직임을 만들고

• 자바스크립트로 로직과 동작을 붙이면서
  웹 페이지가 단순한 문서가 아니라 하나의 인터페이스처럼 느껴지기 시작했다.

아직 자바스크립트가 익숙하진 않지만,
이제는 “이걸로 뭘 만들 수 있을지”가 상상되기 시작하는 단계인 것 같다.