ETC/Frontend

API 명세서를 작성할 때 항상 고민했었다... client 입장에서 데이터를 가져올 때는 GET, DB 또는 Server 내의 어떤 데이터를 수정할 때는 POST, 이렇게 당연하다는 듯이 사용해 왔다. 하지만 POST의 요청도 GET과 같이 데이터를 받을 수 있고 GET 요청을 받는다고 해서 DB의 내용을 수정할 수 없는 것도 아니다. 당연하다는 듯이 써온 이 Http method들의 차이를 분명히 알아둘 필요가 있어 찾아보았다. 둘을 간단히 예기하면 GET은 가져온다는 것이고, POST는 수행한다는 것. 이 부분은 누구나 알고 있으니 각각 보자면,,, GET GET은 client에서 server로 어떠한 리소스로부터 정보를 요청하기 위해 사용되는 메서드 주로 Read, Retrieve의 역할을 하며 ..

[JavaScript] Document 객체 [JavaScript] DOM : Document Object Model (문서 객체 모델) DOM이란? DOM을 풀어서 쓰면 Document Object Model, 즉 문서 객체 모델을 의미합니다. JavaScript를 이용해서 HTML과 CSS를 제어하기 위해서는 필수.. jangbageum.tistory.com 이벤트 리스너 event listener 이벤트란 사용자가 어떠한 행동에 의해 상태를 변화시킬 수 있는 그러한 모든 행동을 칭합니다. 키보드 누르기, 마우스 움직이기, 포커스 등등,,, 이벤트 리스너란 이벤트가 발생했을 때 그 처리를 담당하는 함수를 가리킵니다. 지정된 타입의 이벤트가 특정 요소에서 발생하면, 웹 브라우저는 그 요소에 등록된 이벤..

이벤트 Event 이벤트란 사용자와 웹 브라우저의 상호작용 과정에서 마우스 클릭, 움직임, 스크롤, 타이핑 등의 모든 행동에 의해 발생하는 모든 칭합니다. 이벤트가 발생했다는 것은 웹 페이지에서 특정 동작이 발생하여, 웹 브라우저가 그 사실을 알려주는 것을 의미합니다. 이벤트 핸들러 Event Handler 이벤트 핸들러는 객체의 속성을 이용하여 JavaScript가 인식할 수 있도록 하는 것입니다. 예제 // 이벤트 핸들러 const button = document.querySelector(".btn") button.onclick = function() { console.log("Hello!"); }; // OR button.onclick = () => { console.log("Hello!"); };..

[JavaScript] DOM : Document Object Model (문서 객체 모델) DOM이란? DOM을 풀어서 쓰면 Document Object Model, 즉 문서 객체 모델을 의미합니다. JavaScript를 이용해서 HTML과 CSS를 제어하기 위해서는 필수입니다. 웹 세계에서 모든 HTML 웹페이지는 문서라고 합니다. jangbageum.tistory.com Document 객체 document 객체는 DOM객체 트리의 최상위 객체이며 웹 페이지 그 자체를 의미합니다. 브라우저는 HTML 문서를 로드하기 전에 document 객체를 먼저 만들고 웹 페이지에 존재하는 HTML요소에 접근하려고 할 때는 반드시 document객체부터 시작해야 합니다. document 객체의 역할 - 메서드를..

DOM이란? DOM을 풀어서 쓰면 Document Object Model, 즉 문서 객체 모델을 의미합니다. JavaScript를 이용해서 HTML과 CSS를 제어하기 위해서는 필수입니다. 웹 세계에서 모든 HTML 웹페이지는 문서라고 합니다. 문서 객체 모델은 요소에 더 쉽게 액세스하고 관리할 수 있도록 트리와 같은 구조로 나타냅니다. DOM의 쓰임 DOM은 프로그래밍 언어는 아니지만 소프트웨어가 웹의 구조를 어떻게 이해하는지에 대한 표준입니다. JavaScript 같은 프로그래밍 언어가 DOM구조에 접근할 수 있는 방법을 제공하여 문서 구조, 스타일, 내용 등을 변경할 수 있게 하여, HTML과 CSS로 구성된 웹의 구조에 접근하고 컨트롤할 수 있습니다. JavaScript는 이런 문서 객체 모델을 ..