TIL 19

👊 두 번째 벽을 맞닥뜨렸다.

집중도 1~5 (4.1)

'개인과제를 그래도 거진 다 하지 않을까라고 희망을 갖고 있었지만, 점심 먹기 전에 빠르게 판가름이 났다. 1주일 전 금요일에 세웠던 내 전략은 실패다. 과제를 더 깊이 알게 된 오늘 생각 해보니 지난 주차에 비해 이번 주차 과제는 요구하는 게 훨씬 많았다. 많든 적든 내가 계획한 것에 근사치까지도 못 갔다라는게 날 너무 좌절시켰다.

항해 시작 후 이렇게 초조하고 맥이 빠진 느낌은 처음이다. 그래도 결국 이번 주도 아슬아슬하게 해낼 수 있을 거라 생각했는데, 항해에서 처음 맛보는 실패였다. 실패의 맛이 처음이라 그런지 너무 쓴 탓에 헤롱해진 정신은 쉽사리 원상 복귀하기 힘들었다. 그래도 시간은 가니까 얼른 뭐라도 하자라는 생각에 스트레스를 빨리 완화시켜야 겠다라고 생각되서 원래는 9시 이후에 해야 할 턱걸이를 바로 했다. 이 또한 역시는 역시였다. 헬스, 턱걸이 등 노래 들으면서 신나게 하는 근육 운동은 그 순간 스트레스란 모든 걸 잊게 만든다. 앞으로도 벽은 계속 나올 거다. 벽을 마주했을 때 돌아가거나 넘어갈 더 훌륭한 요령을 캐치해 내야 한다.

이거 말고 할 게, 얻을 게 뭐가 있어? 그치? 지구는 둥구니까 좋게 좋게 생각하자고~ ( 근데 지구랑 좋은 생각은 무슨 관계지? ) '

6/9 목

---

기억할 것

---

1. form 태그로 input 을 만들었을 떄 맨 아래 버튼 타입 submit으로 하고 form 태그 안의 속성에 requierd라고 적어주면

   안에 인풋 값이 없으면 아래 버튼이 실행이 안 됌.
   
   
   

---

오늘 할 일

---

1. !! form 태그로 감쌌을 때 input 태그에 requiered 속성 넣으면 input 값 없으면 아래 submit 형식의 버튼이 실행이 안 됌.

2. !! 하 생기는 로우들 마다의 위 아래 마진 줘야함...

3. !! 로그인한 주인만이 수정할 수 있게 해야하는데 흠...

4. !! 회원가입 되면 로그인 화면 보여주기 ! ( 환영의 alert 뛰어주면서 )

5. !! CRUD!!!!!!!!!!!!!라도 어떻게든 내꺼 만들고 자야함...

6. !! fetch ( ) 를 사용해서 서버에서 데이터를 가져옴 ( 파이어베이스에서 getdoc 역할 )

   < 매니저님 h99 그거 어떻게 fetch( )를 통해서 서버에서 데이터 가져왔다 알아볼 것 >

   자바스크립트 개념이니 fetch 공부해야함 !!

   아마 이거 코딩누나가 그렇게 했던 걸로 암.

   fetch ( ) 를 알면 Axios도 알아야함... < 이 둘은 같이 쓰임 >

   매니저님 깃헙 hh99 여기에 axios 사용하는 거 정리해둠

   < 매니저님 꺼 보고 서버랑 어떻게 통신하는지 데이터 가져오는지 알아내자 >

7. !! 파이어스토어 안 쓰고 서버랑 어떻게 통신하는지 오늘 공부할 것 !!! ( 무조건 알아놔야함 )

   < 1:12분 부분 꺼 보고 axios 어떻게 get, post 하는지 연습할 것 >

8. postman 대신이 thunder client vs코드의 확장프로그램 쓰면 서버와 요청되는지 확인 가능 . ( api로 테스트)

