목록전체 글 (186)
hmk run dev
SCSS란 그냥 CSS를 편하게 쓰도록 도와주는 친구라고 보면 된다 뒤에 .scss 라고 붙인 파일을 붙여저 style.css에 있는 내용을 모두 복사 붙이기 그리고 터미널에서 scss 확장 파일을 인스톨 해줘야한다 # 오류 메시지를 보면서 하나씩 설치하면 너무 느리니, 이번엔 제가 필요 패키지를 싹 가져왔어요! # 그대로 복사해주세요! 아래 코드로 scss 확장 설치 yarn add node-sass open-color sass-loader classnames 기본문법은 css와 유사하다 그러나 nesting이 가능하다 아래처럼 묶어서 ```scss //scss 네스팅 (묶어주기) div { p { color: #888888; font: { // 폰트 속성도 묶어주기 family:sans-serif; ..
리액트는 기본적으로 단방향으로만 데이터 전송?이 가능하다 부모컴포넌트는 자식에게 데이터를 넘겨줄 수 있지만 자식컴포넌트는 부모에게 데이터를 줄 수 없다! 함수형 컴포넌트의 장점 클래스형 컴포넌트보다 선언이 간편하다. function App() ... 클래스형 컴포넌트보다 메모리 자원을 덜 사용한다. 프로젝트 빌드 후 배포할 때 결과물의 파일 크기가 더 작다. (클래스형 컴포넌트와의 성능과 파일 크기 면에선 크게 차이가 없지만 함수형 컴포넌트가 좀 더 작음) 하지만 큰 단점이 하나 있다. 함수형 컴포넌트의 단점 state 와 라이프사이클 API 사용이 불가능하다. 그렇지만 이 단점은 리액트 v16.8 버전 이후 Hooks 라는 기능이 도입 되면서 해결 되었다. 클래스형 컴포넌트와 똑같이 사용할 수 있는 것..
리액트는 레고 컴포넌트는 레고블록 컴포넌트에는 '클래스형'과 '함수형'이 있습니다 웹 사이트는, 크게 , , 세 개의 컴포넌트가 있고, 컴포넌트는, , 컴포넌트로 이루어져 있다 리액트 코딩룰 폴더는 소문자로 시작하는 카멜케이스를 사용 JS파일, 컴포넌트 이름은 대문자로 시작하는 카멜케이스를 사용 폴더나 파일 앞 글자는 대문자로 시작해야한다 버킷리스트 컴포넌트 // 리액트 패키지를 불러옵니다. import React from 'react'; // 함수형 컴포넌트는 이렇게 쓸 수도 있고 // function Bucketlist(props){ // return ( // 버킷 리스트 // ); // } // 이렇게 쓸 수도 있어요. =>가 들어간 함수를 화살표 함수라고 불러요. // 저희는 앞으로 화살표 함수를..