본문 바로가기

javascript_css

(3)
n 활용한 Node.js 버전 관리 (mac) n 을 사용 하는 방법 node js 버전 확인 node -v n 설치 sudo npm install -g n n 활용해서 node js 버전 설치 n latest : 최신 버전 설치 n stable : 안정화 버전 설치 n lts : LTS 버전 설치 n 10.16.0 다 하고 나서 n 하고 node 버전 선택하면 됨 혹시 맥북에서 해당 버전을 못찾으면 symbolic link 참고 https://aiday.tistory.com/105 [Node.js] 노드 버전 변경 안되는 문제 해결법(feat.n module) Node.js Version Upgrade Node.js 개발자라면 프로젝트에 따라 특정 버전으로 변경해주어야 할 경우가 생기기 마련입니다. 이전에 Node.js와 NPM를 최신 버전, 특..
CSS Flex 제대로 한번 더 공부하자~! 보통은 수직으로 쌓임 가로세로값을 가질 수 있고 수평으로 쌓이게 display: inline-block; float, clearfix 등 배워야 함 display: flex; 쉽게 수평, 수직제어! flex는 container와 item으로 구성되어 있음 item 양쪽 끝에 붙이기 space-between https://heropy.blog/2018/11/24/css-flexible-box/ CSS Flex(Flexible Box) 완벽 가이드 많은 경우 float, inline-block, table 등의 도움을 받아서 수평 레이아웃을 구성하지만 이는 차선책이며, 우리는 Flex(Flexible Box)라는 명확한 개념(속성들)으로 레이아웃을 쉽게 구성할 수 있습니다. CSS F herop..
CSS - flex 정리 flex-grow: 1; 할당 가능한 공간의 정도 형제 아이템들이 모두 동일한 공간 flex-item:nth-child(1) { flex-grow: 2; } 이 경우에 형제 중 첫번째는 두배 공간 flex-shrink 는 줄어드는 성격 flex-container에 맞춰서 알아서 줄어든다. flex-shrink: 0 은 flex-container에 맞춰서 줄어들지 않겠다. flex-basis 는 초기 크기 설정 auto가 아닌 flex-basis 와 width (direction: column이면 height가 됨) 중에 flex-basis가 우선임 이것들을 축약해서 쓸때는 flex-grow flex-shrink flex-basis 순서임 flex: 0 1 150px; 라고 쓸 수 있음 flex-direc..