본문 바로가기

코딩/React42

TodoList_Lv2 Lv2 과제의 조건은 react-router-dom, styled-components, redux를 사용해서 TodoList를 제작하는 것이다. 구현해야 될 기능은 다음과 같다. Create Todo Read Todos, Todo Update Todo Delete Todo 요구사항은 다음과 같다. todos 데이터는 리덕스를 사용해서 전역으로 상태를 관리한다. todos 모듈은 Ducks 패턴으로 구현한다. Todo를 추가하면 제목 input과 내용 input은 다시 빈 값이 되도록 구현한다. input에 값이 있는 상태에서 상세페이지로 이동하는 경우, input의 value가 초기화 되도록 구현한다. Todo의 완료상태가 true이면, 상태 버튼의 라벨을 “취소”, false 이면 라벨을 “완료” 로 .. 2023. 4. 21.
JSON이란?(NoSQL 데이터 설계를 위한 기초지식) # JSON이란? 1. 개념 JSON : JavaScript Object Notation 자바스크립트 객체 문법에 토대를 둔, 문자 기반의 데이터 교환 형식 2. 구조 일반적인 JSON 구조는 자바스크립트 객체 리터럴 작성법을 따른다. 자바스크립트의 원시 자료형인 문자열, 숫자, 불리언을 가질 수 있고 중첩된 계층 구조 또한 가질 수 있다. { "squadName": "Super hero squad", "homeTown": "Metro City", "formed": 2016, "secretBase": "Super tower", "active": true, "members": [ { "name": "Molecule Man", "age": 29, "secretIdentity": "Dan Jukes", "po.. 2023. 4. 20.
REST(Path Variable vs Query Parameter) # REST API란? 1. 개념 REpresentational State Transfer의 약자로서, 어떤 자원에 대해 CRUD를 진행할 수 있게 HTTP Method(GET, POST, PUT, DELETE)를 사용하여 요청을 보내는 것. 이 때, 요청을 위한 자원은 특정한 형태로 표현된다. 간단히 말하면 “URI를 통해 정보의 자원을(only 자원만을) 표현하고, 자원의 행위는 HTTP Method로 명시한다.” 라고 말할 수 있다. 자원(Resource) : URI 행위(Verb) : HTTP Method 표현(Representations) GET /users/3/profile 위 요청을 아-무 지식이 없는 상태에서 예상해보면, user 중에서 3번 아이디를 갖고있는 사람의 프로필을 줘 라는 것을.. 2023. 4. 20.
비동기 프로그래밍 입문 # 비동기 프로그래밍 개요 1. 개념 비(not) + 동기적 프로그래밍이다. 그럼 먼저 동기적 프로그래밍이 뭔지부터 살펴보자. o 동기(synchronous)적 방식이란? 현재 실행중인 코드가 끝나야 다음 코드를 실행하는 방식 일반적인 프로그래밍 세계에서는 코드는 모드 동기적으로 실행된다. 즉, 앞선 코드가 끝나야만 그 다음 코드가 수행이 된다. // (1) const a = 1; // (2) const b = 2; // (3) console.log(`a의 값은 ${a}입니다.`); // (4) alert(`hello ${b}!`); // 항상 코드는 (1) -> (4)의 순서대로 실행이 됩니다. 이러한 방식을 동기적 방식이라 하고, 비동기는 그에 반한 방식이다. 비동기(asynchronous)적 방식이.. 2023. 4. 20.