본문 바로가기

Web/React3

[React] JSX Rreact JSX JSX(JavaScript XML) Javascript에서 쓰는 HTML과 비슷한 것 Javascript에 XML을 추가한 확장한 문법 JSX는 리액트로 프로젝트를 개발할 때 사용되므로 공식적인 자바스크립트 문법은 아님 ※ 핵심 특징 1. 반드시 부모 요소 하나가 감싸는 형태이어야 함 2. Attributes나 css는 낙타 방식임 (className, textAlign) 3. Js코드를 활용하고 싶다면 {}를 이용함 -> 객체형태로 넣어주기 4. 태그 이름은 기존 HTML과 거의 유사함 ※ HTML과 XML의 차이점 HTML XML Hypertext Makup Language Extensible Makup Language 웹 페이지 및 응용 프로그램의 구조를 만들기 위한 표준 마크업.. 2022. 2. 22.
[React] create-react-app create-react-app NPM = Node Package Manager 먼저 Node는 Node.js를 의미하는 것 package라는 것은 package로 만들어진 것들을 의미하는 것( package는 모듈이라고도 불리는데 패키지나 모듈은 프로그램보다는 조금 작은 단위의 기능들을 의미) Manager는 관리자를 의미 이걸 합쳐보면 npm이라는 것은 Node.js로 만들어진 pakage(module)을 관리해주는 툴이라는 것 즉, Node.js로 만들어진 모듈을 웹에서 받아서 설치하고 관리해주는 프로그램 NPM의 특징 1. 개별 프로젝트 폴더에 따로 설치 가능 2. 전체적으로 사용하도록 설치도 가능 (-G, GLOBAL) 3. 사용은 주로 npm으로 시작 4. npx: 따로 모듈 설치 없이 사용할 .. 2022. 2. 18.
[React] 개요 React facebook에서 만든 프론트엔드 프레임워크 웹 프레임워크로, 자바스크립트 라이브러리의 하나로서 사용자 인터페이스를 만들기 위해 사용됨 [Web Frameworks] react는 인기가 많다.! [React의 장점] 선언형 React는 상호작용이 많은 UI를 만들 때 생기는 어려움을 줄여줌 애플리케이션의 각 상태에 대한 간단한 뷰만 설계하면 됨 그럼 React는 데이터가 변경됨에 따라 적절한 컴포넌트만 효율적으로 갱신하고 랜더링 함 선언형 뷰는 코드를 예측가능하고 디버그하기 쉽게 만들어줌 컴포넌트 기반 스스로 상태를 관리하는 캡슐화된 컴포넌트 이를 조합해 복잡한 UI를 만듬 컴포넌트 로직은 템플릿이 아닌 JavaScript로 작성됨 다양한 형식의 데이터를 앱 안에서 손쉽게 전달할 수 있고, .. 2022. 2. 10.
반응형