목록개발일지/TIL (85)
뉴히의 개발 로그
문자열로 형변환을 시킬때 String()을 사용하지만 가끔 toString()을 사용했기때문에 정확히 어떤 차이가 있는지 궁금했다. String() 은 null과 undefined에 대헤서도 잘 동작하는 반면, toString() 사용시 에러가 발생한다. String() : 어떤 형태이든 문자로 형변환하여 반환 .toString() : 메서드는 특정 진수로 객체를 표현한 문자열을 반환 / null, undefined 형 변환 시 오류 확실히 값이 명시된 경우에는 둘 다 상관없지만, null, undefined 와 같이 예외인 경우가 있을 수 있으므로 String()을 사용하는 것이 좋다. https://velog.io/@kimkyeonghye/JS-String-%EA%B3%BC-.toString-%EC%..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cM6WWE/btsohW7jTaf/Fx6qKpf811npyU7RwRaSK1/img.png)
파이어베이스 Authentication 에서 sign-in method 탭으로 들어가서 새 제공업체 추가 ! 제공없체 google 선택! 프로젝트 지원 이메일은 그냥 내걸로 했다 ! 그럼 잘된다 ㅎㅎ import { auth } from '../../firebase'; import { signInWithPopup, GoogleAuthProvider } from 'firebase/auth'; const GoogleLogin = () => { const googleProvider = new GoogleAuthProvider(); const signInWithGoogle = async () => { return await signInWithPopup(auth, googleProvider); }; const g..
심장철렁 ㅎㅎㅎㅎㅎ github에 로그인/회원가입 작업한것을 올리고 코드를 합친후 팀원분들이 회원가입을 하려는데 안된다고 하셨다 ㅠㅠ 오류 내용은 대략 이런것 !! ㅎㅎ Response { type: 'cors', url: 'https://identitytoolkit.googleapis.com/v1/accounts…ignUp?key=AIzaSyDkDPtv28NKNnAxKYN_RFTG36lp3-IraAE', redirected: false, status: 400, ok: false, …} 서칭해보니 첫 번째 이메일이 이미 존재합니다. 두 번째는 TOO_MANY_ATTEMPTS_TRY_LATER입니다. 세 번째는 WEAK_PASSWORD입니다. 비밀번호는 6자 이상이어야 합니다. API에 비밀번호를 보내기 ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bmEK74/btsnZ1ojkCG/9GbxcH1BBOcHPIeauN4Ni1/img.png)
파이어베이스 오류! firebase: Error ( auth/api-key-not-valid. -plase-a-valid-api-key.). 키값이 안맞는다고 자꾸 .....!!! 계속 복붙해서 확인을 해도 정확한데 키값이 안맞는다고 오류가 떳다. 처음에 .env 설정을 할때 변수명 = "키값 " 이렇게 넣고 firebase.js에서 firebaseConfig 에 process.env.변수명 이렇게 넣었을때의 오류였다. 그래서 혹시나 하고 !!!!!!!!!!!!!!!!! env에는 string을 쓰지 말라 했던것같아 변수명 = 키값 넣고 firebaseConfig 에 빽틱으로 감싸서 넣었더니 오류.... 그런데 이게 맞았다! 재시작을 안해서 오류났던것 ㅎㅎㅎㅎ 재시작 하니 잘 연결되었다 .env 파일 변..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/Nvoia/btsn1aLUshV/C6TMsUjypbBPVH1eWGXwM1/img.png)
React Query Lifecycle queury가 stale하면 상한, 유통기한이 만료 되었다는 뜻, 그래서 데이터를 새로 받아오기위해 값을 요청한다. fresh 상태는 새로 요청하지 않음 * default config (기본 설정) 기본설정 의미 staleTime: 0 useQuery 또는 useInfiniteQuery에 등록된 queryFn 을 통해 fetch 받아온 데이터는 항상 stale data 취급 refetchOnMount: true useQuery 또는 useInfiniteQuery 가 있는 컴포넌트가 마운트 시 stale data 를 refetch 자동 실행 refetchOnWindowFocus: true 실행중인 브라우저 화면을 focus 할 때 마다 stale data를 refet..
필수 입력 정규식 let reg_required = /.{1,}/; 이름 관련 정규식 let reg_name1 = /^[가-힣]+$/; // 한글만 let reg_name2 = /^[a-zA-z]+$/; // 영문만 let reg_name3 = /^[a-z]+$/; // 영문 소문자만 let reg_name4 = /^[A-Z]+$/; // 영문 대문자만 let reg_name5 = /^[가-힣a-zA-Z]+$/; // 한글 + 영문만 아이디 관련 정규식 let reg_id1 = /^[a-z0-9_-]{4,20}$/; // 소문자 + 숫자 + 언더바/하이픈 허용 4~20자리 let reg_id2 = /^[A-Za-z]{1}[A-Za-z0-9_-]{3,19}$/ // 반드시 영문으로 시작 숫자+언더바/하이픈..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/Cudim/btsnwoK2jQH/HwJAE5WD1Tnfl0jlWuQpw0/img.png)
React Query patch 인자값을 넘겨줄때, id랑 update할 데이터 이렇게 두개의 인자로 넘겨줬다. 그런데 계속 안됨.... 알고보니 인자값을 두개를 넘겨줄 수 없다! 하나의 객체 형태만 넘겨줄 수 있음 ㅠㅠ ▼ 잘못된 코드 const updateTodo = async ({ id, updateData }) => { console.log('updateData', updateData); await axios.patch(`${process.env.REACT_APP_SERVER_URL}/todos/${id}`, updateData); }; // todo api const updateTodo = async (id, updateData) => { await axios.patch(`${process.en..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/SEIKu/btsm8JbQpcn/AT0TO38jk7Kkeid7aaXyW0/img.png)
errorrrrrrrrrrrrrrrrrrrrr..... 첫 랜딩시 data를 불러오지 못한다. null값, filter코드를 지우면 데이터를 잘 가져옴!! 코드 실행 순서의 문제!!!! 예외처리로 해결할 수있다. const { isLoading, isError, data } = useQuery('todos', getTodos); react query는 usequery를 통해서 데이터를 어디서든 불러와서 쓸수 있다. 다만, useQuery 데이터를 불러오는 순서는 동기함수들이 전부 끝난 뒤에 서버에 'todos'이름 쿼리 있니? 그럼 데이터에 'todos'쿼리 데이터 저장해줘 하고 그 다음 data에 데이터를 할당해서 아래에서 불러와 쓸수 있다. 그렇기 때문에 예외처리를 해줘야한다! 1. 옵셔널 체이닝(?..