JWT(JSON Web Token)은 정보 수신/송신자 간에 정보를 JSON 객체로 안전하게 전송하기 위한 간결하고 Self-contained한 방법을 정의하는 개방형표준(RFC 7519)이다. 이 정보는 디지털 서명되어 있으므로 확인 및 신뢰가 가능하다. JWT는 S
R프로젝트 진행중에 fake-server중에 가장 간편하게 사용할 수 있는 라이브러리를 찾았다.설치해주고, src폴더 밖에 0000.json 파일을 만든다나는 test.json으로 만들었다맡은 모듈의 백엔드 담당자분께 넘어오는 데이터 형식을 받고 채워 넣어준 다음, 터
Recoil은 redux와 마찬가지로 상태관리를 위한 JS 상태관리 툴이다.context API 기반으로 구현되어 있으며, 함수형 컴포넌트에서만 사용할 수 있음Recoil 설치리코일 state를 사용하는 컴포넌트들은 <RecoilRoot>를 필요로 한다. <
Axios docs - interceptor를 보면 Promise 응답에 대해 then, catch로 처리되기 전에 요청과 응답을 가로챌 수 있다고 나와있음.처음엔 refreshToken 자동발급을 해결하기 위해 사용했는데, 사용하다보니 정말 편하다는걸 느꼈다위 코드를
AWS EC2 인스턴스 생성과정, 배포는 https://sunnyfterrain.github.io/devlog/tips-ec2.html 해당 블로그를 참고했다. 배포 과정에서 오류들이 많이 생겼었다. 서버 생성후, 서버에 배포할 웹페이지를 clone하는 과정에서
현재 진행중인 쇼핑몰 프로젝트에 react-query 를 적용했는데, 일단 급하게 useQuery만을사용하여 data를 fetching 하는데만 react-query를 사용하고 있었다. queryClient와, Mutation을 적용, 리팩토링할 코드를 찾다가 아주 좋
예비군 끝나고 쉴까 했지만 한번 놔버리면 계속 놔버린다는걸 이때까지 많이 느껴왔기 때문에 할건해야지..주문한 상품들의 상품ID, 수량을 넣어주면 주문이 들어가고,백엔드에서 응답값으로 주문번호 생성, 결제모듈에 필요한 데이터들을 반환해준다.결제모듈을 붙이기 전에 Type
프론트엔드에서 차트 정보를 표현하기 위해 사용가능한 라이브러리들은 많지만가장많이 사용한 라이브러리인 rechart는 입사 기술과제로 구현해본 경험이 있어다른 라이브러리를 이용해 보고 싶었는데, 제일 깔끔하고 사용하기 간편해보이는 ApexChart를 골랐다.먼저, htt
원래는 pageNation으로 구현하려 했지만 상품이외의 기능들은 다 pageNation으로 구현이 되어있어서 react-query를 공부할겸 인피니티 스크롤을 사용 해보고 싶어서 적용하기로 결정했다.상품정보를 나타내는 페이지에서 react-infinite-scroll
하하 새벽4시까지 6시간을 인피니티 스크롤 오류고치는데 소모했다 그런데 작성한 코드 단 3줄,, 해결했을 때는 재밌고 기분이 좋았지만6시간짜리 커밋을 날리고 내역을 확인한 순간 현타가 몰려왔다 그래도 해결했으니까..서버에 등록된상품 개수는 총 28개, 한번에 받아오는
백엔드에서 제공한 필터링 기능의 사용법은 먼저, filter에 사용할 컴포넌트들을 먼저 만들어보자.프로젝트가 모자 쇼핑몰이라 카테고리 대신 색상을 필터링해야함.. + 가격 필터링 각각 색상필터링에 사용할 버튼, 가격 필터링에 사용할 버튼 컴포넌트들이다.TypeScrip
Oauth2를 이용한 카카오 로그인을 구현원래는 API KEY, REDIRECT URL을 내가 설정해줘야 하지만 백엔드에서 카카오로그인 URL을 만들어줬고, 나는 백엔드에서 설정한 REDIRECT URL에서 토큰값만 받아와 적용시키면 되는 구조였다. 따라서 APIKEY
프로젝트 초기에는 상품정보 전체를 받아와 해당값들에서 검색값과 일치하는 항목을 highlights 처리해주고 리스트로 뿌려주기만 했었다. 별로 효율적인 방법은 아니었고백엔드에서 만들어둔 상품필터 기능을 통해 개선해야지 생각하고 있었다.여기 들어가는 query 값이 검색
요즘 프론트엔드 개발형식은 자주 쓰이는 React, Vue, Angular 등 자바스크립트 기반으로 되어있는 프레임워크, 라이브러리로 개발을 한다. TMI 프레임워크, 라이브러리 라는 단어를 사용하니 저번 면접때 정말 기본적이고, 익숙한 단어인 프레임워크와 라이