formik

• React로 웹앱을 만들다보면 우리는 사용자로부터 다양한 input data를 받는다. 이때 모든 정보를 각각의 state로 관리한다면 코드가 쉽게 복잡해질 것이다. 왜냐하면 useState을 엄청 많이 선언해야해서? 일 것 같다.
• 그래서 form 관련 라이브러리를 사용하는 편이다.
  • form 라이브러리 중 하나인 formik

yup을 사용한 validation check

느낀점

오전에 친구에게 react질문이 왔다.

• 스프린트 중에, dummydata들을 어떻게 map으로 전부 가져오는지에 대한 질문이었다.
• import dummyTweets from '../static/dummyData'; 가져온 dummyTweets에서 map을 하면
  { id: , username: , picture: , content: , createdAt: , updatedAt: , }이런 Object들을 map하는 건데, import Tweet from '../Components/Tweet'; Tweet component를 뿌려주면서 모든 el (위에있는 id,username,picture )들을 조회해서 가져오는 것이다.
• 만약 el.id만 한다면? filter를 해야겠지?

{dummyTweets.map(el => {
          return <Tweet tweet={el}></Tweet>;
        })};

FullStack 4,5 를 하면서 여러가지 hooks들과 library를 사용하였다.

• 위에서 언급한 formik, yup 그리고 useHistory , useParams , useEffect, axios, useState, 등 그리고 Promise, async,await 까지..! 다음에 한번 제대로 정리해야할 것 같다.
• sequelize 를 이용해서 db table을 만들었는데 이거에 대해서도 블로깅을 해야겠다.
• 에러 CreatePost.js에서 message err를 한글로 했는데, 3자이상 15이하? 로 설정한 값들은 자동으로 영어가 나왔다. 수정이 가능한지 모르겠다.
• CSS는 직접 한 줄 씩 대입하면서 어떤 변화가 적용되는지 파악해서 정리하는 시간을 가져야할 것 같다.
• 설치했던 extention으로 rfce를 하니 아주 편리하게 코드를 쓸 수 있었던 점이 좋았다.