현재 사주&타로 프로젝트를 만들고있다. + 포춘쿠키 기능 (헿)사용자가 자신의 결과를 쉽게 공유할 수 있으면 좋겠다는 생각에 SNS 공유 기능을 살펴보았고, 사용자가 많은 카카오톡과 먼저 연동하는 작업을 진행했다.카카오 디벨로퍼스 플랫폼 등록[Kakao Developers카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.developers.kakao.com](https://developers.kakao.com/)카카오 API를 활용할 수 있는사이트.회원가입 후 내 애플리케이션 - 앱설정 - 플랫폼 에 들어가서 사이트 도메인을 등록해준다.사이트 도메인에 테스트 가능한 도메인을 입력한다. localhost 테스트때는 꼭..

포스트맨 무료버전을 쓰다가 항상 모자라서 새로 아이디 파는게 귀찮아서 MSW를 쓰게됐다. 그리고 콜렉션을 export 해둘 필요가 없어 다른사람들이 나중에 운영할 때도 편할 것 같았다. 구글에 있는 msw 세팅을 따라했더니 오류들이 발생해서 새로 쓰는 글 (항상 공식문서 Getting started부터 따라하자) 오류발생 코드import { rest } from 'msw' export const personHandlers = [ rest.get('/api/get-names', (req, res, ctx) => { const names = ['jimi', 'john', 'scott', 'queen'] return res(ctx.status(200), ctx.json(names)) }), ] export c..

RTK만 쓰다가 사내 스터디를 하게돼서 Zustand랑 TanStack Query 자료를 준비하게되었다. 회사에서 시연용으로는 포켓몬 API (무료 API중 제일 재밌 ㅇ_ㅇㅋㅋ)를 준비해서 가져갔다. 아래는 설명용으로 만든거! 블로그에도 쪄놔야지 히히 React + Zustand + Tanstack Query Zustand? Redux, Recoil 등과 함께 전역 상태를 관리할 수 있는 라이브러리. Redux와 개념적으로 비슷(Flux패턴을 채택)하기 때문에 Redux, RTK사용자가 학습하기 쉽다. Flux Pattern? 2014년 facebood F8컨퍼런스에서 발표된 아키텍처로, Client-Side 웹 애플리케이션을 만들기위해 사용하는 디자인 패턴 사용자 입력을 기반으로 Action을 만들고..

작년에 입사하고 회사에서 팀원간 스터디용으로 정리했던건데, 숙녀분께서 필요하다고 하셔서 티스토리로 두두등장 :)Redux?상태 관리 라이브러리중 하나로 현재까지 가장 많이 쓰이고있다. 상태관리란 UI/UX에 맞게 데이터를 관리하거나 서버와 주고받는 데이터들을 관리하는 것을 말한다. 프로젝트가 복잡하고 크기가 커질수록 상태관리의 난이도는 크게 올라간다. (이를 해결하기위해 전역으로 상태를 관리할 수 있는 라이브러리를 쓰게되는데, redux, MobX, recoil등을 사용할 수 있으며 children을 사용하는 방법도 있다.) props drilling리액트 특성상 단방향으로 prop을 하위 컴포넌트로 전달하는 용도로만 쓰이게 되는데, 프로젝트가 커지다보면 위처럼 해당 데이터를 받기위해 필요없는 컴포넌트에..

변태숙녀와 드디어 딥다이브 스터디를 시작했다. 더이상 미루면 답이 없을것같아서 일단은 숙녀분이 스터디를 하지않는 목요일에 우리의 자스 스터디를 넣기로 했다. 목요일 오후 9시 딥다이브 1강씩 가늘고 길게 보기로 했다 :) 2월 15일 첫 스타트 04장 변수 스터디 내용 기록 시자쿠 변수가 왜 필요할까? - 컴퓨터는 CPU를 사용해 연산하고, 메모리를 사용해 데이터를 기억한다. - 메모리는 데이터를 저장할 수 있는 메모리 셀의 집합체다. 메모리 셀 하나의 크기는 1바이트(8비트)이며 컴퓨터는 메모리 셀의 크기, 즉 1바이트 단위로 데이터를 저장하거나 읽어들인다. - 각 셀은 고유의 메모리 주소를 갖는다. 10 위 예제의 숫자값 10은 메모리상의 임의의 위치(메모리주소)에 기억(저장)되고 cpu는 이 값을 ..