[React] 시작

사용자 인터페이스를 만들기 위한 자바스크립트 라이브러리 종류

리액트 , 뷰 , 앵귤러 //

 

리액트란 ) 

실제 dom과 가상의dom을 비교해서 가상의 돔의 상태가 

변경되면 실제의dom을 변경시켜준다

**하나의 태그 , 닫기 필수 

 

리액트의 장점

• 컴포넌트 단위 개발(생산성 향상,유지보수 용이)
• 싱글페이지 어플리케이션 (사용자 경험 개선)
• 높은 인지도(vue가 난이도는 더 낮지만 react가 사용자가 가장많음)

 

jsx 구문 (리액트에서 사용하는 xml을 자바스크립트로바꿔주는 구문)

• 닫혀야 하는 태그(태그는 꼭 닫혀야 합니다.)
• 하나의 태그로 감싸져 있어야 함. (< ></ >)
• jsx안에 자바스크립트 사용은 { }감싼다.
• class 지정은 classname속성을 사용
• 주석 { /* 주석 */ }

리액트설치법)

1.Node.js를 설치해준다 (검색하고 들어가서 다운받으면됨..)

2.cmd 를 켠다 리액트파일을만들어줄 폴더를 생성하고 cmd 위치를 해당폴더로 이동

            cd C:\Users\me\Desktop\react(리액트파일을 만들어줄폴더이름)

            npx create-react-app 폴더이름

 

그러면 어려운 영어들이 실행되면서 리액트 폴더를 만들어준다.

 

Happy hacking! 이 뜨면 성공이다.

성공하면 이제 비쥬얼스튜디오로 해당폴더위치에 들어가서

터미널을 켜준뒤에.(ctrl+j)

npx start를 입력해주면 localhost:3000 에 호스팅된다.

 

이런화면의 웹사이트가 켜지면 성공 이제 app.js 에 다른컴포넌트를 만들어서 임포트 시켜서 사용하면된다!

이제 예제들을 하나씩 풀어보자!~