[코드 스테이츠] 24일차, "그 분(React)이 오셨다"

 

  그 대단하신 React를 오늘부터 알현하게 됐다. 망했다. 사실 좀 미리 예습하기 위해서 패캠 강의를 듣고 있었는데, 패캠 강의를 듣고도 이해가 안 돼서 이해해보려고 엄청 쩔쩔 매다가 결국 코드 스테이츠의 React 시간이 오게 되었다. 이렇게 될 줄 알았으면 그냥 바닐라 자바스크립트 복습이나 할 걸. 괜히 React 한다고 패스트 캠퍼스 강의 더 많이 듣지도 못하고, 복습 기술 블로깅도 못하고 있었다. 뭐... 그래도 덕분에 React를 익히는데 다른 분보다는 굉장히 빠르게 익힌 것 같다. 이번에 React는 4일에 걸쳐서 진행되는데 나랑 이번에 맺게된 페어분은 이번이 개발 처음이신지라... 어쩌다 보니 내가 주도적으로 진행하게 됐다. 그래도 페어분께서 어떻게든 방법 찾아내시려고 노력하시는 편이라 다행이다. 덕분에 나도 꽤 좋은 영감을 얻었다. 

 

나는 프론트엔드 개발을 목표로 하고 있다. React 부셔보자

---

[ 오늘의 TODO ]

1. 코드 스테이츠) React 기본 개념
   // JSX
   // Component
   // 기본적인 사용법
2. 코드 스테이츠) Pair-Programming
   // Bare 과제 
   // Advanced 과제 (아니 이건 인간적으로 너무 어려웠고 우리 동기들도 대부분 못 푸셨음)
3. 패스트 캠퍼스) 인강 3개 이상 듣기 // optional
4. 생활) 물 1L 이상 마시기
5. 생활) 수-토-일 운동 
6. 개선)페어 프로그래밍할 때도 혼자 있을 때처럼 침착하게 오류 대처하기
   // 오류는 계속 났고 침착하게 반응했는데, 오류를 해결하지 못함
   // 알고 보니 해결 못 하는 게 90%는 당연했다...

---

[ 오늘의 해결 ]

1. props를 넘겨줄 때는 부모에서 자식으로 하향한다.

  일단, props에 대한 개념은 금요일에 코드 스테이츠에서 더 자세하게 배운다. 이 내용은 패캠 강의에도 없었기에 좀 해맸다. 내가 저지른 실수는 다음과 같다.

 

const test0 = () => {
  [a, setA] = useState('')
  const Change = () => {setA(~~)}
  <img onClick = {Change} />
}

const test1 = () => {~~}

const App = () => {

  return (
    <test0 />
    <test1 />
  )
}

 

  간단하게 설명해서  test0 안에 있는 것에서 onClick 으로 Change함수를 작동시켜서 App에 있는 test1에 변화를 주고 싶었을 때 나는 test0 안에서 onClick됐을 때의 일어나는 변화를 test0 안에서 실현했다. 그러니까 당연히 App에는 변화가 안 간다... 나는 이거 오류로 저기에 쓰면 안 된다는 걸 알고 다른 방법을 동원해서 바꿔보려 했지만 코드 스테이츠가 몇 가지 조건들을 걸었는데 바꾼 것들마다 내가 원하는 결과는 얻을 수 있어도 그 조건들에 걸려서 실패했다. 

 

  내가 바꿨어야 했던 것은 App 안에서 useState를 해주고 props 를 통해서 test0 에게 함수를 건내주었어야 한다. 

---

[ 오늘의 교훈 ]

1.  React가 왜 인기있는지 알겠다.

  일단 오늘 페어 프로그래밍 문제들을 다 못푼 것에 대해서는 좀 괜찮다고 생각한다. 나는 어떻게 보면 이번이 react를 제대로 배우는 시기인데 Bare만 통과해도 잘 한 거지.. 오늘 스프린트 리뷰를 들었을 때, Advanced를 못한 건 자책할만한 일은 아니었다. 다행.. 그리고 오늘 공부한 것을 바탕으로 제대로 얻어간 게 있다면 React를 왜 사용해야 하는지 알게 됐다는 점이다.

 

  아니, 진짜 React는 코알못이 내가 들어도 굉장히 혁신적인 라이브러리 아닌가 싶다. 그러니까 사람들이 요즘 React, React 하는 거지. 드림코딩 엘리님이나 노마드 코더의 youtube를 애청하는데 거기서도 보면 React는 지금 최절정의 인기를 끌고 있다고 한다. 근데 그럴만 하다. 그렇게 UI 조각, 코드 하나의 묶음으로 이해될 수 있는 컴포넌트의 재사용성과 유지보수성은 개발자의 입장에서 최고일 것 같다. 그러니까 결론을 말하자면

 

어떻게든 React 정복한다.

 

  React 진짜 공부 열심히 해서 퍼포먼스가 뛰어나고 유지보수와 에러 해결에 안정적인 코딩을 하는 프론트엔드 개발자가 되고 싶다.