코비누나의 개발일지💻🐶

1) SASS, SCSS - CSS pre-processor 라고도 부른다. - 복잡한 작업을 쉽게 할 수 있게 해주고, 코드의 재활용성을 높여줄 뿐만 아니라, 코드의 가독성을 높여주고 유지보수를 쉽게 할 수 있다. - 파일 확장자 2가지를 사용한다. ( .sass / .scss ) - 참고하면 좋은 사이트 https://sass-lang.com/guide Sass: Sass Basics Before you can use Sass, you need to set it up on your project. If you want to just browse here, go ahead, but we recommend you go install Sass first. Go here if you want to learn..

1) useState 함수 - 컴퍼넌트에서 동적인 값의 상태(state)를 다루는 hook 함수를 뜻한다. const [현재상태변수, 설정함수] = useState(초기값); ▼ const [number, setNumber] = useState(0); ✔ hook 함수 - 상태 관리를 다루던 클래스를 좀 더 쉽게 다룰 수 있도록 만들어진 함수들을 말한다. 2) spread 란? - 객체 또는 배열을 펼처 저장하는 방법을 뜻한다. const dog = { name: '코비' }; ▼ 하단의 ...이 spread 방법이며, 위의 값을 밑의 ...방법을 이용하여 복사 붙여넣기 한다는 뜻 const cuteDog = { ...dog, age: 10 } ▼ spread 방법을 또 써보았다. const blackC..

angular.js(프레임워크) vue.js(프레임워크 또는 라이브러리) ✔ 프레임워크와 라이브러리의 차이점 프레임워크 라이브러리 집(건축물) 도구, 인테리어 제품 ✔ 컴퍼넌트(Component) - 리액트에서 레고 조각처럼 조합하여 프로그래밍 할 수 있도록 만든 모듈 단위이다. - 함수형(버전 16.8), 클래스형이 있다. ✔ props (properties) - 컴퍼넌트에 매개변수를 전달해준다. function 컴퍼넌트명(props){ return {props.속성} } ✔ defaultProps - 컴퍼넌트에 props를 지정하지 않았을 때 기본값을 설정해준다. 컴퍼넌트명.defaultProps = { 설정할 프로퍼티 ... } ✔ 삼항연산자를 사용하여 조건부 렌더링 1. 조건식이 true인 경우와..

1) 리액트의 시작 1. cdn을 이용하는 방법 - https://ko.reactjs.org/docs/cdn-links.html CDN 링크 – React A JavaScript library for building user interfaces ko.reactjs.org - babel : 과거 브라우저에 맞도록 스크립트를 자동으로 변환해준다. (트랜스 컴파일러) https://babeljs.io/docs/en/babel-standalone Babel · The compiler for next generation JavaScript The compiler for next generation JavaScript babeljs.io ✔ JSX 태그란? - 페이스북에서 만든 마크업 태그이다. - JSX -> J..

1) React(리액트)란? - 페이스북사에서 만든 자바스크립트 라이브러리이다. - 페이스북에서 자체적으로 사용하기 위해 만들었고, 많은 웹 어플리케이션에 적용하고 있다. - 유저 인터페이스를 만드는 라이브러리이다. - View 레이어를 담당한다. - vue.js, angular.js 와 유사하다. - React(웹 어플리케이션), React Native(모바일 어플리케이션), React Electron(PC 어플리케이션) 2) M(Model) V(View) C(Controller) 패턴 Model : Data View : UI Controller : logic 3) 리액트의 특징 - 컴퍼넌트로 이루어진 UI 라이브러리 - 컴퍼넌트는 한 가지의 기능을 수행하는 UI 단위를 말한다. - 리액트 어플리케이션..