본문 바로가기

TIL

(24)
TIL : json-server 환경 구축하고 axios를 이용하여 요청하기 json-server 나는 프론트엔드 개발자이고 , 백엔드 쪽 DB 와 서버는 아직 구축 안되었다고 가정하자. 프론트는 다 구축되었다. 그럴 때 나는 프론트단에서 패키지 하나만 설치하면 임시 데이터를 제공하는 서버를 설치한다. 그것이 바로 이 녀석 이다. https://www.npmjs.com/package/json-server json-server > [!IMPORTANT] > Viewing alpha v1 documentation – usable but expect breaking changes. For stable version, see [here](https://github.com/typicode/json-server/tree/v0). Latest version: 1.0.0-alpha.23, la..
TIL: 리덕스를 들어오다. 리덕스란? 우리가 부모 컴포넌트로부터 자식 컴포너트로 , 자식의 자식 ... 자식의 자식의 자식.... 으로 상태를 전달하는 패턴인 props-drilling 이 발생하지 않게 합니다. 말 그대로 전역해서 관리하게 해줍니다. 리덕스 흐름 살펴보기 예를 들어서 카운터를 생각해봅시다. 1. 버튼을 클릭 2. . 내가 클릭한 행위(=액션) 가 Reducer 함수에 들어감 3. 가 실행됨 , 상태값이 Store에 전달됨 4. UI의 값이 변경됨 리덕스 설치하기 ( feat. 리액트 ) # 다음 명령어를 통해 리액트 프로젝트를 설치합시다. > npx create-react-app my-app # 그 다음 명령어로 통해 리덕스를 구축하는데 필요한 패키지를 설치합니다. # 리덕스도 npm 을 통..
TIL : ES 6 문법 복습하기 let , const , var 변수 선언할 때 사용되는 키워드입니다. // let : 값이 변할 여지가 있는 변수 let day = 1; day = 2; // 값이 변할 수 있다. // let day = 20; 재선언을 하면 에러가 나온다. // const : 값이 변할 여지가 없는 변수 const yourBirthDate = "2000/11/04"; // yourBirthDate = "2000/11/02"; const는 한번선언하면 값을 수정할 수 없다. // console.log(yourBirthDate); TypeError: Assignment to constant variable. // var : 값을 할당과 선언 재할당과 재선언이 가능한 변수 ( ES6 나오기 전까지 쓰였음) // var a ..
TIL : TMDB API 키 발급받기 들어가며 설치 (https://docs.themeluxury.com/movieasap/getting-started/how-to-get-a-tmdb-api-key/) 오늘 이용할 데이터(https://developer.themoviedb.org/reference/movie-details) 데이터 가져오는 코드 API로부터 데이터 받아오기 1. 기본 틀을 붙여넣기 한다. 2. 발급받은 `api키`를 url에 붙여넣기 한다. const apikey = '당신의 api 키'; const url = `https://api.themoviedb.org/3/movie/${movieId}?api_key=${apiKey}`; 3. 웹사이트를 실행한다. 다음에 의해 크롬 개발자 도구 창의 콘솔에 json형식의 데이터가 나온..