본문 바로가기

전체 글

 (64)
[Week 6-1] React 데이터 흐름의 이해와 비동기 요청 처리 Before You Learn 서버에서 정의한 API 문서를 통해, 서버가 제공하는 리소스를 이용할 수 있다. API 테스팅 툴 Postman을 이용할 수 있다. AJAX 통신을 가능하게 하는 fetch API를 이용할 수 있다. UI를 구성하고, 컴포넌트를 분리할 수 있다. React의 props와 state 개념을 이해할 수 있다. 무엇을 React state(상태)로 두어야 하는지 알 수 있다. Achievement Goals React 데이터 흐름 React에서의 데이터 흐름, 단방향 데이터 흐름을 이해할 수 있다. 어떤 컴포넌트에 state가 위치해야 하는지 알 수 있다. State 끌어올리기의 개념을 이해할 수 있다. 상태 변경 함수가 정의된 컴포넌트와, 상태 변경 함수를 호출하는 컴포넌트가 ..
[Week 5-2] HTTP/네트워크 실습 Achivement Goals REST API에 대해 이해할 수 있다. REST API 문서를 읽을 수 있다. REST API에 맞춰 디자인할 수 있다. Open API와 API Key에 대해 이해할 수 있다. Postman이 무엇인지 이해하고 사용할 수 있다. HTTP API 테스팅이 무엇인지 알 수 있다. Postman을 사용하여 서버에 GET, POST 요청을 보내고 응답을 받을 수 있다. (Optional) Postman을 사용하여 Open Weather Map Open API에 요청을 보낼 수 있다. Chrome Network Tab을 이해할 수 있다. Chrome Network Tab 사용 방법을 익히고 사용할 수 있다. REST API란? REST API는 웹에서 사용되는 데이터나 자원(Re..
[Week 5] HTTP/네트워크 기초 시작하기 앞서 Achievement Goals 클라이언트-서버 콘셉트를 이해할 수 있다. 클라이언트-서버 아키텍처를 이해할 수 있다. HTTP를 이용한 클라이언트-서버 통신을 이해할 수 있다. API의 개념을 이해할 수 있다. 브라우저의 작동 원리를 이해할 수 있다. 보이지 않는 곳의 통신을 이해할 수 있다. URL과 URI의 차이를 이해할 수 있다. IP 주소와 PORT에 대해 이해할 수 있다. DNS와 IP 주소의 관계를 설명할 수 있다. 크롬 브라우저의 에러 메시지를 통해 문제를 파악할 수 있다. 보이는 곳의 통신을 이해할 수 있다. AJAX의 개념을 이해할 수 있다. SSR과 CSR의 차이를 이해할 수 있다. CORS의 개념을 이해할 수 있다. HTTP messages의 구조를 설명할 수 있다. ..
[Week 4-2] JS/Node 비동기 시작하기 앞서... 위 예시를 읽고, 아래 개념을 대략적으로 이해할 수 있다. blocking / non-blocking synchronous / asynchronous callback 함수 전달 방법을 알고 있다. method chaining(Array의 map, filter 등을 연결해서 쓰는 법)을 할 수 있다. Achievement Goals 어떤 경우에 중첩된 callback이 발생하는지 이해할 수 있다. 중첩된 callback의 단점, Promise의 장점을 이해할 수 있다. Promise 사용 패턴을 이해할 수 있다. resolve, reject의 의미와, then, catch와의 관계를 이해할 수 있다. Promise에서 인자를 넘기는 방법을 이해할 수 있다. Promise의 세 가지 상태..
[Week 4] 재귀함수 시작하기 앞서 어떤 문제가 있다고 가정할 때 이 문제를 동일한 구조의 더 작은 문제로 나눌 수 있고, 이 작은 문제를 해결함으로써 전체 문제를 해결하는 방법을 재귀(recursion)라고 한다. 재귀를 사용한 코드는 대부분의 경우 더욱 간결하고, 이해하기 쉽다. 그 밖에도 재귀는 알고리즘 문제의 많은 부분을 차지한다. 재귀 재귀적으로 사고하는 법 잘게 쪼개어 사고하는 법 재귀적 사고 함수 자신의 재귀적 호출 탈출 조건 재귀 함수의 활용 (트리 구조) 트리 구조에 재귀 함수를 활용 JSON 구조에 재귀 함수를 활용 DOM 구조에 재귀 함수를 활용 Achievement Goals Lesson - 재귀 함수 재귀의 의미에 대해서 이해하고, 자바스크립트에서 재귀 호출을 할 수 있다. 재귀를 언제 사용해야 하는지..
[Week 3-3] React 기초 ### 사전 지식 HTML / CSS 기초 자바스크립트 기초 함수형 프로그래밍과 고차 함수 개념에 대한 이해 배열 내장 메서드 기초 ES6 문법에 대한 이해 ## React intro ### 목표 React의 3가지 특징에 대해서 이해하고, 설명할 수 있다. JSX가 왜 명시적 인지 이해하고, 바르게 작성할 수 있다. React 컴포넌트(React Component)의 필요성에 대해서 이해하고, 설명할 수 있다. create-react-app으로 간단한 개발용 React 앱을 실행할 수 있다. JSX란? React에서 UI를 구성할 때 사용하는 문법으로, JS를 확장한 문법이다. 이 문법을 통해 React element를 만들 수 있다. 하지만 브라우저는 JSX를 읽을 수 없기 때문에 Babel을 통해서..
[Week3-2] JS/Node 고차함수 ## 고차 함수(higher order function) 이해하기 ### 목표 일급 객체(first-class citizen)의 세 가지 특징을 설명할 수 있다. 고차 함수(higher-order function)에 대해 설명할 수 있다. 고차 함수를 자바스크립트로 작성할 수 있다. 자바스크립트에서 함수는 다음과 같이 특별한 취급을 받는다. 변수에 할당(assignment) 할 수 있다. 다른 함수의 인자(argument)로 전달될 수 있다. 다른 함수의 결과로써 리턴될 수 있다. 함수를 변수에 할당할 수 있기 때문에 이는 함수를 데이터(string, number, boolean, array, object)를 다루듯이 다룰 수 있다는 걸 의미한다. 1. 변수에 함수를 할당하는 경우 /* * 아래는 변수 ..
[Week3] 자료구조 기초 ## 자료구조 기초 ### 목표 자료구조가 무엇인지 설명할 수 있다. Stack, Queue, Tree, Graph 자료구조에 대해 이해할 수 있다. 알고리즘 문제에서 Stack, Queue 자료구조를 배열로 대체하여 흉내낼 수 있다. 각 자료구조의 개념과 구조를 파악하고 목적을 이해할 수 있다. 알고리즘 문제의 각 상황에 맞는 자료구조를 떠올릴 수 있다. 트리 및 그래프의 탐색 기법에 대해 이해할 수 있다. Binary Search Tree를 이해할 수 있다. BFS와 DFS의 개념을 이해하고 알고리즘 문제에서 사용할 수 있다. 자료구조를 활용하여 알고리즘 문제에 접근할 수 있다. 자료구조란 여러 데이터들의 묶음을 저장하고, 사용하는 방법을 정의하는 것을 말한다. 데이터는 분석하고 정리하여 활용해야만 ..

티스토리툴바