2022-12-05 월요일

📅 오늘 한 일

---

1. 프로그래머스 알고리즘 문제 풀기

2. 리액트 입문

3. 리액트로 간단한 렌더링 해보기

✏️ 무엇을 배웠나

---

1. JS map과 filter의 차이

알고리즘 문제 풀다가 map을 이용해서 접근했는데 결과가 불리언값으로 나오는 걸 보고 공부하게 됨.

• 공통점 : 두 메서드 모두 배열을 반환함
• 차이점 : map은 불리언값을 반환함. filter는 배열값을 반환함.

2. 리액트

JSX 표현식

• 리액트에서 자바스크립트를 사용하기 위해 나온 문법이다.
• JSX가 표현하는 것은 '객체'이다. 그러니까 JSX는 리액트 엘리먼트라는 객체를 표현하는 식이다.
• 중괄호를 사용하면 자바스크립트 표현식을 넣을 수 있다.

  • 템플릿 리터럴이랑 비슷하네.

  • 예시

    const name = 'Razo'
    const element = <h1>내 이름은 {Razo}</h1>
    	```

• JSX로 리액트 엘리먼트를 생성한다.
• 기타 꿀팁
  • 태그는 반드시 닫는다
  • 한 컴포넌트는 1개의 엘리먼트로 구성되어야 한다. 상자 안에 몇 개가 있든 담는 상자는 1개여야 함.
  • jsx js값을 가져오려면 중괄호 써야 됨.
  • class 대신 className을 쓴다

엘리먼트

• 엘리먼트는 화면에 보여질 내용이 됨.
• 엘리먼트는 리액트의 최소 단위임.
• 엘리먼트는 객체임.
• 엘리먼트가 모여 컴포넌트를 구성한다.
  • 컴포넌트 = 엘리먼트 + 엘리먼트 + 엘리먼트

🔎 더 알고 싶은 것 / 보완이 필요한 것

---

1. 리액트 관련 기초 개념 숙지

어차피 직접 만들어보면서 더 배울 테니까, 리액트의 기초 개념들만 숙지를 하자.

---

🏷️ 오늘의 코멘트

리액트를 배우기 시작했다. 새롭고 재밌다. 무엇보다 간편하다는 느낌이 든다.