개발환경 세팅과 자바스크립트 근본
Last updated
Last updated
IntelliJ 설치
IntelliJ 실행
프로젝트 생성
자신이 앞으로 계속 사용할 폴더를 C드라이브에 만들고 아래에 생성 버튼 클릭
IntelliJ 플러그인 및 테마 세팅 (시작이 반이다!)
index.html 파일 생성
html 및 script 작성
document : 해당 html 문서
getByElementById('hello') : 아이디가 hello인 요소 (일명element)
innerHTML : 내부 HTML
= : 등호는 프로그래밍에서 오른쪽에 있는 것을 왼쪽에 대입하라는 뜻
'풀스택'개발자 양성과정에 오신것을 환영합니다!' : 해당 문자열로!
즉 풀어서 설명하면 이 문서에 hello 아이디를 가진 element의 내부HTML을 '풀스택'개발자 양성과정에 오신것을 환영합니다!' 이렇게 바꿔라 라고 컴퓨터에 명령을 내리는 것임.
'hello' 부분을 다른것으로 변경하면 다른 요소도 변경이 가능함
innerHTML 부분을 변경하면 html이 아니라 색상 배경색 폰트 정렬 등등 다양하게 제어가 가능함 (ex. style.color)
즉 JavaScript는 첫 시간에서 말한 것 처럼 '웹페이지에 생동감을 불어넣기 위해' 조금 더 개발자스럽게 얘기하면 html을 동적으로 조작, 제어하기 위해서 만들어진 언어
JavaScript를 사용해서 지난 시간에 봤던 것들을 만들 수 있다.
- 사용자가 입력한 데이터를 검사(회원가입)
- 사용자가 버튼 클릭하면 다음 화면으로 넘어감
- 모달, 탭, 아코디언 등등 다양한 이벤트 생성
✨과제. 색상을 빨간색 배경색을 검은색으로 변경해봅시다.
🎈TIP 줄복사 단축키
IntelliJ : Ctrl + D
VSCode : Alt + Shift + ↓
🎈TIP 단어 이동키는 Ctrl + -> / Ctrl + <-