[항해99] TIL 사전과제 스터디 D-6

오늘 react안했지만 괜찮겠지…?

• 오늘 항해99입학시험이고
• react 주특기 Q&A시간이라
• react공부를 따로 안했지만 괜찮지는 않은것같다…
• 내일 진짜 열심히 해야지..(어제도 그런거 같은데…)

그래도

• 임민영튜터님의 Q&A시간이 상당히 인상깊었고 유익했다.
• 들으면서 주요질문들의 목록과 그 답을 정리해봤는데 그걸로라도 오늘의 react공부를 살짝 대체해보자는 생각을 해본다..

자꾸 의도치 않게

• 분명 운영관련 질문은 지금 주특기 Q&A 시간이 아니라 따로 해달라 하셨는데
• 내가 (내 생각에는)의도치 않게 운영관련 질문으로 매니저님과 튜터님을 난처하게 하지는 않았나 걱정이 된다…
• 지금까지 혼자만 생각하고, 일방적으로 글로만 듣던 react지식들을 누군가와 함께 문답해본다는데에 조금 들떠서 질문하기전에 한번 더 생각해봐야했는데 그러지 못한 것 같다.
• 이제는 차분하게 말하기전에 한번 더 생각할 필요가 있다.

인상 깊었던 말

• 개발자는 “듣고 말하기”가 중요하다.

---

react Q&A

• (아래의 Q&A글(정리)은 전적으로 항해99측에 권리가 있습니다.)

클래스형 컴포넌트도 다룰줄 알아야 하나요?

• 다룰줄 알아야 합니다.
• 취업하려는 회사에 이미 클래스형으로 만들어진게 많기 때문에
• 다 함수형으로 바꿀수없기에 클래스형도 다룰줄 알아야 한다.

프론트엔드 개발자가 기술 트렌드의 빠른 변화에서 가져야 할 차별화된 역량은?

• 왜 그 기술트렌드의 변화가 생겼는지 알아야한다.
• 사용자가 불편해할 여지가 생기면 전의 코드가 폐기되고 새로운 기술이 생긴다.
• 따라서 프론트 개발자는 고객의 불편함과 니즈를 파악하고 해결하는데 포커싱하는 역량이 필요하다.
• 제발 코드를 아까워하지 말자
  • 한 코드만 꽁꽁싸매면 더 나은 코드를 짤 기회가 줄어든다.

디자이너와 퍼블리셔, 프론트개발자의 차이는

• 퍼블리셔와 같이 비중을 두면 안된다.
• html태그를 사용한다면 DOM의 영역에서 html태그를 어떻게 사용하고 어떻게 작용하는지
• 즉, 같은 태그를 사용해도 바라보는 관점이 다르다.

프론트개발자에게 cs는?

• 어느 순간 끝내는게 아니라
• 계속해서 공부해야 하는 것이다.
• 꾸준히, 하루에 10분 혹은 20분 잡고 공부하는 것이 좋다.
• 알고리즘은 사고력이다. 꾸준히 하는 것이 좋다.

좋은 포트폴리오를 만들기 위해서?

• 좋은 포트폴리오는 받아들이는 개발자마다 다르다.
• 튜터님의 경우 for문 100번돌려서 사용자가 좋으면 사용한다.
• 다른 개발자는 for문 100번 용납못할 수도 있다.
• 즉 자신이 사용자친화적인지 아니면 기능적친화적인지
• 삭제면 alert한번이라도 띄워주고, 버튼 색깔을 다르게 해서 사용자에게 알려주는것

팀워크를 위해서 어떤 목표를 가져야 하나요?

• 커뮤니케이션을 꼼꼼히 잘해야한다.
• 상냥까지는 아니더라도 “듣고 말하기”를 잘해야 한다.
• 듣기만 해도 안되고 말하기만 해서도 안된다.
• 즉, 상대방의 말을 듣고 내가 말을 해야 한다.
• 우리 팀이 목표를 정해진 시간안에 끝내자.
• 개발자는 절대 독불장군으로 일할 수 없다!
• “듣고 말하기”를 명심하자.

firebase

• 서버리스기능
• 미리 백엔드기능을 구현해놓은 기능이 있기에 리액트만으로 서비스를 구현한다.
• 웹을 하는 사람은 백엔드도 알아야 한다.
• 즉 우리는 프론트가 아니라 웹을 다 알아야 안다.
• 하나만 해서는 안된다.

최근의 리액트 버전이 18이되었다.

• 18버전으로 업데이트되며 서버컴포넌트가 업데이트 되었는데
• 한 개밖에 없는 html이 사람을 힘들게 한다.
• 이는 검색했을때 seo측으로 안좋다.
• 따라서 서버컴포넌트를 사용하면 SSR을 안해도 다룰 수 있다.
• (임민영 튜터님께서 이거 때문에 강의를 새로 리뉴얼했다고 하셨다.)

많은 서비스를 이용해봐라

• 그리고 불편한점들을 기록해놓자.
• 예를 들어 네이버웹툰에서는 편했는데 카카오에서는 없어서 불편했던점들을 고민해보자.
• 또 왜 카카오에서는 왜 그 기능을 구현 못했는지를 생각해보자.
• 프론트엔드 개발자는 항상 사용자의 입장에서 불편함을 개선하는 방향으로 고민하고 포커싱해야한다.

과제를 하며 코드를 많이 짰으면 좋겠다.

• 5000줄은 만드는데 그것의 두배인 10000줄은 짰으면 좋겠다…(!)
  • (내가 잘못들었나?..)

사용자가 원하는 기능을 아는 것은?

• 내가 불편하면 무조건 불편하다.
• 데이터를 기반으로 판단하는 것은 버튼 두 개가 있을때 어떤게 다 잘쓰이나를 측정한다.
• A,B 테스트라는 키워드가 있다.

대기업과 스타트업에서의 프론트의 역할은?

• 진짜 팀 by 팀이다.
• 신규팀이면 빠르게 구현하는게 중요하고, 운영쪽이면 탄탄한 것이 중요하다.

프론트엔드도 서버퍼포먼스를 할 수 있나요?

• 우리도 서버 퍼포먼스를 할 수 있다.
• 우리는 사용성을 중요시한다.
  • 결제단계를 5단계에서 2단계로 줄이면 고객님의 지갑이 더 잘 열린다.
• 고객님의 버그를 잡는 퍼포먼스를 신경쓴다.
• 우리는 사용자가 서비스에 얼마나 많이 머물러있나와 결제율을 신경쓴다.

포트폴리오는 보여줘야 한다.

• 코드와 화면에서 돌아가는 것 둘 다 보여줘야 한다.

기술과제는?

• canvas에서 버튼을 만들어서 버튼을 누르면 네모가 대각선으로 움직이게 하되
• 10px움직이면 두개로 나뉘어지고 하나는 아래쪽 15도 각도로 내려가게 해주세요
• 같은 과제가 나온다…
• 텍스트에디팅관련해서 사용자가 타자를 쳤을때 (강아지)라고 치면 강아지가 사라지고
• 경고창에 띄워주세요, 경고창이 3번뜨면 사용자의 창을 막아주세요
• 같은 과제도 있다.

리액트와 뷰

• 뷰는 커버리지가 작다.
• 리액트는 컴포넌트가 있어서 대형 프로젝트에 좋다.
• 리액트는 레고블록을 쌓으며 만들 수 있어서 장점이 있다.

프론트개발자는

• 코드를 진짜 많이 짜보자.
• 코드를 5000줄을 써보면 헷갈림이 사라지니까
• 코드를 정말 많이 짜보자.