react
react 입문과 기본 문법
코디드
2023. 2. 20. 23:53
react는 JS 라이브러리다
JS 공부가 기본이 되고 그 위에 쌓아가면 되는건데
마침 지금 jquery를 공부하는 중이라 오랜만에 html, css, js를 만지작 거리고 있어서 시작하기 좋은 시기인것 같다.
react는 굳이 새로고침을 안하는 싱글 페이지를 어플을 만드는데 많은 도움이 된다고 한다.
그리고 당연한 얘기겠지만 JS 라이브러리니까 html 사용하는데 있어서 도움이 된다.
[기본중의 기본]
미리보기 띄우기
: Terminal>New Terminal > npm start
[JSX]
JSX
: .js 파일에서 html 작성할때 쓰는 문법/언어다.
JSX 문법
1. class 넣을 땐 className
class 문법이 따로 있는데 그거랑 겹쳐서 html의 class 용도로 쓸땐 className 이라고 쓴다
2. 변수 꽂을 땐 {변수명} : 데이터 바인딩(전문용어)
let post = '어쩌구 저쩌구'; 이렇게 변수 선언하고
post 변수를 html에 넣고 싶으면 넣을 장소에 {post} 이렇게 해주면 된다.
id, className, 본문 어디든지 가능하다.
3. style 넣을 땐 style={{ 이름 : '값'}}
js에서는 'font-size'의 경우 진짜 'font 마이너스 size'로 인식하므로 fontSize로 써준다
자주 적용되는건 css 파일에 따로 빼서 쓰겠지만, 한 두개 태그정도에 적용하고 말 style은 이렇게 작성하면 될거 같다.
*이름 : '값' - 오브젝트 자료 형식