Redux-Thunk로 프로미스 다루기

Redux-thunk

Redux 알아보기

Jest에서 "mock"은 테스트 중에 특정 객체나 함수의 동작을 흉내내거나 대체하는 기능을 의미한다. 이를 통해 테스트 시나리오에 필요한 가짜 동작을 정의하거나, 의존성을 가진 모듈을 격리하여 테스트할 수 있다. 즉, 테스트하기 위해서 흉내만 내는 함수라고 생각할 수

Javascript로 코드를 작성하다보면 비동기 통신을 할 때가 굉장히 많다. Jest로 비동기 통신을 어떻게 테스트 할 수 있는 지 알아보자. 추가로 describe 문법과 테스트 전후에 해줄 수 있는 헬퍼에 대해서 알아보도록 하겠다.다음과 같은 비동기 함수가 있다고

사이드 프로젝트를 하면서 React Testing-Library를 사용해보려고 한다. React Testing-Library는 Jest 기반으로 가장 많이 사용하기 때문에 Jest의 기초를 배워보고 내 사이드 프로젝트에 어떻게 적용했는지를 글로 작성하려고 한다.Jest

Nodejs 환경에서 유저가 회원가입을 하면 유저의 \_id 값을 이용하여 Collection을 자동으로 생성하는 방법을 알아보자. 구글에 나와있는 방법은 버전이 맞지 않아서 잘 동작하지 않는 것 같아 공식 문서를 참고하였다.MongoDB 공식문서 (createColl

이 문서는 Recoil 공식문서를 참고하여 제가 이해한 방식으로 작성한 글입니다. 틀린 부분이 있으면 알려주시면 감사하겠습니다!Recoil팀에서 말하는 React 자체에 내장된 상태 관리 기능의 한계점은 다음과 같다.컴포넌트의 상태는 공통된 상위요소까지 끌어올려야만 공

multer 10분만에 뚝딱하기

지난 글에서 JWT 개념에 대해서 이해하였으니 이번 글에서는 React / TS 환경에서 JWT를 어떻게 구현하였는지를 포스팅하려 한다.사용자가 로그인을 하여 서버로 Client단에서 입력한 아이디와 비밀번호를 실어서 POST 요청을 하면 DB에 저장된 회원정보와 Cl

이번 포스팅에서는 Session과 JWT의 차이점, 장단점에 대해서 포스팅하고, 다음 포스팅에서 내가 이해한 React + Express로 JWT를 구현하는 방법에 작성하려고 한다 세션은 브라우저와 웹 서버가 연결되어 브라우저가 종료될 때까지의 시점이다. 브라우저를 통

React의 여러 디자인 패턴 중 아토믹 패턴에 대해서 알아보자!!!가장 작은 컴포넌트 단위를 Atoms로 설정하여 이를 바탕으로 상위 컴포넌트를 만들어 코드 재사용을 최대화하는 방법론상위 컴포넌트는 순서대로 분자(Molecules), 유기체(Organisms), 템플

Node.js (Express)에 MongoDB 연결하는 방법을 알아보자. 공식문서를 참고하여 최신버전인 5.2버전에서 잘 적용된다. MongoDB 계정 세팅 우선 MongoDB 홈페이지에 접속해서 계정을 만들고, database를 만든 뒤에 Collection까지

사이드 프로젝트를 할 때 create react-app으로 프로젝트를 시작하곤 하는데 최근에 TypeScript를 배우고 나서 React에 TS를 얹어서 프로젝트를 생성하고 나니 src내에 모르는 파일이 너무 많았다... 이참에 폴더 구조를 한번 정리해보려고 한다. 전체적인 폴더 구조 전체적인 폴더 구조는 다음과 같다. 1. node_modules CR...

Intro > React로 사이드 프로젝트를 진행하려는 와중에 server로 node+express를 사용하려고 한다. 좋은 포스팅들이 많았지만 왜 이런식으로 구현해야하는지 이해가 잘 되지 않아서 찾아보면서 내가 이해한 방법으로 포스팅하려고 한다. 서버와 React의 존재 이유 서버란? 서버는 클라이언트에게 여러 가지 서비스를 제공하는 것을 뜻한다. 평소...