반응형

react 7

[React TS][ERROR] is not assignable to type 'IntrinsicAttributes 해결

typescript로 리액트 코드를 작성하여 props를 넘겨주는 과정에서 아래 에러가 발생했다. js에선 타입을 지정해주지 않아 간단히 해결되지만, ts는 타입을 명시해주어야 했기 때문에 이러한 에러가 발생하는 것이다. 넘겨주려는 dummyList는 아래와 같다. const dummyList = [ { id: 1, author: 'author1', content: 'content1', emotion: '5', created_date: new Date().getTime(), }, { id: 2, author: 'author2', content: 'content2', emotion: '4', created_date: new Date().getTime(), }, { id: 3, author: 'author3..

[React] typescript에서의 useRef와 옵셔널 체이닝(optional chaining)

js로 작성한 코드들을 ts로 변화시키는 작업을 하고 있다. useRef는 js나 ts나 큰 변화는 없다. 우리는 이번 포스팅을 통해 보다 똑똑하게 useRef를 사용해보도록 하자. useRef란? 간단하게 useRef가 무엇인지부터 짚고 넘어가보자. useRef는 꽤 많은 상황에서 쓰인다. 컴포넌트에서의 어떠한 DOM을 선택해야 할 때 쓰이기도 하고, 컴포넌트 내부에서 다룰 수 있는 변수를 만들어야 할 때에도 쓰인다. 전자의 경우는 예를 들어 특정 input, textarea 등의 태그에 focus를 줘야하는 경우에 쓰이고, 후자의 경우는 setState로 다루지 않는 변수들 (예를 들면 비동기 처리를 할 때 쓰이는 setTimeOut, setInterval에서 id를 담아 중복클릭을 방지할 때 쓰이는..

JS/React 2022.01.28

[211105] 리액트 ERROR 해결_Uncaught TypeError: Cannot read properties of undefined (reading 'length')

+) 22.01.31. 추가 1. Object여서 length를 사용하지 못해 undefined로 뜨는 경우는 아래 포스팅 참고! 2. 배열을 넘겨줬는데 왜 length를 쓰면 undefined로 뜨는지 의문사하는 경우도 아래 포스팅 참고! https://kth990303.tistory.com/254 [typescript] JS에서 length가 undefined로 뜨는 현상 고치기 객체의 개수를 파악하기 위해 diaryList.length를 console.log하면 아래와 같이 나타나는 현상을 수정해보자. 문제점 일단 diaryList가 제대로 넘어온건 맞는지 확인하기 위해 console.log로 diaryList도 쳐보도. kth990303.tistory.com 이 포스팅은 리액트 훅(useState..

JS/React 2021.11.05

[211007] 템플릿엔진(thymeleaf)으로 비동기 처리 방식에 대해 고민중이다.

그동안 나는 '소박하지만 그룹입니다' 백준 그룹 멤버들의 공간을 만들기 위한 작인 개인프로젝트를 진행중이었다. 회원, 로그인, 게시글 기능까지 구현을 완료하고 이제 댓글 기능을 구현하려던 중, 문제점이 하나 발생했다. 바로 댓글 기능이다. https://github.com/kth990303/BOJStudyList/issues/18 댓글 기능을 만들어주세요. · Issue #18 · kth990303/BOJStudyList 드디어 댓글 기능을 추가할 차례입니다. Post : Comments 1:N 연관관계로 진행하면 될 것 같습니다. 기한은 11월 초까지이며, 요구사항은 아래와 같습니다. 게시글에 댓글을 작성할 경우, 댓글내용이 github.com 비동기가 필요하다고 느낀 이유? 우리가 흔히 생각하고 있는..

[210923] 디렉토리 구조 세팅, README 추가

이번 운동일지 다이어리 협업프로젝트는 과정을 블로그에 사소한 것까지 포스팅할 예정이다. 친구와 함께 하는 프로젝트인데, 친구는 재학생(개강), 나는 군복무와 병행하는 프로젝트여서 조금씩 진도를 나갈 듯하다. github 주소: https://github.com/kth990303/WorkOutDiary GitHub - kth990303/WorkOutDiary: 민서와 함께 만드는 운동일지 다이어리 민서와 함께 만드는 운동일지 다이어리. Contribute to kth990303/WorkOutDiary development by creating an account on GitHub. github.com 현재 README.md는 아래와 같다. 점진적 과부하를 통한 득근을 위하여 이전 운동횟수와 비교하는 기능과..

[210919] React와 Firebase를 연동해보자

firebase가 무엇인지 모른다면 지난 포스팅에 firebase에 대해 간단하게 설명한 포스팅을 참고하자. https://kth990303.tistory.com/142 [React] Backend 역할을 해주는 Firebase에 대해 알아보자 요즘 나는 집에서 덤벨과 맨몸운동, 그리고 유산소 운동을 자주 하는 중이다. 그러던 어느날, 점진적 과부하를 위해 운동일지를 틈날 때마다 기록하는 것이 좋겠다고 생각했고, 마침 친구와 함 kth990303.tistory.com 이번 시간엔 react의 create-react-app을 이용하여 firebase와 연동해보는 포스팅을 작성해보겠다. 개인적으로 환경세팅으로 고통받는 것을 매우매우 극혐하기 때문에, 다음에 따로 고통받지 않기 위해, 그리고 다른 사람들이 연..

[210827] Uncaught (in promise) Error: Request failed with status code 404 at createdError 에러 해결

로그인, 로그아웃 화면을 만드는 작업을 하던 중 위 에러가 콘솔창에 뜨기 시작했다. 정말 이상하게도, 로그인과 로그아웃 자체는 잘 되는데 뭔가 조금씩 버그가 있는 듯한 느낌? 아래 링크에서 내 질문을 확인할 수 있다. (자문자답 질문) https://www.inflearn.com/questions/293267 [34강] 로그인, 로그아웃 자체는 잘 되는데 콘솔에서 에러가 뜹니다. - 인프런 | 질문 & 답변 안녕하세요 :) 좋은 강의 잘 듣고 있습니다. 로그인, 로그아웃 자체는 잘 되는 것 같은데 콘솔창에서 /api/users/auth가 존재하지 않는다는 에러가 떠서 질문드립니다. 동일한 현상의 다른 질문들을 www.inflearn.com 해결방안 API 주소 자체는 오타 없이 /api/users/aut..

1
반응형