211103_개발자 준비하기(32일차) - Twittler Mock up

주형(Jureamer)·2022년 1월 4일
0
post-custom-banner

오늘 배운 것


  1. Props & State를 활용하여 Twittler만들기
💡 오늘은 배운 Props와 State를 활용하여 상위 컴포넌트에서 하위 컴포넌트로의 데이터 전달을 활용하여 메시지를 전송하여(하는 모션만,,) 목록에 뿌려주는 것까지 하였다. Advanced까지 완수하고 싶었는데 Bare Minimum(기초 테스트)하는 데만도 하루 종일 걸렸다. 그 이유는 바로바로,,

Untitled

상위 컴포넌트에서 props로 뿌려준 것을 map을 사용하여 return을 하려는데 자꾸 TypeError: is not a function이 떴다. 스택 오버 플로우로 찾아보니 배열이 아닌 타입을 사용해서 그렇다는데 분명.. 배열값만 집어넣었는데 뭐지..?싶었다

Untitled

Untitled

'Array 맞아 맞다고!'

아..?저 tweet값은 MyPage라는 컴포넌트에서도 중복으로 뿌려주고 있었다. 거기서는 내가 배열이 아닌 객체로 뿌려주어 오류가 났던 것 같다. 그래서 이걸 조건부 렌더링을 시켜줬다.

Untitled

Untitled

그랬더니 값이 잘 들어간다 ㅎㅎㅎ 역시 프로그램은 거짓말을 하지 않는다. 잘못된 것은 나의 부족한 지식일뿐

추가 복습


JSX규칙

  1. 하나의 엘리먼트 안에 모든 엘리먼트 포함시키기 * opening tag와 closing tag로 감싸주어야함.

Untitled

  1. HTML 문구가 들어간 JSX를 return 할때는 소괄호를 열어준다.
  2. element class사용 시 className=""으로 표기한다.
  3. 사용자 정의 컴포넌트명을 작성할 때는 첫글자를 대문자로 표기한다.(Pascal Case)
  4. 조건부 렌더링에는 삼항연산자를 사용한다.

Untitled

  1. 여러개 HTML엘리먼트를 표시할때는 map()함수를 이용한다.

Untitled

내일 배울 것


  • 내일은 HA(Hiring Assessments) 시험을 치루는 날이다. 섹션1이 벌써 종료됐다는 게 실감이 안난다. 벌써 5주라니 그만큼 정신없이 지나가기도 했고 5주 전과 비교할 수 없을 정도로 많이 성장했다는 걸 실감하지만 개발자에겐 공부에 끝은 없다. 아직 코딩 세상에는 내가 모르는 정보가 너무나도 많기에 꾸준히 공부 해 나가야겠다.

  • HA시험에 최선을 다 하자!

profile
작게라도 꾸준히 성장하는게 목표입니다.
post-custom-banner

0개의 댓글