본문 바로가기

전체 글

 (120)
[Error, React-Hook] props.history가 없어요! (useHistory) 리액트 개발을 하던 중, props.history가 자식 컴포넌트에서 동작하지 않는 상황에 마주했습니다. App.js에서 { withRouter } from "react-router"로 묶어주고, App을 withRouter로 감싸줍니다. 그리고, index.js에서 { BrowserRouter } from "react-router-dom"으로 묶어주면, props에 history 객체가 생성되는데요. 이를 이용해서, 뒤로가기, Link걸기 등의 작업을 할 수 있습니다. 그런데, App.js -> Home -> Header -> Menu 이런식으로 자식의 자식의 자식 컴포넌트로 이어지면, props.hisotry객체가 전달되지 않았습니다. 이런 경우 해결할 수 있는 방법으로 useHistory를 이용하면..
Reset CSS File /* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption..
2. CSS 안녕하세요, 깨비도입니다. 저번 HTML에 이어 이번에는 CSS를 설명해보겠습니다. 1. CSS란? CSS는 HTML을 꾸며주는 요소들을 말합니다. 아무변화 없는 화면구성은 보는 이에게도, 만드는 이에게도 지루하기만 하죠. 글씨색부터, 글씨체와 크기, 백그라운드 색상과 이미지 크기를 조절하는 등의 모든 디자인적인 요소는 CSS에서 관할합니다. 2. CSS 태그 분석 css는 html을 통해 관리하는데요. html의 클래스이름은 image이구요. 임의로 가로는 300px, 세로는 500px로 주어봤습니다. 이미지가 비율이 맞지 않고 제가 조절한 값 그대로 줄어들어 심하게 일그러진 것을 볼 수 있습니다. 하지만 이미지 크기를 조절할 때마다 매번 이렇게 하나하나 맞춰가면 힘들겠죠. 이럴 때는 가로 또는 세로 ..
Node 프로젝트에서 .gitignore 기본값 Nodejs 프로젝트에서, .gitignore로 깃에 올라가는 파일을 제외시킬 수 있다. 기본적으로 node_modules 폴더를 제외시킨다. 왜냐하면, 'npm install' 명령어를 통해, 의존하는 패키지를 한번에 설치할 수 있기에 따로 포함시켜 용량을 높일 필요가 없기 때문이다. node_module외에, 추가적으로 기본적으로 제외시켜야 할 파일들이 있는데 잘 정리된 것이 있어, 기록한다. node_modules package-lock.json # Logs logs *.log npm-debug.log* yarn-debug.log* yarn-error.log* lerna-debug.log* # Diagnostic reports (https://nodejs.org/api/report.html) rep..

티스토리툴바