개발 환경 구축1. node.js 다운로드2. cmdnode - -versionnpm init3. npm install expressdependencies : 설치한 라이브러리 목록github에 등록하거나 저장해서 가지고 다닐 때 node_moduels는 관리하는 것이 아니라 프로젝트를 실행시킬 때만 필요한 것서버 띄우기새로 저장할 때 마다 서버를 다시 실행node app.jsnodemon → 서버를 재시작 할 필요 없이 자동적으로 수정된 것을 보여주는 패키지nodemon app.jsnpm install -g nodemodnodemon은 글로벌에 깔아야 한다. 그리고 yarn을 사용해서 패키지를 설치할 건데 yarn 설치 명령어= npm install -g yarn 하고 그다음 nodemon 설치 위해 ..
이벤트웹 브라우저에서 사용자가 화면을 클릭하는 사건, 사용자가 키보드를 누르는 사건과 같은 다양한 사건이 발생, 이러한 사건을 이벤트(event)라고 함.이벤트의 종류이벤트는 애플리케이션 사용자가 발생시킬 수도 있고 애플리케이션이 스스로 발생 시킬 수도 있음마우스 이벤트키보드 이벤트HTML 프레임 이벤트HTML 입력 양식 이벤트유저 인터페이스 이벤트구조 변화 이벤트터치 이벤트이벤트 모델이벤트를 연결하는 방법을 ‘이벤트 모델(event model)’이라고 함(현재)이벤트 표준 모델addEventListener( ) 이벤트 관련 용어 정리아래 코드와 같이, window 객체의 onload (이벤트) 속성에 함수(자료형)를 할당하는 것을 “이벤트를 연결한다”라고 함window가 웹 페이지를 로드 (완료)했을 ..
문제 객체 모델문서 객체 모델(DOM, Document Object Model)은 넓은 의미로 웹 브라우저가 HTML 페이지를 인식하는 방식이고 좁은 의미로는 document 객체와 관련된 객체의 집합.문서 객체 모델을 사용하면 HTML 페이지에 태그를 추가, 수정, 제거할 수 있음문서 객체 모델과 관련된 용어 정리요소(Element)HTML 페이지에 있는 html, head, body, title, h1, div, span 등의 태그를 HTML 언어에서는 요소(element)라고 부름자바스크립트 언어에서는 HTML 언어에서 요소를 문서 객체(document object)라고 부름문서 객체를 조작한다는 말은 HTML 요소를 조작한다는 의미제이쿼리(jQuery) 라이브러리, 리액트(React)와 같은 프레..
Window 객체브라우저 객체 모델(BOM, Brower Object Model)은 웹 브라우저와 관련된 객체의 집합을 의미Window 객체 = { location 객체, navigator 객체, history 객체, screen 객체, document 객체 }지금까지 사용해 온 alert( )이나 prompt( )함수 모두 window 객체의 메서드 새로운 window 객체 생성open( ) 메서드로 window 생성open( URL, name, features, replace )4 개의 매개 변수가 있으며 4개의 매개 변수를 지정해도 되고 하지 않아도 됨 – 옵션첫 번째 매개변수 : 열고자 하는 웹 페이지의 URL두 번째 매개변수 : 사용하는 윈도우 이름세 번째 매개변수 : 원도우 크기 » 참고 - ..
객체배열‘인덱스’와 ‘요소’접근 - 배열이름[인덱스]객체중괄호({})를 사용하여 생성키와 요소접근 - 객체이름[’키’] 또는 이름.키product[’유형’]product.유형 속성과 메서드객체의 속성이 가질 수 있는 자료형배열의 내부에 저장된 각각의 정보를 ‘요소’라고 부름객체 내부에 저장된 각각의 정보를 ‘속성(property)’이라고 함사물의 특성객체의 속성 중 함수 자료형인 속성은 특별히 메서드(method)라 부름사물의 동작 this 는 자기 자신, 파이썬에서 self와 같음메서드 내에서 자기 자신(객체)이 가진 속성을 출력(속성에 접근)하고 싶을 때 자신이 가진 속성임을 분명하기 표시자바스크립트에서는 this 키워드를 생략할 수 없음속성 존재 여부 확인객체에 없는 속성에 접근하면 undefine..