자기계발 캠퍼스

ReactDOM.render로 각종 HTML 태그를 입력해서 화면에 출력할 수 있었고 이를 잘게 쪼개서 component로 바꿀 수 있었습니다. Card 라는 component를 만들어서 를 여러개 입력하면 그만큼 출력이 가능하죠. (비욘세 누나 너무 아름다우시네...) 이렇게 component를 만든다면 비욘세 누나만 계속 나오고 다른 인물들을 추가하기 위해서는 새로운 component를 또 만들어줘야 합니다. (물론 저는 비욘세 누나 있는 component만 반복해서 출력해도 너무 좋습니다.) 하지만 아쉬워하실 분들을 위해 props라는 기능이 있습니다. HTML 태그 안에 속성부터 태그 안에 넣을 데이터까지 컨트롤이 가능합니다. 함수에 props라는 인자만 추가해준다면 말이죠. 라는 태그 안에 na..

이전에 배운 걸 토대로 h1과 ul을 화면에 출력시키려면 위의 코드처럼 작성하면 됐다. React를 들어보면서 component라는 말을 정말 많이 들어봤는데 드디어 오늘 처음 배웠다. 뭔가 새로운 걸 알았다는 설렘과 이렇게 편한데 내가 지금까지 한 건 뭐지...라는 회의감이 온다. 제목에 해당하는 h1태그를 Heading.jsx라는 파일로 따로 만들고 list에 해당하는 부분들을 전부 끌고 와서 List.jsx라는 파일로 따로 만들었다. jsx 파일 형식은 React에서 작동하는 자바스크립트이므로 꼭 앞에 React를 import 해주어야 한다. 그리고 각각의 파일 맨 마지막에는 Heading과 List를 default로 export 할 수 있도록 코드를 작성했다. 얘네를 이제 App.jsx 파일로 가..