React intro. Node.js 설치

alert("april");·2023년 8월 11일
0

React

목록 보기
1/17
post-thumbnail
post-custom-banner

React.js(javascript로 만들어져 있다)

V(view)에 집중하여 개발할 수 있도록 고안된 라이브러리
개발을 주도하고 있는 회사(페이스북)
핵심개념: 화면단에서 자주 쓰이거나 반복이 되는 부분을
쉽게 다루자

컴포넌트(Component)

UI상의 특정 부분을 일컫는 말
리엑트 숙련도의 기준은 UI에서 컴포넌트를 어떻게 분리 할 것인가?
    1. 반복이 된다(여러페이지에 사용이 된다)
        레이아웃
    2. 데이터가 변경이 된다

    3. 최소한의 기능을 가지고 있다
        버튼

렌더링(Rendering)

화면에 UI를 사용자에게 보여주는 행위(그려주는 행위)

초기 렌더링(initial rendering)
    빈 도화지에 최초로 UI 그려지는 행위
리렌더링(re-rendering)
    이미 그려져있는 UI가 다시 그려지는 행위

node.js 다운로드

node.js란?

Node.js®는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임입니다.
Node.js는 크롬 V8 엔진을 기반으로 만들어져있는 자바스크립트 실행기
Node.js를 설치할 때 같이 설치가 되는

npm(파일 관리자 프로그램(여러가지 라이브러리를 다운로드 받을 수 있는 사이트))
을 사용하기 위해서 node.js를 설치한다-안드로이드 마켓
예전에 안드로이드 마켓에서 KT올레마켓을 다운받을 수 있었음.
yarn(파일관리자 프로그램 made by Facebook)-올레마켓
Q. 그럼 뭘 써야되요? 갠취...안정성, 신뢰성이 둘 다 보장되나
대신 다운로드 받을 수 있는 라이브러리의 수가 다를것임.
npm이 yarn보다는 더 오래됐기때문에 라이브러리 수가 더 많은걸로 알고있다
속도 측면에서 yarn이 더 빠르다는 얘기가 있다

리액트 라이브러리(남들이 만들어놓은 여러가지 코드모음(함수들, 편
의 기능들))

리액트 프로젝트 폴더 만들기

주소를 파악해야한다
내가 만들고자 하는 위치까지 이동(cd 폴더/폴더)
이동이 다 되었으면 npx create-react-app goborrow(프로젝트 이름)

프로젝트이름을 지을 때는 띄어쓰기가 있거나 대문자가 있으면 안된다(나중에 만들고 바꿔주면 됨)

js 파일은 코드를 자바스크립트로 해석하는 파일(.pptx)
js 파일 안에있는 <div></div>이런 코드는
마치 html으로 해석하는 것처럼 보이게 착시를 일으킬뿐 엄연히 js 코드이다.
js 안에서 사용하는 태그형태의 코드를 jsx(JavaScript extensible) 라고 한다.
과거에는 구분을 했지만 지금은 편의상 통일을 했다(typescript는 이걸 아직도 구분해서...알고는 있어야함)

profile
Slowly but surely
post-custom-banner

0개의 댓글