얼렁뚱땅

프로퍼티란? 프로퍼티는 상위 컴포넌트가 하위 컴포넌트에 값을 전달할 때 사용한다. -> '단방향으로 데이터가 흐른다.' 이때 프로퍼티 값은 수정할 수 없다는 특징이 있다. 값을 전달 시 속성의 형태로 전달한다. 기초 예시 App.js function App() { return ( ); } MyComponent.js class MyComponet extends React.Component { render() { const name = this.props.name; return {name}; } } prop-types 사용하기 프로퍼티에서는 자바스크립트의 자료형을 모두 사용할 수 있다. 이때 프로퍼티의 자료형은 미리 선언해주는 것이 좋다. 이유 : 리액트 엔진이 프로퍼티로 전달하는 값의 변화를 효율적으로 감..

JSX란? JavaScript XML 자바스크립트에 XML을 추가한 확장형 문법 XML 또한 HTML의 표현법을 확장한 문법이므로 JSX = HTML + JS라고 보면 될 듯하다. 하나의 파일에 JS와 HTML을 동시에 작성할 수 있다. 하지만 HTML이 아니라 XML 마크업 규칙을 따른다. 예) , 같은 표현 React 동작 방식 npm start를 하면 가장 먼저 index.js 파일이 실행된다. index.js //필수 리액트 구동 모듈 import React from 'react'; import ReactDOM from 'react-dom'; //초기 화면을 구성하는 사용자 코드 import './index.css'; import App from './App'; import reportW..

NVM, Nodejs, NPM nvm과 npm의 차이점은 아래 글을 참고했다. https://lynmp.com/ko/article/tb585d114096490055 nvm 과 npm 구별하기 - LYNMP 사용을 하면서도 가끔가다 둘의 차이가 뭐였더라? 하는 의문을 갖게되는 nvm 과 npm. 아마도 알파벳 하나의 차이 때문이라고, 비영어권 사용자의 애환이라고 변명을 하는것도 슬슬 졸업을 해야겠 lynmp.com nvm : nodejs를 설치해주고 버전 관리를 해주는 프로그램이다. Nodejs : 웹 브라우저가 아닌 컴퓨터(또는 서버)에서 자바스크립트를 실행할 수 있게 해주는 것이다. npm은 nodejs와 함께 설치된다. 앱 생성하기 creat-react-app 리액트 프로젝트에 필요한 패키지들을 묶어..

아래는 "Do it! 리액트 프로그래밍 정석" 책을 읽고 정리한 내용이다. 리액트란? 리액트는 프런트엔드 프레임워크 중 하나이다. 프론트엔트 프레임워크의 종류 React 리액트 angular 앵귤러 화면 출력, 형상 관리부터 배포까지 많은 기능을 포함한 완성형 프레임워크를 지향 vue.js 뷰제이에스 가장 나중에 나온 프레임워크로 다른 프레임워크의 장점은 흡수하고 단점은 보완한 프레임워크 하지만 이 중 사람들이 가장 많이 사용하는 프레임워크는 리액트이다. 아래 사이트에서 프레임워크 다운로드 현황 그래프를 확인할 수 있다. https://www.npmtrends.com/@angular/core-vs-angular-vs-react-vs-vue @angular/core vs angular vs react vs..