9. 모든 건 투두리스트를 기반으로 어떻게 삭제하지? 어떻게 업데이트 시키지? 생각하면 됌. ( 이거 리액트 중급 강의 여

10. 그냥 리액트를 수없이 계속 만들어봐야함. ( 리액트 리덕스가 어떤 방식으로 굴러가는지 완전히 이해하고 베이스가 되있어야함 )
    
    
    

---

해야할 것

---

1. ?? 과제하면서 버튼의 위치가 다른 페이지임에도 같은 위치 같은 사이즈 였으면 했음. -> 아마 이때 스타일컴포넌트로

   button page 만들어서 사용하는 듯 ==> 정확히 알아내자 ( 과제 끝나고.... 지금은 시간이 없어 ㅠㅠ)

2. ?? data( ) 정확한 사용법

3. ??!! CRA란?? ( 매니저님 말씀 중에 나옴 아마 처음 코드를 짜는 것과 관련된 것이리라. )

   
   
   

---

아이디어

---

1. 하 대가리 깨질 것 같다 abc까지 밖에 ....... + [...육두문자들]

2. local 스토리지로 받아왔다고 함 ( 다른 분은 쿠키를 넣었다고 함 ) 쿠키를 왜 넣어?

   고유 키 값 ( id를 넣어서 id가 동일하면

   useselect로 true, false 만들어서 쿠키 값을 비교한다.

   
   
   

---

예상기 매니저님 말씀

---

1. 어느 순간까지는 진짜 죽어도 모르겠다가 갑자기 밥 먹다가 디스패치를 꺠달았다 하는 순간이 있음

   ( 내가 예상한 바가 맞았음. 이것 또한 역시임.. 일단 무조건 꾸준히 계속 멘탈 무너지지마!!!! 코딩은 시간에 실력이 비례하지 않고

   계단식이다 가다가 갑자기 어? 하고 툭하고 올라감 !!! 중국어랑 똑같다!!!!

2. 더이상 바꿀게 없다. 더이상 추가할 기술 스택 없음. 지금처럼 쓰던 대로 하면 됌.
   ( 다른 기수가 한 거 보면 휘황찬란 해보이지만 디자이너가 붙어서 그런거지 깃헙 가서 보면 그 코드 다 해석할 수 있음. )

3. 108배 하듯이 그냥 맨날 꾸준히 계속하면 됌

4. 팀원과 소통하는 법을 키워라!! 이게 가장 중요!!!

5. 협업 때 소통하는 방법이 가장 중요함!! 실력이 매일 꾸준히 하면 어차피 레벨업하고 비슷해짐

   ( 협업할 때 간단한 화살표 함수가 맘에 안 든다던지 그런 게 막 생김. 백엔드에게 뭔가를 부탁했을 때 백엔드가 그게 뭐가 필요해요?

   라고 할 수 있음. 그런 상황에 어떻게 대처할건지 커뮤니케이션이 아주 중요함! 애초에 백엔드에게 저런 말이 안 나오게 어떻게 처음부터 말하면 좋을까

   라는 걸 애초에 고민이 깔려 있었더라면 이후에 싸울 일이 아예 생기지 않을 것. )

6. 기술은 여태껏 했던 거 계속 연습하고 쓰고 다음 번엔 어떻게 더 효율적으로 쓸까 고민하고 하면 이해도가 점점 깊어질 것

   이젠 복습 업그레이드만이 남았다!!!! 이제 항해 끝날 때까지 새롭게 배울 기술 스택은 없다!!!

7. 리액트에서 코드를 사용해서 기능 작동을 할 때 페이스북 개발자도 이렇게 쓸까? 라는 고민은 매니저님도 드심

   그러니 답은 잘하시는 사람의 코드를 보자. ( 깃헙에서 고수들꺼 코드보고 잘하는 사람은 이걸 어떻게 쓸까 보고 또 고민해보고 하는 것 )

8. !! 벨로그 벨로퍼트가 만든 거임 !! 벨로퍼트가 벨로그 만든 소스도 공유해놨음 !! 잘하는 사람은 리액트를 어떻게 쓸까 봐보자 !!!

9. !! 예상기님이 유명한 사람들 깃헙 다 팔로우 해두심 그 사람들꺼 나도 팔로우 하기.

10. !!!! 모방!!!!!!!!!!! 일단 따라해보고 내가 그 사람걸 다 이해했으면 된다. 그걸 바탕으로 그 다음 단계로 나아가면 장땡!!!

11. 강의를 좋아하신다. 노마드, 드림코딩, 인프런 등 다 사보셨다고 한다. 강의 사는 목적은 강의를 하는 사람은 잘하는 사람이니 이 사람은 어떻게 코드를 짤까?

    그걸 보는 목적으로 많이 사셨다고 함. ( 당연 배우는 것도 포함 ) , 하다 보면 나만의 코드 스타일이 생김

12. 매니저님 예전 미니프로젝트 등 예전 코드는 어떤 식으로 짰는지 봐보자 !

13. 리액트 ( +프론트엔드) 나온 지 얼마 안 되서 정확한 클린 코드란 없다. 토스 유투브에서 리액트에 대한 컨퍼런스들 봐보기 !

    토스에서 리액트 컴포넌트 등 클린코드는 뭘까에 대한 영상 꼭 봐보기!!

14. !! 협업 시작할 때 처음에 규칙을 다같이 짜야함. 녹화 25분 부분 매니저님이 이전 프로젝트에서 규칙 짜본 거 있음 한 번 봐보자

    ( 이걸 코드 컨벤션이라고 함. 컨벤션을 정한다. )

15. 채팅등 다하기로 해서 백엔드가 api짯는데 나중에 프론트가 못 하겠다.. 싶으면 안 되니

    첨에 계획할 때 가장 중요한 걸 기반으로 이거 먼저 하자라고 하고 CRUD 기본!! 그거 다 하고 플러스로 더 할 수 있다고 할 때

    채팅이니 뭐니 추가하자고 말하는 것.

    API 회의를 잘 해야한다.>!!!!!!!!!!!!!! <axios 쓰니 그거 공부할것... >

16. 와이어 프레임이 만들어지고 (화면이 존재한다라고 하면) API를 어떻게 할지 그때 짠다.

17. 백엔드와 프론트 구분이 잘 안간다. 내일 ( 우리가 백엔드에게 받아야할게 뭔지 먼저 백엔드에게 물어보자 )

18. API 회의할 때 정신차리고 내가 원하는 리스폰스를 백엔드에게 정확히 얘기해줘야함. 아니면 곤란해짐

    ( url, req, res 를 백엔드와 같이 얘기하면서 짜야함. 그 담 같은 프론트끼리 컨벤션( 코드 룰짜고) 이제 뭐할지 정해서 각자 분담해서 하면 됌

19. 레퍼지토리는 리덕스 싹 다 복사해서 하나 파일 만들어서 한 명이 정해서 올리기 ( 근본, 베이스 )
    ㄴ

20. !!!!! 1. 쭈뼛쭈뼛 인사하고 2. S.A 하고 3. 아이템 정하고 4. 와이어프레임 그리고 5. API 명세서 작성 6. 프론트 컨벤션 7. 역할 분담 8. 기능 구현

21. API 명세서란???? 어떻게 짜야할까

22. 내일 백엔드와 대화할 때 우리가 미리 알고 있어야할 것에 대해 오늘 자기 전에 다 알고 있을 것 ( 프론트 고수 분들에게 물어보자 )

23. !!!!!!!1 시간이 남으면 오늘 내일할 꺼 CRA를 미리 해서 레포지토리를 깔아두자 그럼 굉장히 편할 것. ( 근데 CRA가 뭐야???)

24. 다음주까지 리덕스와 리덕스 썬크를 복습한다는 방식으로 하면 된다. 따로 추가되는 게 없음 ( 리덕스와 썬크 자유자재로 쓸 수 있나가 중요 )

25. 모든 건 투두리스트를 기반으로 어떻게 삭제하지? 어떻게 업데이트 시키지? 생각하면 됌. ( 이거 리액트 중급 강의 여기에 업데이트, 딜리트 내용도 있음 )
    
    
    

---

내일할 것

---

1. 내일 axios 써야하니까 미리 공부해둘 것 .