분류 전체보기
-
[firebase 보안오류] Firebase: This domain is not authorized for OAuth operations for your Firebase project. Edit the list of authorized domains from the Firebase console. (auth/unauthorized-domain).React 2022. 9. 23. 17:37
문제 : github에 배포 후에 소셜 로그인이 작동되지 않고 아래 에러 메시지 창이 뜬다. 이유: 파이업이스의 접근 권한 보안 설정으로 도메인이 인증되지 않아 firebase의 접근이 막혀있다. 해결 방법 : firebase 콘솔 >> Authentication >> setting >> 승인된 도메인에 url을 적어준다. 단, 위 사진처럼 도메인에 https를 제외하고 적어주어야 한다. 위 과정대로 하면 배포된 도메인에서 firebase가 실행되는 것을 볼 수 있다.
-
[firestore에러] Firebase Storage: An unknown error occurred, please check the error payload for server responseReact 2022. 9. 23. 13:19
문제점: 파이어 스토어에 이미지 업로드를 할 수 없다. 이유 : 파이어스토어의 보안 규칙이 업로드를 제한하고 있기 때문이다. 해결방법 : 파이어 스토어 >> 콘솔 >> 빌드 >> storage >> Rules 에 들어가 규칙을 아래와 같이 수정해준다. rules_version = '2'; service firebase.storage { match /b/{bucket}/o { match /{allPaths=**} { allow read, write: if true; } } } 그럼 사진이 저장이 되는 것을 확인할 수 있다. 참고 사이트 https://stackoverflow.com/questions/70052479/firebase-storage-an-unknown-error-occurred-please-c..
-
[Redirect, useHistory] 리액트 v6에서 없어졌다.React 2022. 9. 22. 21:12
[클론코딩 트위터] 104p 코드이다. // import { useState } from "react"; import { HashRouter as Router,Redirect, Route, Routes } from "react-router-dom"; import Auth from "routes/Auth"; import Home from "routes/Home"; import Profile from "routes/Profile" import Navigation from "./Navigation"; const AppRouter = ({isLoggedIn}) => { // const [isLoggedIn, setIsLoggedIn] = useState(true); return ( {isLoggedIn && }..
-
[firebase] 설정 오류 해결하기React 2022. 9. 21. 14:27
import { firebase } from "firebase/app"; // TODO: Add SDKs for Firebase products that you want to use // https://firebase.google.com/docs/web/setup#available-libraries // Your web app's Firebase configuration const firebaseConfig = { apiKey: "AIzaSyD_aU7oUOMoiFJpD3DdvDs3YPjQKe4-Yp0", authDomain: "twitter-3141f.firebaseapp.com", projectId: "twitter-3141f", storageBucket: "twitter-3141f.appspot.co..
-
[TypeScript 기초] 실행 방법, 주요 타입, 열거타입(enum), 제네릭(Generic)웹/TypeScript 2022. 9. 18. 11:02
1. ts파일을 js파일로 변환 방법 터미널에 tsc main(파일명)을 입력합니다. 2. 주요 타입 string - 문자열 boolean - T/F number - 숫자 symbol - symbol 생성자를 호출해 생성된 고윳값 any - 모든 타입을 허용하는 타입. 코드를 쓰는 동안 정해지지 않은 변수를 지정할 수 있음 unknown - any와 비슷하나 먼저 타입을 지정하거나 좁히지 않으면 조작이 허용되지 않음 never - 도달할 수 없는 코드 boid - 값이 없음 3. 열거타입(enum) 일정 수의 상수로 구성된 집합을 만든다. 월요일을 1로 초기화했고, 나머지 값은 자동으로 1씩 증가된 값이 할당된다. 기본적으로 열거 타입은 0부터 시작한다. 예시는 아래와 같다. enum Weekdays {..
-
[Git배포] 문제해결React 2022. 9. 16. 09:51
배포를 했는데 제대로 작동이 되고 있지 않다. 문제를 해결해야 한다 해결방법 : package.json 페이지 "homepage"의 링크를 확인해준다. 꼭 https://judithhopps.github.io/movie_correct/ 이런 형식이여야 한다. npm run build 후에 npm run deploy를 해준다. 그 결과 아래와 같이 화면을 볼 수 있다. https://judithhopps.github.io/movie_correct/ Youflex judithhopps.github.io
-
[영화 소개 사이트] Git에 올리고 배포하기React 2022. 9. 15. 22:14
2022년 9월 13일 부터 16일 4일동안 매달린 결과물이다. navigation은 책에 있는 코드를 수정해서 img(로고와 배경)을 삽입했다. Link 안에 div를 넣어 이미지를 클릭하면 홈화면이 뜬다. 영화를 클릭하면 아래 화면이 넘어온다. 영화 포스터와 제목, 연도, 장르 소개글이 뜬다. 링크는 아래와 같다. https://judithhopps.github.io/movie_correct/ Youflex judithhopps.github.io 코드는 여기서 https://github.com/JudithHopps/movie_correct 참고 바란다.
-
[에러] props의 값이 들어오지 않는다.React 2022. 9. 15. 11:46
http://www.yes24.com/Product/Goods/90344496 Do it! 클론 코딩 영화 평점 웹서비스 - YES24 ‘클론 코딩’만큼 빠르고 효과적인 학습법은 없다! 9살부터 코딩을 시작한 전형적인 ‘천재 코더’ 니꼴라스! 니꼴라스는 세상에서 가장 빠르게 프로그래밍을 배울 수 있는 방법은 클론 코딩 www.yes24.com 내용 소개 p228부터는 route props의 값을 이용해 영화 데이터를 상세 정보 컴포넌트에 전달하는 기능을 사용하기 있다. ※ route props란 라우팅 대상이 되는 컴포넌트에 넘겨주는 기본 props이다. 문제점 About.js, Navigaion.js, Detail.js에 props값이 오지 않고 있다. 해결방법 위 문제점은 react가 v6로 업그레이..