jsx(3)
-
React 입문 - Component
컴포넌트의 기본 구조 // import React from 'react'; function App() { // return ( /* */ ); } // export default App; component는 레고 블럭같은 존재! 컨포넌트를 외부에서 가져올때는 import(컴포넌트 맨 위 코드)를 해줘야하고 내보낼때는 export(컴포넌트 맨아래 코드)를 해야한다. 그리고 App 함수 안에는 return 문을 기준으로 위로는 자바스크립트를 쓰는 영역, 아래는 JSX를 쓰는 영역이 존재한다. 컴포넌트 이용시 주의할 점! 컴포넌트 사용시 이름의 첫 글자는 대문자를 사용해야한다. (예 - App ) 폴더의 이름의 경우 소문자를 사용해야한다. 이름 짓는 방법 : 변수명이나 클래스명을 만들때 규칙을 정해서 만든다...
2022.12.26 -
JSX 기초 - html을 품은 JS
태그는 꼭 닫아주어야한다. 하나의 Element만 반환할 수 있다. ( 마지막에 태그에 담아주면 된다.) return ( 안녕하세요! 리액트 반입니다 :) ); 위 코드를 실행하면 엘리먼트가 2개라서 에러가 난다. return ( 안녕하세요! 리액트 반입니다 :) ); 이렇게 return안에 맨 앞에 맨 뒤에 태그를 넣어주면 하나로 인식되서 정상 작동 된다! JSX안에서 자바스크립트를 사용하려면 중괄호를 사용해야한다. { } 삼항연산자를 사용할때도 중괄호를 사용해서 하면 된다. class를 사용하지 않고 className을 사용한다. Html태그에 style을 직접 사용할 수 없다. btn // 기존 html에서 사용하던 방식 btn // JSX에서 사용할 수 있는 방식 const styles = { c..
2022.12.26 -
React 입문 - React / DOM / JSX
라이브러리는 angular
2022.12.24