차근차근 배움터

Udemy 강의가 업데이트 되지 않는 바람에 시간을 꽤 쏟았다 @import 구문 대신에 변수를 담고 있는 scss 파일의 경우는 @use 를 사용하여 불러온다. @use "abstracts/_variables" as variables; Compilation Error Error: Invalid UTF-8. 이게 뭐지........... 한참을 봤다 @use "abstracts/_variables" as variables; @import "abstracts/_functions"; @import "abstracts/_mixins"; 이렇게 세 구문을 썼는데 두 번째 문장은 문제 없고, 세 번째 문장에서만 계속 FAIL 떠서 한창을 찾다가 발견한 아주 간단한 방법... 그 해당 파일의 인코딩 문제였다. VS..

a 태그 사용시 새탭에서 열리게 하려고 했는데 주저리주저리 이렇게 안된다고 한다! 왜 보안에 취약한가 했더니 이미지로도 간단하게 이해가 가능한 이유 때문이었다 https://stackoverflow.com/questions/50709625/link-with-target-blank-and-rel-noopener-noreferrer-still-vulnerable Link with target="_blank" and rel="noopener noreferrer" still vulnerable? I see people recommending that whenever one uses target="_blank" in a link to open it in a different window, they should p..

useRoutes() may be used only in the context of a component. 이런 에러가 떴는데 index.js에 BrowserList.js 를 넣어줬다 import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; import { BrowserRouter } from 'react-router-dom'; const root = ReactDOM.createRoot(document.getElementById('root')); root.render( )..

React Hook "useState" cannot be called at the top level. React Hooks must be called in a React function component or a custom React Hook function useState를 쓰면서 에러가 생겼는데 일단 임시 방편으로 코드 아래 쪽에 useEffect 코드 아래 부분에 이렇게 주석 처리된 코드를 삽입하면 (주석처리 그대로) eslint 경고를 무시하게 된다 useEffect(() => { fetch(url, options) .then(res => res.json()) .then((json) => { setMovies(json); setLoading(false); }) .catch(err => conso..

실제 map()을 사용하는 곳에서는 에러가 없는데 메인 페이지에서 클릭하기도 전에 에러가 났다 영화 목록이 나열되어 있는 메인 페이지에서는 개별 movie의 데이터가 없기 때문에 불러 올 수 없다는 것 같아서 아래와 같이 존재하면 출력하게 변경했다. {/* 에러부분 왜 나는 지 모르겠음 */} {movie.genres ? genre: {movie.genres.map((genre) => {genre})} : null}

해당 에러가 발생하는 이유는 버전 때문이다 나의 경우에는 react-router-dom version 5를 사용하고 있었는데 Routes 즉 5 버전에서 Switch였던 이 기능을 사용하려면 버전 업데이트가 필요했다. 버전을 확인하려면 react 프로젝트 안에서 package.json 를 통해서 확인할 수 있다. 기존에는 ^5.3.4 버전이었는데 새로 설치하기 위해서 먼저 1. 기존의 react-router-dom을 삭제 했다 $ npm uninstall react-router-dom 그리고 그냥 설치하면 자꾸 5버전이 설치 되길래 제일 최신 버전으로 설치했다. 2. 최신 버전 react-router-dom 설치 npm i react-router-dom@latest 그럼 해당 에러는 사라질 것이다!

mount Consider using the "jsdom" test environment. 위와 같이 jest.config.js 파일에서 testEnvironment를 보니 node 밖에 없어서, 둘 다 넣어주니 해결 testEnvironment: [ 'node', 'jsdom' ], 출처 Consider using the "jsdom" test environment I have this simple test: import React from 'react' import { render } from '@testing-library/react' import Button from '.' describe('Button', () => { it('renders button without crashing', () ...

강의를 듣다가 해당 에러와 마주쳤는데 npm run dev 위와 같은 npm 명령어를 입력함으로써 그 서버를 실행시키니 해결이 되었다 일반 로컬 환경에서는 어려운 부분인가 싶다

STS 잘 작동 중이었는데 갑자기 여기저기 다 빨간 줄 뜨고 사라지지도 않는다 한군데가 아니라 프로젝트 전체에 그냥 빨간 줄 도배.... 무언가가 잘못되었기 때문에 열심히 검색해보니 여러가지 방법이 있었고 (원인은 각각 다를 테니) .m2 repository 하위 폴더 삭제 Project clean server clean 4. update project 5. properties - Java Build Path 나는 이게 문제였다 JRE System Library (unbound) 라이브러리가 적용이 안돼서, 1.8 jdk 다시 적용시켜주니 빨간 줄이 사라졌다 ( Under Eclipse IDE: open menu Project --> Properties, or right-click on your proj..

인텔리제이 프로젝트를 만들었더니, 만들자 마자 아래와 같은 에러 메세지가 떴다 "요청한 작업을 수행하려면 권한 상승이 필요합니다" 나의 경우에는 maven-archetype-app 라이브러리 추가와 관련이 있는 것 같다 프로젝트를 만들 때 해당 부분을 체크하지 않고 만들었더니 에러가 뜨지 않았기 때문.... 나름 열심히 뒤져봤지만.... 해결하지 못하고 인텔리제이를 삭제하고 다시 설치한다