카카오 맵 API (Kakao Map API) 카카오 맵 API 를 이용해서 내 프로젝트 안에 지도를 직접 구현해보자 카카오 개발자 (Kakao Developers) 카카오 개발자 페이지에 들어가보면 카카오 맵 뿐만 아니라 카카오 로그인, 카카오톡 소셜 등 다양한 API가 제공되는 것을 확인할 수 있다 https://developers.kakao.com/ Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다. developers.kakao.com 카카오에서 제공하는 개발자 API를 사용하기 위해서는 애플리케이션 추가가 필요하다 로그인 후 내 애플리케이션 메뉴에 접속해보자 애플리케이션 추가하..
로그인 처리 우리가 구현할 기능은 로그인 후 로그인 성공 페이지까지 진행할 것 이므로, 로그인 폴더와 로그인 성공 폴더 두개를 만들어 주자 // login 폴더의 index.tsx 화면 그려주기 import {useMutation,gql} from "@apollo/client" import {ChangeEvent} from "react" cosnt LOGIN_USER = gql` mutation loginUser($email:String){ loginUser(email: $email, password: $password){ accessToken } } ` export default function LoginPage(){ const [email,setEmail]=useState("") const [pass..
Recoil 프론트에서 자체적으로 생성되는 데이터는 어디다 넣어두냐! 라고 했을때 몇가지 방안들이 있지만, 그중에 recoil 이라는 라이브러리를 사용해보자 프론트에서 관리하는 데이터라고 해봤자 많은 부분을 차지하지 않을 텐데 리덕스를 사용하기에는 너무 헤비하기 때문에 recoil을 사용할 것이다 Recoil 설치 npm 사용자 : 터미널에 npm install recoil 을 입력 yarn 사용자 : 터미널에 yarn add recoil 을 입력 Recoil 세팅 //app.tsx 파일 import { RecoilRoot, atom, selector, useRecoilState, useRecoilValue, } from 'recoil'; function App() { return ( //RecoilRo..
글로벌 스테이트(global state) 글로벌 스테이트란, 여러컴포넌트에 사용되는 state다 전역상태관리(global state) 툴로는 context-Api, Redux, Recoil등이 있다 fetchPolicy recoil과 context-api를 보기전에 , apollo-client의 고급 기능을 먼저 보자 apollo-client로 global state를 만들게되면 Apollo-Cache 라는곳에 저장된다 만일 2번 컴포넌트에서 useQuery를 해오게 되면 useQuery를 해서 받아온 데이터가 Apollo-Cache에 저장된 후 컴포넌트로 들어온다 이후에 3번 컴포넌트에서 같은 데이터를 요청하게 되면, Apollo-Cache 에 먼저가서 데이터가 있는지 확인하고 없으면 백엔드에 요청을 ..