일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- 프로그래머스
- BFS
- leetcode
- React
- Medium
- Vite
- 호이스팅
- 컴포넌트 최적화
- medinum
- Weekly Contest
- javascript
- toast-ui-editor
- eslintrc
- 모던 자바스크립티 Deep Dive
- commitlint
- Biweekly Contest 79
- LV. 2
- .env
- React Private Routes
- next-auth
- Sanity.io
- tailwindcss
- 모던 자바스크립트 Deep Dive
- React Public Routes
- engines locking
- react-dom
- sql
- React.memo
- next.js
- React Router dom v6
- Today
- Total
목록React (10)
뚜벅
라이브러리를 정상적으로 설치하고 버전 에러를 해결하니 또 다른 문제점이 발생합니다. 샐 행 하는 데는 문제점이 없지만.. 계속 보이는 게 마음에 안 들어서 수정해 봅니다. 이 같은 문제는 toast ui editor 깃 헙 이슈에도 올라와 있는데요 https://github.com/nhn/tui.editor/issues/2137 Failed to parse source map (@toast-ui/editor/dist/purify.js.map) · Issue #2137 · nhn/tui.editor Describe the bug Cant parse the source map for toast-ui/editor Compiled with warnings. Failed to parse source map fro..
이번에 프로젝트를 진행하면서 글 작성 markdown이 필요했습니다. 그래서 찾아본 결과 toast ui editor이 문서화도 잘되어 있고, 커스텀을 할수 있는 점, 디자인이 예쁜 점을 고려해서 toast ui editor 라이브러리를 사용하게 되었습니다. 하지만 아래와 같이 설치하니깐 버전에러가 발생했습니다. 자세히 살펴보면 toast-ui-editor라이브러리가 리액트 17.0.1까지 지원한다고 되어 있습니다. 그래서 터미널에 다음과 같이 입력 해줍니다. npm install react@^17.0.1 react-dom@17.0.1 하지만 버전을 다운 그레이드 하면 또 다른 에러가 발생합니다. 리액트 버전 18에서는 위와 같이 ReactDOM을 import 하지만 버전 17에서는 client를 제거해..
React Router dom을 이용해서 프로젝트를 진행 중 로그인 여부에 따라 보이는 경로를 다르게 할 방법이 없을까! 고민하다 공부한 내용을 정리 해봅니다. 예를 들어 다음과 같은 경로가 있고, 1. 로그인하지 않은 유저는 "/todo" 경로로 이동할 경우 "/" 경로로 리다이렉트 한다.라는 조건이 있는 경우 아래와 같이 utils 폴더에 PrivateRoutes.jsx 파일을 생성하여 아래와 같이 작성해줍니다. Context API를 사용해서 로그인 여부를 관리해줬는데, 이때 로그인되지 않은 경우, "/" 경로로 리다이렉트 해줍니다. 그리고 로그인된 경우 Outlet를 사용해서 자식 경로 요소를 렌더링 해줍니다. 그리고 App 컴포넌트에서 Private 경로의 라우트에 생성한 PrivateRoute..
1. root 에 .env 파일 생성 2. .gitignore 파일에 .env 추가 .gitignore 파일에 .env파일을 추가해줘야지 깃허브에 올라가지 않는다. 3. 변수 생성 아래 사진과 같이 key=value 값으로 변수 생성 (REACT_APP_ 반드시 key앞에 붙여줘야한다) 추가 주의사항으로 value 끝에 , 또는 ; 를 붙여 주면 안 된다. 4. 변수 사용 사용하려는 key 앞에 process.env.REACT_APP_ 을 붙여주어 사용한다. 이 부분에서 실수하여 계속 undefined 값을 받았는데 꼭!!! process.env 뒤에 REACT_APP_ 을 붙여 줘야 합니다. 참고 자료 https://stackoverflow.com/a/53237511/14071328