DOM(Document Object Model) 웹 페이지에서 자바스크립트로 요소들을 제어하는데 사용한다. 웹 사이트에 접속하면 브라우저가 html 코드를 읽어들인다. 이를 해석, 파싱하여 DOM을 만든다. HTML을 구성하는 것을 트리 형태로 만든 것 각각의 요소들은 Node라고 부른다. BOM(Browser Object Model) 사용자가 브라우저에서 일어날 일들을 프로그래밍 할 수 있도록 브라우저가 제공한 것 WEB API : DOM과 BOM을 포함하여 브라우저가 제공하는 모든 것
웹은 웹 브라우저가 html, css, javscript 를 읽어 해석하는 방식으로 작동한다. 웹 브라우저는 다양한 종류가 있다. 과거에는 익스플로러가 독점을 하고 있었으나, 사파리, 크롬 파이어폭스 등 다양한 웹 브라우저가 등장하였고, 웹 표준의 질서를 만들어왔다. 익스플로러는 웹 표준을 따라가지 않았고, 결국 도태되며 edge라는 새로운 브라우저를 내세웠지만 아직 점유율이 낮다. 여전히 익스플로러 사용자가 있기에 프로그래밍 과정에서 골머리를 앓는다. Cross Browsing 여러 브라우저에서 사이트가 정상적으로 동작하는지 확인하는 것
쿠키 사이트를 방문하고 이용할 때 브라우저에 저장되는 내용들 사용자 측이 정보를 저장하고 있는 상태다. 보안 문제가 발생할 수 있다. 세션 다른 누군가에게 노철되어서는 안되는 서비스 제공자가 직접 관리해야 하는 정보를 서버 안에서 세션으로 관리한다. 사이트나 서버에 정보가 저장되는 상태다. 캐시 가져오는데 비용이 드는 데이터를 한 번 가져온 뒤에는 임시로 저장해두는 것
MVC (Model - View Controller) View 눈에 보이는 것 웹의 경우 html, css 로 나타내는 것 Controller 뭔가를 제어하는 것 Model의 데이터를 View에 연결해서 사용자가 데이터를 읽고 쓰고 지우고 할수 있도록 제어한는 것 Model ‘데이터’와 관련된 것 데이터를 수정하고 불러오는 작업이 Model에서 일어난다. MVC web Framework Framework : 남이 이미 짜놓은 코드 라이브러리와 비슷한데, 라이브러리는 각각의 기능들을 구현한 것 프레임워크는 이러한 기능들이 모여 기초적인 골격을 갖춘 상태
HTML (Hypertext Markup Language) ‘화면에 이것들이 이런 구조로 놓여 있어라’ 하고 갖다놓는 수단 CSS(Cascading Style Sheet) ‘HTML이 올려놓은 이것들은 이렇게 보여라’ 하고 꾸며주는 ‘문서’ Javascript 브라우저에서 다양한 일을 수행하고 HTML으로 올려놓은 요소들을 변형시키거나 직접 만들어낸다.
Synchrounous 동기 코드가 작성된 순서로 실행된다. Asynchronous 비동기 코드가 꼭 작성된 순서로 실행되는 것은 아니다. 멀티 스레드 / 멀티 프로세스 / 멀티 태스킹 에서 사용된다. 짜장면 배달부 예시 동기 : 짜장면 배달 - 먹는것 기다림 - 다른집 배달 비동기 : 짜장면 배달 - 다른집 배달 - 먹는 중
‘인터페이스’ - 기계와 인간 간의 소통 창구 ‘User Interface’ API(Application Programming Interface) 소프트웨어가 다른 소프트웨어로부터 지정된 형식으로 요청, 명령을 받을 수 있는 수단 URI - 자원을 구조와 함께 나타내는 구분자 CRUD(Create, Read, Update, Delete) REST API RESTful 한 API 정보들이 주고받아지는 데 있어서 개발자들 사이에서 널리 쓰이는 일종의 형식 어떤 URI에 어떤 Method를 사용할 지 개발자들 사이에 널리 지켜지는 약속 각 요청이 어떤 동작이나 정보를 위한 것인지를 그 요청의 모습 자체로 추론이 가능하다. HTTP 규약에 따라 신호를 전송한다.
Facade 패턴 프랑스어로 외벽을 뜻한다. 여러 클래스를 연결하여 프로그래밍할 때 사용한다. 본 클래스에서 다른 클래스의 연결과정을 알 필요가 없다. ex) Class.method() 형태 Template-method 패턴 어떤 같은 형식을 지닌 특정 작업들의 세부 방식을 다양화하고자할 때 사용한다. 여러 방식을 자식 클래스에서 오버라이딩하는 방식으로 구현한다. Decorator 패턴 특정 클래스의 객체들이 할 수 있는 일을 여러가지 두고, 각 객체마다 사용자가 원하는대로 골라 시키거나 기능들을 필요에 따라 장착할 수 있도록 할 때 사용한다. 객체가 생성자 변수로 다른 객체 안에 들어감으로써 그 실행하는 메소드의 행동이 추가되도록 하는 것 Factory-method 패턴 특정 종류의 기능들에 사용될 수..
Scope 각 상수나 변수 등의 요소들이 허용된 영역을 말한다. 전역 변수, 지역 변수 등 범위를 말한다. const 선언과 값 정의를 한번에 하고 값을 바꿀 수 없는 것 let 선언과 값 정의를 따로할 수 없다. 넣은 값을 언제든 바꿀 수 있다. 선언을 다시 하는 것은 못하게 되어 있다. var let, const 이전에 사용하던 방식 선언과 값 정의를 따로할 수 있다. 선언도 다시 할 수 있다. 사용 이후에 선언 되어도 오류없이 실행할 수 있다. let, const와 달리 블록내에 선언되어도 함수 전체를 돌아다닐 수 있다.
CDN(Content Delivery Network) Dleivery : 웹페이지나 이미지, 동영상 등 컨텐츠를 서버에서 사용자에게 전달하는 것 CDN 없어도 서버와 사용자가 통신할 수 있다. 물리적 거리 문제가 발생한다.(서버의 위치가 물리적으로 멀리 있다.) 많은 사용자가 서버에게 집중되어 과부하가 일어난다. 따라서, CDN을 이용해 사용자 요청을 분산시킨다. CDN 업체는 전세계에 서버를 가지고 있다. 이 업체의 서버에 데이터들이 저장, 캐싱되어 있다. 이를 통해 빠르게 정보 전달이 가능하다. DNS를 통해 IP주소를 가져올 때 원 서버가 아닌 CDN 서버의 IP주소를 가져온다.(CDN 서버, Edge 중에서 가장 빠른 서버를 선택) 정적 캐싱 : 캐싱할 것들을 미리 정해 캐싱하는 것 동적 캐싱 :..
