본문 바로가기

분류 전체보기

 (265)
[React] 소셜로그인- 네이버 (사이트 API등록) https://developers.naver.com/docs/login/web/web.md Web 애플리케이션 - LOGIN 네이버 로그인은 서버 사이드 언어인 PHP나 Java로 개발한 웹 애플리케이션에도 적용할 수 있습니다. 또한 프런트엔드에서 사용하는 JavaScript를 사용해도 적용할 수 있습니다. API 호출 예제 예제 developers.naver.com 공식사이트API 참고 https://developers.naver.com/apps 애플리케이션 - NAVER Developers developers.naver.com 방법 아래 참고) https://codebibimppap.tistory.com/12 [JAVA] 네이버 소셜 로그인 REST API 적용하기 Java SpringBoot 환경에..
[React] 소셜로그인-FaceBook1(사이트 API 등록) https://developers.facebook.com/apps 로그인 또는 가입하여 보기 Facebook에서 게시물, 사진 등을 확인하세요. www.facebook.com 페이스북 소셜 로그인 AppID와 Secret Key 설정 방법 페이스북에서 제공하는 소셜 간편 로그인을 이용하기 위해 페이스북 개발 페이지로 들어가서 AppID와 Secret Key를 발급받는 과정을 설명합니다. medipress.co.kr 이번 포스트에서는 워드프레스에서 페이스북(Facebook)의 소셜로그인(간편로그인)을 이용할 수 있도록 개발자 환경에서 AppID와 Secret Key를 얻는 방법에 대해 살펴봅니다. 페이스북이나 구글, 트위터 등 소셜네트워크 회사에서는 자체적으로 여러 종류의 개발서비스환경을 구축하고 홈페이지..
[React] 소셜로그인 -구글2 (인가코드 받기 참고) 웹 서버 애플리케이션용 OAuth 2.0 사용 | Authorization | Google for Developers 이 페이지는 Cloud Translation API를 통해 번역되었습니다. Switch to English 의견 보내기 웹 서버 애플리케이션용 OAuth 2.0 사용 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분 developers.google.com 아래는 참고 사이트의 내용) 구글은 처음 전송하는 부분에서 카카오와 네이버랑은 조금 차이가 있습니다. 카카오와 네이버는 response type, client id, redirect uri를 받았다면, 구글은 추가로 scope을 받습니다. https://accounts.google.com/o/oauth2/v2/auth..
[React] 소셜로그인 -구글1 (사이트 API 등록) https://www.traderharu.com/2021/08/10/%EA%B5%AC%EA%B8%80-%EC%86%8C%EC%85%9C-%EB%A1%9C%EA%B7%B8%EC%9D%B8-api-%ED%82%A4-%EB%B0%9C%EA%B8%89-%EB%B0%A9%EB%B2%95/ 구글 소셜 로그인 API 키 발급 방법 - TraderHaru 구글 소셜 로그인 기능을 구현하기 위해 API키를 발급 받는 방법에 대해 그림과 함께 상세하게 설명 해 두었습니다. 구글 OAuth 키 발급에 시간을 낭비하지 말자!! www.traderharu.com 아래내용은 위 블로그 내용) 구글 소셜 로그인 API 키 발급 방법 01. 구글 개발자 사이트로 이동 https://console.developers.google.co..
[React] .env 적용안되는 오류 react 에서 숨기고자 하는 url 같은 것을 따로 .env 파일에 작성하면 안보인다. 1. .env 파일을 생성하고 코드를 작성한다.(REACT_APP으로 시작하기) REACT_APP_KAKAO_REST_API_KEY=~~~ 2. 사용하는 파일에서 선언한것을 이용해 사용하면 된다.(process.env.~) const KAKAO_REST_API_KEY = process.env.REACT_APP_KAKAO_REST_API_KEY; >>err 적용이 안되서 나중에 보니 VS CODE를 껐다 켜야 적용된다. 꼭 .env파일을 작성 후에는 다시 켜자..!!!!!
[React] Emotion CSS(인라인) 사용하려면 주석을 이용(CRA) error message You are loading @emotion/react when it is already loaded. Running multiple instances may cause problems. This can happen if multiple versions are used, or if multiple builds of the same version are used. You have tried to stringify object returned from css function. It isn't supposed to be used directly (e.g. as value of the className prop), but rather handed to emotion so it can h..
[React] MUI 모달창 만들기 아래 블로그 내용 참고하여 만들었음. https://cocoder16.tistory.com/84 리액트 모달창 만들기 2가지 방법 방법 1. 직접 모달창 컴포넌트 만들기 먼저 모달창으로 사용할 UI 컴포넌트를 만들기 위해 Modal.jsx 파일을 생성합니다. * Modal.jsx function Modal() { return ( Modal ); } 이 모달 컴포넌트를 렌더링할 부모 cocoder16.tistory.com https://mui.com/material-ui/react-modal/ React Modal component - Material UI The modal component provides a solid foundation for creating dialogs, popovers, ligh..
[React] npm i 에러 해결(--force, --legacy-peer-deps) 기존 프로젝트를 클론 후 npm i를 했더니 오류가 발생하였다. 내 react 버전과 기존 프로젝트 버전이 맞지 않아 생기는 오류라고 한다. 해결은 아래 블로그 내용을 참고하였다. 나는 아래 실행으로 해결 되었다. (설치후 기존 start에 따라 npm run start:local 했더니 실행됨) npm i --legacy-peer-deps + recoil-persist 를 추후 설치하고 싶은데 버전때문에 오류가 남. 아래로 진행하자 설치됨 npm i --legacy-peer-deps recoil-persist https://naveen.tistory.com/22 NPM 인스톨 에러 --force, --legacy-peer-deps 작년인가 재작년인가 세팅한 프로젝트와 동일한 구성으로 새로운 프로젝트를 ..

티스토리툴바