개발에 AtoZ까지

◆목표 REST의 정의 REST의 특징 REST API 정의 REST API 사용법 RESTful 정의 1. REST의 정의 - REST(Representaional State Transfer) 란 기기간의 자원을 이름(자원의 표현)으로 구분해 자원의 상태를 웹 기술인 HTTP 프로토콜을 활용하여 주고받는 것을 의미합니다. 즉, 분산 시스템을 위한 HTTP 기반 소프트웨어 아키텍처이다. Tip) 자원, 자원의 표현, 상태, 분산 시스템 자원 : 해당 소프트웨어가 가지고 있는 모든 것 자원의 표현 : 자원에 이름을 명시적으로 정하는 것, ex) 고객정보를 customer로 정의하는 것 상태 : 자원의 상태(정보)를 전달하는 것, 전달하는 방법에는 JSON, XML를 주로 사용함 분산 시스템 : 하나의 시스..

◆목표 DOM 객체 생성 DOM 객체 읽기 DOM 객체 수정 DOM 객체 삭제 1. DOM 객체 생성 메서드명 설명 document.createElement(태그명) HTML 요소 생성하기 document.appendChild(요소명) HTML 요소 추가하기 2. DOM 객체 읽기(찾기) 메서드 설명 document.getElementById(아이디명) id로 찾기 document.getElementsByTagName(태그명) 태그로 찾기(배열로 리턴, 복수) document.getElementsByClassName(클래스명) class 이름으로 찾기(배열로 리턴, 복수) document.querySelector(css명) css Selector로 찾기(첫번째 요소만 선택됨) document.queryS..

◆목표 DOM의 정의 웹브라우저 동작과정 BOM의 정의 1. DOM(Document Object Model)의 정의 -구조화된 문서(Document)를 객체로 표현하는 방식 2. 웹브라우저 동작 과정 1) HTML 파일을 웹서버로 부터 가져옴 2) 가져온 HTML 파일을 파싱(Parsing) 하여 Dom Tree 생성, Css 정보를 파싱(Parsing)하여 Cssom Tree 생성 3) 파싱한 Dom Tree와 Cssom Tree를 기반으로 Render Tree를 생성 4) 생성한 Render Tree로 Rendering을 하고 그것으로 사용자에게 페이지를 보여줌 Tip) 자바스크립트 선언 위치 - HTML 코드를 기반으로 DOM 트리를 구성하기 때문에 DOM 트리를 구성하기 전에 자바 스크립트로 HT..

1. 문제 Every email consists of a local name and a domain name, separated by the @ sign. For example, in alice@leetcode.com, alice is the local name, and leetcode.com is the domain name. Besides lowercase letters, these emails may contain '.'s or '+'s. If you add periods ('.') between some characters in the local name part of an email address, mail sent there will be forwarded to the same address ..

1. 문제 Given a non-empty array of digits representing a non-negative integer, plus one to the integer. The digits are stored such that the most significant digit is at the head of the list, and each element in the array contain a single digit. You may assume the integer does not contain any leading zero, except the number 0 itself. Example 1: Input: [1,2,3] Output: [1,2,4] Explanation: The array ..

1. 문제 We have a list of points on the plane. Find the K closest points to the origin (0, 0). (Here, the distance between two points on a plane is the Euclidean distance.) You may return the answer in any order. The answer is guaranteed to be unique (except for the order that it is in.) Example 1: Input: points = [[1,3],[-2,2]], K = 1 Output: [[-2,2]] Explanation: The distance between (1, 3) and ..

◆목표 Promise 등장 배경 및 정의 Promise 사용법 콜백 지옥에 대한 Promise 해결법 Promise의 기타 문법 1. Promise 등장 배경 및 정의 - 콜백함수의 단점인 콜백 지옥을 해결하기 위해 등장 - 비동기적 처리의 근본적인 문제점이였던 서버에서 데이터를 받아오기 전에 화면에 데이터를 표시하려고 할 때 발생하는 오류를 해결하기 위해 등장 - ES6에서 부터 추가된 문법으로 비동기 처리를 위해 기존에 있던 단점들을 보완하기 위해 사용됨 2. Promise 사용법 promise 객체를 생성 promise 객체는 executor라는 함수가 내부적으로 자동적으로 실행되는데 executor 함수에서는 resolve와 reject라는 두개의 함수를 인자로 받아서 비동기 처리 함수를 실행함 ..

◆목표 동기/비동기 정의 비동기 처리 사용되는 곳 비동기 처리 사용법(SetTimeout) 비동기 처리의 문제점 및 해결방안 1. 동기 / 비동기 처리의 정의 - 동기적 처리 요청을 보낸 후, 해당 요청의 응답이 올 때까지 다른 작업을 하지 못하는 방식 즉, 코드 한줄 실행이 완료되어야지만 다음 줄 실행이 가능하다는 뜻 - 비동기적 처리 요청을 보낸 후, 해당 요청의 응답과 상관없이 다른 작업을 하는 방식 즉, 코드 한줄 실행 후 결과와 상관없이 다음 줄 실행한다는 뜻 2. 비동기 처리 사용되는 곳 - 보통 오래걸리는 기능들은 비동기적 방식으로 처리함 Rest API 요청 파일/데이터베이스 처리 타이머, 암호화/복호 화등 3. 비동기 처리 사용법(setTimeout) 1) setTimeOut() - 사용..