현재 위치가 곧바로 return 되지 않는 문제 ❓상황 navigator.geolocation API 를 react의 hook인 usePosition()으로 만들고 나서, return 값 저장시 undefined로 발생 🔎 원인 파악 API 호출 시 API 호출 값을 받기 전까지, 실행되지 않게 설정하지 않아서 발생한 문제(비동기 설정 X) 또한, gelocation 메소드는 return 반환이 없다는 것. ✨ 해결 방법 1. 함수에 new Promise 를 정의하여, 반환되는 값 나오게 만들기 function get() { return new Promise((resolve, reject) => navigator.geolocation.getCurrentPosition( (position) => resol..

error Command failed with exit code 1. (https://ntl.fyi/exit-code-1) ❓상황 netlify를 이용하여 미세먼지 프로젝트 배포시 발생한 오류 🔎 원인 파악 개발작업시 warning이 발생하는 경우도 있는데, 개발할때는 이걸로 인해 문제가 생기지는 않는다. netlity 에서 배포할때 자체적으로 test를 진행한다. test 진행시, warning을 error로 진단하여 오류가 발생한다. 따라서, netlify에다가 warning은 error가 아니라고 알려줘야한다. ✨ 해결 방법 build command # yarn CI= '' yarn build

Access to fetch at ''url" from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. ❓상황 fetch를 이용하여 한국환경공단_에어코리아_대기오염정보 API 호출시 발생한 오류 🔎 원인 파악 외부 API 접근시, 브라우저가 클라이언트의 Origin값과 외부 API 서버의 Ac..

국민내일배움카드로 국비지원받고 프론트엔드 학습 열공 챌린지 7주차 🎥 목차 더보기 1. 목표 2. 알게된 점 3. 좋았던 점 4. 나의 다짐 🚀 목표 패스트 캠퍼스에서 학습주차별로 구분지어줬기 때문에, 7주차 학습강의 듣기가 학습 목표이다. 💡 알게된 점 Fetch 1~6주차 강사님께서 axios를 알려주셔서, Fetch 대신 axios를 이용하여 api 통신하여 데이터를 호출했다. 밑에 강사님이 임시 데이터를 호출할 수 있는 예시 url를 주셨다. https://raw.githubusercontent.com/techoi/raw-data-api/main/simple-api.json import React, { useEffect, useState } from "react"; import axios from..

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'signin2') ❓상황 구글 로그인 API 기능구현시 구글 플랫폼 라이브러리의 프로퍼티(signin2)를 불러올 수 없다고 발생하는 오류 🔎 원인 파악 구글 플랫폼 라이브러리를 async(DOM 렌더링 전 스크립트 실행) 속성을 부여해서 발생하는 문제 ✨ 해결 방법 async 제거