개발일지
-
[은버지] React로 검색창 구현하기개발일지/항해 99 2023. 7. 1. 22:08
진행과정 시간 : 07. 01 (토요일) 오후 3시~ 9시 진행과정 : 먼저 검색창에 대해서 구현을 하기에 앞서 이전 pagination 단계에서 전혀 꾸미지 못한 Css를 이번 과제에서는 어느정도 완성도 있게 해보고 싶은 마음이 있었다. 그래서 전체적인 틀을 짜면서 css를 건드리면서 작업을 하게 되었다. 이후 CSS의 위치가 어느정도 구현되고 나서 API를 불러오는 로직을 구현하기 시작했고 실제로 console창에 띄우기까지 마무리를 하게 되어 이 데이터를 최근에 배우게 된 redux를 통해서 전역상태관리를 하고싶어서 redux를 구현하기 시작하였다. 어느정도 리덕스에 대한정리가 된 시점에서 파일을 나누는 과정에서 여러에러요소를 만나게 되었고 9시가 지나 발표를 할 시간이 되었다. 발표에 참석한 인원..
-
[항해99 주특기] 2주차 강의내용 -Redux2편개발일지/항해 99 2023. 6. 30. 13:11
리덕스란? 상태관리 라이브러리로써 useState로 지역적으로 상태를관리했던 것을 중앙관리소인 store를 통해서 대신관리한다. contextAPI로 상태관리를 할 수도 있지만 안좋은 부분으로 하위컴포넌트 전체가 리랜더링되는 부분이 있다. (나중에 시간나면 contextAPI 찾아보자)그래서 상태관리면에서는 부족한면이 굉장히 많다. 그래서 리덕스의 사용이 더 좋은 부분이 많다. (사실 이러면 contextAPI가 왜 있는지 모르겠다 ) global state(전역상태 ) && local state(지역상태) 모든컴포넌트가 store에 접근 할 수있다. 하지만 어떤 컴포넌트는 보여지는 역할만 하기에 접근하지 않아도 되는 애들도 있다. 그렇기에 컴포넌트를 container폴더와 component로 나뉘어서 ..
-
[항해99 주특기] 2주차 강의내용 -React 1편개발일지/항해 99 2023. 6. 27. 13:14
Style Components Css in js방식 js코드로 css코드를 작성을 할 수 있다. 새로운 package를 사용해야하여 따로 설치를 해주어야한다. yarn add styled-components 왜 써야하나?? JS의 패키지 중의 하나로써 꾸준히 사랑받고 사용되고 있으니 대세를 따르자 emotion, styled components, tailwindscc 중에서도 가장 인기가 많다 (하지만 tailwindcss도 꾸준히 올라오고 있기에 한번 봐보자) 패키지란? 리액트에는 없지만 리엑트에서 가져와서 사용할 수 있는 서드파티 라이브러리 사용방법 변수선언방법으로 (styled.HTML요소) const stBox = styled.div` const StyledDvi = styled.div` css ..
-
[은버지] React로 Pagination 구현하기 - 회고록-개발일지/항해 99 2023. 6. 26. 09:35
구현 한 내용 및 주요 회고 1. pagination 게시물 사이트에 가면 게시물을 넘길때 번호 클릭하고 그러는 것 라이브러리도 있지만 실제로 구조에 대해서 구현을 직접해보는 방식을 택해서 하나하나 뜯어보게 되었다. 2. axios를 이용해서 API 사용해 보기 (with postman) 잘 안된점 1. css 건드릴 대 main.jsx 다 삭제를 하고 index.html도 이것저것 건드렸었는데 사실 이거 건드리면 안되는 거였다. main.jsx를 건드리면 안되는 이유 root라는 놈이 담긴 index.html의 가 있는데 이놈자식을 main에서 import 해서 document~~로 실행을 하고 있다 그래서 건드리면 안됨 2. API연결하면서 정보를 불러 올때 몇가지 트러블슈팅이 있었다 API설정해서 ..