리액트 (8) 썸네일형 리스트형 [React/Typescript] TS2307: Cannot find module 'swiper' or its corresponding type declarations. 기존 프로젝트에 슬라이더를 만드려고 시도. swiper 써야되는데 자꾸 에러가 났다 Error : TS2307: Cannot find module 'swiper' or its corresponding type declarations. 해결 방법 1. npm i @types/swiper 설치 2. tsconfig.json 파일에 types를 추가한다. { "compilerOptions": { "types": ["react-transition-group"], // 이거 추가하니 에러가 사라짐 ... } } [React/Typescript] 검색 시 자동 렌더링 안될때/ 자동 새로고침/ 강제 렌더링/ location reload 문제 원래는 Header에 있는 검색창에 검색을 위한 input 데이터(키워드) 입력 후 엔터 or 검색 버튼을 누르면 -> Search Page로 넘어가서 api url의 검색 결과 리스트를 보여줌. 근데 Search Page에서 재검색을 하면 url은 바뀌는데 자동으로 검색 결과가 바뀌진 않음! 내가 직접 새로고침을 해줘야 바뀐 결과가 나왔다. 해결 자동으로 새로고침하는 방법 페이지 이동 이벤트 함수 내에 window.location.reload()를 추가한다! 그럼 검색어를 입력하고 엔터 or 검색버튼을 누르는 행위를 할 때, 바로 새로고침이 되면서 새로운 검색결과가 반영된 페이지가 나오게 된다. 끝 [React] TypeError: Cannot read properties of undefined (reading 'prototype') 리액트 프로젝트 도중 이상한 에러가 떴다. 찾아보니 vs code 자동완성으로 아래 코드가 들어가있었는데, 이 코드가 문제였음 import { response } from "express"; 이 친구를 지워주니 에러가 싹 사라졌다. 편-안 [React] Movie App 만들기 (개인 프로젝트) - 3 John Ahn님의 인프런 강의를 따라가면서 진행중입니다. 개인 공부 용도로 기록합니다. 문제 시 삭제 https://xxilliant.tistory.com/75 [React] Movie App 만들기 (개인 프로젝트) - 2 John Ahn님의 인프런 강의를 따라가면서 진행중입니다. 개인 공부 용도로 기록합니다. 문제 시 삭제 https://xxilliant.tistory.com/73 [React] Movie App 만들기 (개인 프로젝트) - 1 John Ahn님의 인프런 강의를 따 xxilliant.tistory.com 1. 진행 사항 (현 포스팅 기준) Load More (더보기 버튼) 기능 만들기 2. 함수 분리 버튼을 누르면 불러오는 page가 변경되도록 함수를 짤건데, fetch 부분을 재사.. [React] Movie App 만들기 (개인 프로젝트) - 2 John Ahn님의 인프런 강의를 따라가면서 진행중입니다. 개인 공부 용도로 기록합니다. 문제 시 삭제 https://xxilliant.tistory.com/73 [React] Movie App 만들기 (개인 프로젝트) - 1 John Ahn님의 인프런 강의를 따라가면서 진행중입니다. 개인 공부 용도로 기록합니다. 문제 시 삭제 1. Mongodb 몽고디비 가입 후 클러스터 0 디비 생성까지 해놨다. 나중에 로그인 기능을 위해 가입 xxilliant.tistory.com 1. 진행 사항 (현 포스팅 기준) 영화 grid card 컴포넌트 만들기 2. ES7 vs code에서 ES7 다운받고 나서 빈 js 파일에서 rfce 라고 치고 엔터 누르면 아래와 같은 기본 함수 틀이 짜잔-하고 나온다 3. 기억할 .. [React] npm ERR! code ELIFECYCLE errno 1 npm start 두 번 입력해서 나온 에러 ㅠㅠ 세상에는 참 다양한 오류가 있고.. 내 손으로 만들어가는 행복한 에러 세상^^ npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! react-boiler-plate@1.0.0 start: `node server/index.js` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the react-boiler-plate@1.0.0 start script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of .. [React] Movie App 만들기 (개인 프로젝트) - 1 John Ahn님의 인프런 강의를 따라가면서 진행중입니다. 개인 공부 용도로 기록합니다. 문제 시 삭제 1. Mongodb 몽고디비 가입 후 클러스터 0 디비 생성까지 해놨다. 나중에 로그인 기능을 위해 가입해놓는듯. 2. Movie API https://www.themoviedb.org/ The Movie Database (TMDB) Welcome. Millions of movies, TV shows and people to discover. Explore now. www.themoviedb.org 이 사이트에서 영화 api를 제공해준다고 합니다. (일단 순위가 한국 기준은 아닌듯..? 아님말고) 가입 후 api를 받음. 친절하게 API 문서도 다 있네요. 아쉽게도 현재까지는 영어만 지원한다고 합니다 .. [React] Attempted import error: does not contain a default export Attempted import error: does not contain a default export 리액트 프로젝트 강의를 따라가던 중 마주친 에러이다. 뭐가 문제인가 싶어서 번역기 돌려봄 가져오기 시도 오류 : './Sections/MainImage.js'에 기본 내보내기('MainImage'로 가져오기)가 없습니다. 이런 내용이었다. 즉, import 해놓은 MainImage 파일에 내보내기 코드가 없다는 말임. export default 코드를 깜빡했음ㅋㅋ export default MainImage; MainImage 파일에 위 코드를 추가해주니 정상적으로 작동되었다. 아직 리액트가 익숙하지 않아서 자꾸 이런거 빼먹는 실수를 한다. 정신차려.. 이전 1 다음
