더 알아보기166 [Error] the slice reducer for key "feed" returned undefined. 에러 서버에 axios로 요청 후 redux에 dispatch 할 때 아래와 같은 오류 발생 (payload에 falsy한 값 없고, reducer에서 payload 값 잘 넘어와서 draft에 들어가는 것까지 확인 했는 데 저런 오류가 계속 발생 중이다.) 더보기 Error: When called with an action of type "GET_FEED", the slice reducer for key "feed" returned undefined. To ignore an action, you must explicitly return the previous state. If you want this reducer to hold no value, you can return null instead of und.. 2021. 12. 9. axios 개념, Fetch API와의 차이점 (+axios 사용하기) 리액트는 효율적인 UI 구현을 위한 라이브러리 입니다. HTTP Client(HTTP 상에서 커뮤니케이션을 하는 자바 기반 컴포넌트)를 내장하고 있는 Angular와는 다르게, 리액트는 따로 내장 클래스가 존재하지는 않습니다. 따라서 리액트에서 Ajax를 구현하려면 JavaScript 내장 객체인 XMLRequest를 사용하거나, 다른 HTTP Client를 사용해야 합니다. # 짚고 넘어가기 더보기 더보기 Ajax (Asynchronous JavaScript And XML) : Ajax란, JavaScript의 라이브러리 중 하나이며, Asynchronous Javascript And Xml(비동기식 자바스크립트와 xml)의 약자입니다. 브라우저가 갖고 있는 XMLHttpRequest 객체를 이용해서 .. 2021. 12. 7. [Error] doc 사용 시 n.indexOf is not a function 에러 키워드 : doc -> 참조 데이터 / n.indexOf is not a function 오류 1) doc으로 받아온 반환값은 타입이 document(문서)이기 때문에 참조 데이터이다. const docRef = doc(db, 'dictionary', dictionary_id) 참조값은 데이터를 받아와서 사용 할 수 없기 때문에 (await getDoc(docRef)) 를 사용해서 docRef에 해당하는 데이터를 불러오면 promise 형태로 넘어온다. (await getDoc(docRef)).data() 거기서 내가 원하는 값은 딕셔너리의 형태의 데이터이기 때문에 .data()를 사용한다. 2) 글 작성 후 새로고침 없이 수정이나 삭제를 할 경우 에러 발생 (새로고침을 하면 수정과 삭제가 에러 없이 잘.. 2021. 12. 1. [Error] firebase.js import 에러 발생 firebase가 버전 9로 업그레이드 되면서 임포트하는 방법이 달라졌다. v9에서는 firebase와 app 또는 auth 폴더 경로 사이에 compat 폴더를 추가 해주면 되고, 또는 v8로 다운그레이드 하는 방법이 있다고 한다. https://stackoverflow.com/questions/68946446/how-do-i-fix-a-firebase-9-0-import-error-attempted-import-error-firebase-app How do I fix a Firebase 9.0 import error? "Attempted import error: 'firebase/app' does not contain a default export (imported as I am trying to i.. 2021. 12. 1. [Error] react-script 에러 과제 진행 하다가 갑자기 'react-scripts'은(는) 내부 또는 외부 명령 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다.라는 에러가 발생했다. 아래 블로그를 참고한 결과 'yarn add global react-script'를 했더니 package.json이 업데이트 되면서 해결 됐다. yarn add global react-scripts https://reitsplusrich.tistory.com/28 [리액트 에러 해결] 'react-scripts'은(는) 내부 또는 외부 명령 실행할 수 있는 프로그램, 또는 배치 'react-scripts'은(는) 내부 또는 외부 명령 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다. 갑자기 react가 실행되지 않는다. yarn start, .. 2021. 11. 25. 웹개발 툴 (숨겨진 유용한 기능들🍯🐝) 강력한 CSS 총정리, 쉐도우 간편하게 만들기, 폰트 쉽게 변경하기, 플렉스/그리드 쉽게 하는 방법들이 설명 되어 있다! https://www.youtube.com/watch?v=q_rBbcTiSC4&t=61s 2021. 11. 23. styled-components 자동 완성 플러그인 자동완성 플러그인을 안깔면 코드가 주황색으로 떠서 일일이 써야 했는 데 아래 사이트 참고해서 styled-component 자동완성 플러그인을 깔았더니 https://velog.io/@sdc337dc/TIP-Styled-Component-%EC%9E%90%EB%8F%99%EC%99%84%EC%84%B1-%ED%94%8C%EB%9F%AC%EA%B7%B8%EC%9D%B8 TIP) Styled-Component 자동완성 플러그인 styled Component를 사용하면 동적으로 요소(element) 스타일을 꾸밀 수 있다.그런데 styled Component에서 css 코드를 작성 시, 자동완성이 안되어 일일이 코드를 입력해야한다.그러면 실수를 할 경우 에러 velog.io 이렇게 자동완성 할 수 있게 코드 .. 2021. 11. 17. 알고리즘 문제에 쉽게 접근하는 방법 항해99 4기 동기분(이름은 개인정보라서 밝히지 않겠음)이 알고리즘 문제를 쉽게 접근하는 방법에 대해 강의를 진행 해주셨다. 블로그 기재에 대해서 허가를 받았고 강의 내용에 나왔던 의사코드를 더 알고 싶어서 추가로 찾아보고 정리했다. 난이도가 낮은 문제들은 문제를 읽어서 진행 하면 시행착오를 겪더라도 풀 수 있었는 데 난이도가 올라 갈 수록 문제에 직관력이 낮아져서 문제를 이해하기 어려 웠는 데 좋은 강의 덕분에 알고리즘 문제를 풀 때 어떻게 접근해서 문제를 쪼개면 좋은 지 많이 배울 수 있었다! 1. 지문 읽기 - 키워드를 캐치한다. (목적, 규칙, 로직으로 정리하기) 2. 주석 쓰기 - 코드 작성 전에 무작정 써본다. (손으로 써보면서 흐름을 잡아본다.) 3. 변수 정의하기 - 어떤 기능을 쓸 지, .. 2021. 11. 12. HTTP, Cookie, Session, Cache 쿠키와 세션을 사용하는 이유 : HTTP 프로토콜의 특징이자 약점을 보안하기 위해서 사용한다. + HTML랑 CSS는 언어가 아니라 MarkUp Language이다. (깨알 상식) 1. HTTP(Hyper Text Transfer Protocol) 프로토콜의 특징 HTTP의 연결이 끊기면 줬다 뺐는듯한 형태이기 때문에 새로고침을 하지 않는 이상 정보가 바뀌지는 않는다. 1) 비연결성 : HTTP는 클라이언트가 요청(request)을 서버에 보내고, 서버는 클라이언트에게 적절한 응답(response) 주고 연결을 끊는 특성이 있다. 2) 무상태성(상태없음) : 커넥션을 끊는 순간 클라이언트와 서버의 통신이 끝나면 상태 정보는 유지하지 않는 특성이다. HTTP는 이런 두가지 특징을 보안하기 위해서 쿠키와 세.. 2021. 11. 11. 이전 1 ··· 13 14 15 16 17 18 19 다음 728x90