전체 글

IT / 테크 전문 크리에이터 데인 입니다.
개발관련/자바스크립트 팁

MUI 에서 차일드 선택하는 방법 mui styled child selector hover에서 선택하는 방법

const child = styled(div)` opacity: 0; right: 30px; `; const Parent = styled("div")` &:hover { ${CloseBtn} { opacity: 1; } } ${CloseBtn} { width:10px; height:10px; } `;

카테고리 없음

CRA (create react app) eject 하지 않고 babel custom 하는 방법 ( babel plugin 사용하기)

CRA로 작업을 하다 보면 사용하는 모듈 때문에 추가로 babel plugin를 사용해야 되는 경우가 있다. 간단한 프로젝트여서 CRA를 사용했는데 eject하게 되면 귀찮아 진다. 최대한 간단하게 eject하지 않고 babel config를 override해서 babel custom하는 방법이다. npm install react-app-rewired customize-cra --save-dev # or yarn add react-app-rewired customize-cra --dev Install react-app-rewired and customize-cra: 필요한 모듈을 설치해준다. npm install babel-plugin-myPlugin --save-dev # or yarn add babe..

개발관련/자바스크립트 팁

MUI component에서 styled 사용하기

'@mui/styles'는 deprecate '@mui/styles'는 deprecate 됐기 떄문에 더이상 사용하지 않는 것을 권한다. import { styled } from '@mui/styles'; '@mui/system' 대신에 '@mui/system'를 사용하는 것을 권장한다. styled component child selector 옵션을 사용하기 위해서 필요하다. import { styled } from '@mui/system'; babel config 필수 변경된 메소드를 사용하기 위해서 바벨 플러그인 설치가 필수 @emotion/babel-plugin를 설치해준다. npm install @emotion/babel-plugin babel.config.js module.exports = {..

개발관련/자바스크립트 팁

nvm 사용시 node 버전 기본값 변경 하기

node 버전 에러 npm을 통해서 모듈을 설치하다보면 위와 같은 에러 메세지를 보는 경우가 있다. the engine "node" is imcompatible with module. Expected version ">=14.0.0" Got "12.19.0" 내가 설치하고자 하는 모듈의 node 버전과 로컬의 node 버전이 맞지 않아서 생기는 문제이다. ( module의 14버전 이상을 요구하지만 12버전 설치 되어 있는 상태. ) 요즘 라이브러리들이 요구하는 node의 기본 버젼이 대게 14버젼 이상이 많아졌다.( ex. react-dnd) nvm를 사용해서 node 버전을 변경할수 있지만 매번 nvm use 14 를 하는 것이 귀찮아져서 아예 기본 버전으로 14로 변경하는 방법을 공유한다 $ nvm..

카테고리 없음

about Porsche

People usually say that men like cars. but i have no interesting about car literally. except the Porsche. I don't know about the engine or anything like that. One of the reasons I love Porsche. Because of it's classic and elegant design. Another reson is because of the character Ben in the movie Burning. In the movie Burning, Jong-su must finds meaning of life in order to live. For Ben, life is ..

카테고리 없음

You cannot run CocoaPods as root 에러

pod install 할때 You cannot run CocoaPods as root 에러가 발생하면 --allow-root 를 추가하면 된다. pod install --allow-root

카테고리 없음

mono repo (node:3544) UnhandledPromiseRejectionWarning: Error: Cannot find module './node_modules/react/jsx-runtime.js' 에러

(node:3544) UnhandledPromiseRejectionWarning: Error: Cannot find module '/Users/hanseunghun/dev/zigbang/single-page/packages/offer/node_modules/react/jsx-runtime.js' at createEsmNotFoundErr (internal/modules/cjs/loader.js:929:15) at finalizeEsmResolution (internal/modules/cjs/loader.js:922:15) at resolveExports (internal/modules/cjs/loader.js:450:14) at Function.Module._findPath (internal/module..

카테고리 없음

next.js redirects, rewrites 설정 path 확인 하는 방법

http://forbeslindesay.github.io/express-route-tester/ Express Route Tester forbeslindesay.github.io next.js에서 redirects, rewrites 할때 path source 설정 테스트 할수 있는 사이트

개발자 Dane
개발자 Dane의 IT 전문 블로그