본문 바로가기

전체 글57

웹통신에서 사용하는 상태 코드(Status Code) 정보 1. 각각의 상태 코드에는 대응되는 상태 메시지가 있습니다. 모든 상태 코드(Status Code)는 각각 그에 대응되는 상태 메시지(Status Message)를 갖고 있습니다. 예를 들어, 우리가 배운 200번은 OK, 404번은 Not Found라는 상태 메시지를 갖고 있습니다. 각 상태 코드의 의미를 모두 외우기는 힘들기 때문에 이러한 상태 메시지는 상태 코드의 의미를 빠르게 파악하는데 도움을 줍니다. 2. 상태 코드는 100번대~500번대까지 있어요. 이전 영상에서는 상태 코드 200번과 404번만 봤는데요. 사실 상태 코드는 100번대부터 500번대까지 존재합니다. 그리고 각 번호대는 그것만의 의미를 가지고 있는데요. 각 번호대 별 주요 상태 코드들을 살펴봅시다. 각 상태 코드는 상태 코드 옆.. 2023. 11. 14.
REST API 이야기 REST API는 오늘날 많은 웹 개발자들이 Web API 설계를 할 때, 준수하기 위해 노력하는 일종의 가이드라인입니다. REST API를 이해하기 위해서는 일단 REST architecture가 무엇인지부터 알아야 하는데요. 일단 REST architecture에 대해 설명하겠습니다. REST architecture란 미국의 컴퓨터 과학자인 Roy Fielding이 본인의 박사 논문 'Architectural Styles and the Design of Network-based Software Architectures'에서 제시한 개념인데요. 그는 웹이 갖추어야 할 이상적인 아키텍처(구조)로 REST architecture라는 개념을 제시했습니다. 여기서 REST는 Representational St.. 2023. 11. 14.
자바스크립트 객체 표기법과 JSON 문법의 차이 1. JSON에는 프로퍼티의 이름과 값을 표현하는 방식에 제한이 있습니다. (1) JSON에서는 각 프로퍼티의 이름을 반드시 큰따옴표(")로 감싸줘야 합니다. 잠깐 자바스크립트 코드로 member라는 객체를 생성해볼까요? const member = { name: 'Michael Kim', height: 180, weight: 70, hobbies: ['Basketball', 'Listening to music'] }; 자바스크립트에는 객체를 생성할 수 있는 여러 가지 방법이 있는데요. 그중 한 가지는 이런 식으로 중괄호('{ }') 안에 객체의 프로퍼티의 이름(키)과 값(밸류)쌍을 순서대로 나열해서 생성하는 방법입니다. 지금 보이는 표기를 Object Literal이라고 하는데요. Object Liter.. 2023. 11. 14.
자바스크립트의 데이터 타입 관련 정리 자바스크립트의 데이터 타입 자바스크립트에는 8가지 데이터 타입이 있습니다. number string boolean undefined null object symbol bigint 자바스크립트의 유연한 데이터 타입 자바스크립트는 데이터 타입이 유연한 프로그래밍 언어입니다. 맥락에 유연하게 변하는 데이터 타입의 특징은 처음엔 생소하고 혼란스러울 수 있지만, 잘 이해하고 활용한다면 좀 더 간결한 코드를 작성하고 빠르게 개발할 수 있는 장점이 될 수 있습니다! Truthy 값과 Falsy 값 if, for, while 등 불린 타입의 값이 요구되는 맥락에서는 조건식이나 불린 타입의 값 뿐만아니라 다른 타입의 값도 불린 값처럼 평가될 수 있는데요. 이 때, false 처럼 평가되는 값을 falsy 값, true .. 2023. 11. 8.
자바스크립트에서 사용하는 다양한 이벤트 리스트 정리 마우스 이벤트 mousedown 마우스 버튼을 누르는 순간 mouseup 마우스 버튼을 눌렀다 떼는 순간 click 왼쪽 버튼을 클릭한 순간 dblclick 왼쪽 버튼을 빠르게 두 번 클릭한 순간 contextmenu 오른쪽 버튼을 클릭한 순간 mousemove 마우스를 움직이는 순간 mouseover 마우스 포인터가 요소 위로 올라온 순간 mouseout 마우스 포인터가 요소에서 벗어나는 순간 mouseenter 마우스 포인터가 요소 위로 올라온 순간 (버블링이 일어나지 않음) mouseleave 마우스 포인터가 요소에서 벗어나는 순간 (버블링이 일어나지 않음) 키보드 이벤트 keydown 키보드의 버튼을 누르는 순간 keypress 키보드의 버튼을 누르는 순간 ('a', '5' 등 출력이 가능한 키에.. 2023. 11. 7.
DOM 트리 중 요소 노드를 이동시킬 때 사용하는 프로퍼티 정리 요소 노드에 대한 이동 프로퍼티 프로퍼티유형결과 element.children 자식 요소 노드 element의 자식 요소 모음(HTMLCollection) element.firstElementChild 자식 요소 노드 element의 첫 번째 자식 요소 하나 element.lastElementChild 자식 요소 노드 element의 마지막 자식 요소 하나 element.parentElement 부모 요소 노드 element의 부모 요소 하나 element.previousElementSibling 형제 요소 노드 element의 이전(previous) 혹은 좌측(left)에 있는 요소 하나 element.nextElementSibling 형제 요소 노드 element의 다음(next) 혹은 우측(righ.. 2023. 11. 7.
자바스크립트로 태그 선택하는 방법 1. 자바스크립트로 태그 선택하기 메소드 의미 결과 document.getElementById('id') HTML id속성으로 태그 선택하기 id에 해당하는 태그 하나 document.getElementsByClassName('class') HTML class속성으로 태그 선택하기 class에 해당하는 태그 모음(HTMLCollection) document.getElementsByTagName('tag') HTML 태그 이름으로 태그 선택하기 tag에 해당하는 태그 모음(HTMLCollection) document.querySelector('css') css 선택자로 태그 선택하기 css 선택자에 해당하는 태그 중 가장 첫번째 태그 하나 document.querySelectorAll('css') css .. 2023. 11. 6.
Git의 PR merge에 대해 알아보자 Merge Pull Request 녹색 버튼 이 버튼을 누르게 되면 선택된 두 브랜치를 머지하게 되는데요. 위의 스크린샷에서 확인할 수 있는 것처럼 GitHub 에서는 이렇게 두 개의 브랜치를 머지하는 총 3가지의 방법이 있습니다. merge commit을 만들며 합치기 Squash and merge 하기 Rebase and merge 하기 각 방법들은 여러가지 장단점을 가지고 있습니다. 이제부터 각 병합 방법들이 어떤 방식으로 병합되고, 그 장단점은 무엇인지 알아보도록 하겠습니다. Merge Commit을 만들며 합치기 'Merge commit' 방식은 두 브랜치의 변경 사항을 모두 유지하면서 병합합니다. 이 방식을 사용하면, 각 브랜치의 변경 사항이 과거의 커밋으로 보존되고, 새로운 커밋이 추가되어 .. 2023. 10. 27.
Git의 Pull Request(PR)에 대해 알아보자 Pull Request(PR)란? 여러분이 새로운 회사에 합류했다고 가정해 봅시다. 이미 엄청난 양의 코드가 존재하는 프로젝트에 첫발을 내딛게 되었습니다. 아무래도 처음이다 보니, 작성한 코드가 완벽하게 동작할지 확신하기 어려운데요. 과연 내가 작성한 코드에 버그는 없을까요? 운이 좋다면 한 번에 잘 작동할 수도 있겠지만, 대부분의 경우에는 실수가 있을 겁니다. 그렇다고 바쁜 선배 개발자에게 매번 직접 확인을 부탁하는 것도 어려울 텐데요. 이때 바로 Pull Request 기능을 사용하면 됩니다. Pull Request란, 다른 GitHub 사용자들에게 자신의 작업한 내용을 검토하고 머지해 달라고 요청하는 GitHub의 기능입니다. 줄여서 PR이라고도 하는데요. PR을 활용하면 다른 개발자들에게 여유가 .. 2023. 10. 27.

티스토리툴바