react 22

[React]React 레이아웃 만들 때 쓰는 JSX문법 3개

리액트에서는 그냥 기존처럼 html css짜서 웹페이지를 만들어나가면 됩니다. 뭔가 어렵고 복잡하게 코드 짜야하는 것 아닙니다. but, html대신 JSX라는걸 쓰는데 이것의 사용법을 알아봅시다. React의 App.js는 메인페이지다. App.js가 여러분의 메인페이지입니다. 여기 이미 채워져있던 쓸데없는 html들은 싹 비우고 시작합시다. 하나만 남기면 됩니다. JSX 문법 1. html에 class 넣을때는 className 잘보면 평소에 짜던 html/css와 다른 부분이 있습니다. 스타일을 주기 위한 class명을 넣을 때 class=" " 가 아니라 className=" " 이렇게 쓰는 부분이 좀 다른데 왜냐면 실은 App.js에 짜고 있는건 html이 아니라 JSX라고 부르는 이상한 언어라..

React 2022.06.07

[React]왜 React를 사용하는 것일까?

왜 React를 사용할까? 리액트 문법부터 들이밀면 누구나 이해가 가지 않습니다. 리액트의 정확한 용도를 알아야 리액트라는 라이브러리를 이해할 수 있는데 어떤 웹사이트를 들어가서 이런저런 버튼을 눌렀을때 페이지 전환 같은게 새로고침 없이 부드럽게 동작합니다. 이런 사이트들을 Single Page Application 이라고 하는데 - html 파일을 1개만 쓰고 - 다른 페이지를 보여주고 싶을 때 html 부분만 샥 갈아치워서 보여줍니다. 그래서 부드럽게 동작합니다. 바닐라JS로 도 만들 수는 있지만 코드가 너무 길어지는 관계로 리액트라는 자바스크립트 라이브러리를 설치해서 사용하면 이걸 더 쉽게 만들 수 있습니다. 그래서 리액트라는 라이브러리를 배우고 사용하는 것입니다. 리액트 쓰는 또 다른 이유들은 -..

React 2022.06.07