https://www.edwith.org/boostcourse-web/lecture/16702/ https://www.edwith.org/boostcourse-web/lecture/16703/ JSP: Java Server Pages Java 언어를 기반으로 하는 서버사이드 스크립트 언어 등장배경 서블릿 발표 (1997) 마이크로소프트의 ASP(Active Server Page) 스크립트 엔진 발표 (1998) 서블릿은 ASP에 비해 개발 방식이 불편함(html코드를 직접 out.print로 보내줘야함) ASP에 대항하기 위해 JSP 발표 (1999) 작동원리 JSP는 내부적으로 서블릿으로 변환됨! JSP의 실행순서 브라우저가 웹서버에 JSP 파일을 요청 해당 JSP가 최초로 요청된 경우: JSP가 서블..
[네이버 부스트코스 웹 프로그래밍] Ajax, CORS, Visual Studio Code Live Server Extension
https://www.edwith.org/boostcourse-web/lecture/16701/ [LECTURE] 4) Ajax통신의 이해 : edwith 들어가기 전에 브라우저의 새로고침 없이 데이터를 얻어오는 방법이 있습니다. 이는 사용자가 더 빠르게 변경된 데이터를 화면의 새로고침 없이 확인할 수 있는 방법으로 더 좋은 UX(U... - 부스트코스 www.edwith.org Ajax: Asynchronous JavaScript and XML 넓은 의미의 Ajax는 웹 클라이언트 측에서 페이지 새로고침 없이 비동기적으로 콘텐츠를 변경하기 위해 사용하는 기술 좁은 의미의 Ajax는 서버 측과 비동기적으로 통신하는 기술 XMLHttpRequest를 이용한 표준 방법 (참고: 이름과 달리 http외 프로토..
[네이버 부스트코스 웹 프로그래밍] Event Listener
브라우저에서 발생하는 이벤트(마우스 클릭, 키보드 입력, 스크롤, 네트워크 연결, 리소스 로드 등)에 따라 어떤 일을 하라고 등록해 줄 수 있다. 이 때 이용하는 것이 Event Listener 어떻게? addEventListener를 이용 target.addEventListener(type, listener[, options]); type: 이벤트 유형 (참고: https://developer.mozilla.org/ko/docs/Web/Events) listener: Event 인터페이스 또는 Javascript function을 구현하는 객체(콜백 함수) (이벤트를 설명하는 단일 매개 변수 허용) 예제) html outside javascript var el = document.querySelecto..
https://www.edwith.org/boostcourse-web/lecture/16699/ [LECTURE] 2) DOM과 querySelector : edwith 들어가기 전에 우리가 댓글을 입력할 때 댓글이 바로 화면에 추가되는 걸 볼 수 있죠? 이외에도 받은 이메일함의 개수가 증가하기도 하고요. 이렇게 HTML 내의 구조와 데이터는 변경... - 부스트코스 www.edwith.org DOM: Document Object Model DOM은 HTML 문서를 구조화된 nodes, property, method를 갖고 있는 객체(object)로 표현한다. (웹 페이지의 객체 지향 표현) 객체의 트리 형태이다. 여기서 document는 최상위 객체다. 자바스크립트를 통해 DOM의 요소(페이지 컨텐츠:..
[네이버 부스트코스 웹 프로그래밍] JavaScript setTimeout과 비동기
https://www.edwith.org/boostcourse-web/lecture/16698/ [LECTURE] 1) window 객체(setTimeout) : edwith 들어가기 전에 전역객체(window)에 속한 메서드에는 경고창을 띄워주는 alert 그리고 setTimeout이라는 메서드등이 있습니다. 이를 어떻게 사용하는지 그리고 다른 함수와... - 부스트코스 www.edwith.org 브라우저 내부에서 SetTimeout이 어떻게 동작하는지 설명하는 영상 https://youtu.be/8aGhZQkoFbQ JavaScript Runtime 자체는 싱글 스레드이나 브라우저는 그것 외에도 다른 것들도 포함하고 있다. 그 예로, SetTimeout은 브라우저가 제공하는 WebAPI중 하나인데, ..
https://www.edwith.org/boostcourse-web/lecture/16696/ [LECTURE] 4) 자바스크립트 함수 호출 스택 : edwith 들어가기 전에 함수는 연속적으로 불려질 수 있습니다. 자바스크립트에서 이를 처리하는 방법을 이해해봅니다. 학습 목표 자바스크립트의 call stack을 이해합니다. 핵심 개념 ca... - 부스트코스 www.edwith.org VSCode에서 함수 호출 스택 확인하기 lauch.json 파일에서 program 라인을 수정하면 됨 "program": "${workspaceFolder}\\실행하고 싶은 파일.js" 수정하고 F5 누르면 해당 파일 디버그 가능 디버거 기능 참고: https://okky.kr/article/605812 OKKY | ..