React

항상 자바스크립트로 리액트를 사용해보다 타입스크립트를 공부해보고자 타입스크립트에서 리액트를 한 번 시작해보려고 한다. 프로젝트 생성 > npx create-react-app appName --template=typescript or > yarn create reac

Eslint Eslint 설치 > npm install eslint --save-dev or yarn add eslint --dev Eslint config 파일 초기화 > yarn eslint --init 위의 명령어를 입력하면 @eslint/create-conf

Typescript 환경에서 구현 중인 프로젝트에서 회원가입과 로그인을 맡게 되었고 먼저 회원가입부터 어떤 방법으로 구현했는지 공유해보고자 한다. 🛠 기능 > 1. 아이디, 비밀번호, 이메일, 휴대폰 번호 유효성 검사 > 2. 비밀번호 확인 > 3. 아이디, 이메일

로그인하면 아마 가장 먼저 token이 떠오를 것이다. 현재 token은 사용자를 식별하는데 중요한 요소로 많은 곳에서 이용되고 있다.오늘은 실제로 프로젝트에서 로그인 기능을 구현하면서 token을 어떻게 사용했는지 즉, 서버로부터 받아온 token을 어떻게 cooki

이전 글에서 로그인 시 access token과 refresh token을 쿠키에 저장하는 방법과 refresh token을 사용하여 새로운 access token을 가져오면서 로그인을 유지하는 방법에 대해 알아보았다. React + Redux + Redux-Saga

리액트를 사용하다보면 이 경고를 많이 봤었을 것이다.Warning : Each child in a list should have a unique "key" propkey를 할당해주지 않아서 생긴 경고로 map을 사용할 때 추후 수정이나 삭제를 할 때 어떤 요소를 의미하

LocalStorage를 사용하여 브라우저에 데이터를 저장해보고자 한다.

프로젝트를 하면서 id를 index처럼 구현하다 게시글 추가, 삭제에서 id 중복 등 여러 문제점이 발생했었다.이를 해결하고자 사용했던 방법을 소개해보고자 한다.Date() 생성자 사용하기milisecond까지 나타내주는 Date() 생성자를 사용하여 id로 값을 부여

프로젝트를 배포해보고자 Netlify를 사용하던 도중 배포 과정에서 build error를 마주쳤다.

프론트엔드는 서버와 데이터 통신을 하면서 서버에 있는 데이터를 가져와서 보여주는 경우가 많다. 이때 네트워크에서 가져온 데이터의 상태를 관리할 수 있게 도와주는 라이브러리로 React Qeury를 많이 사용하고 있다.비지니스 로직의 재사용을 위해 React Hooks을

날씨 api를 호출하던 도중 .env에서 정의한 API Key에서 undefined로 반환되어 401 (unauthorization) 에러가 발생했다.Key값도 올바르고 .env 파일도 최상단에 있었는데 에러가 발생했고 .env 파일에 있는 Key를 가져오려면 dote