코드스테이츠(Immersive) 썸네일형 리스트형 추석스프린트 day02(Hiring review) 1. async-word-count : 콜백을 이용한 비동기 처리 방식 콜백처리가 익숙지 못하다고 생각한다 2. Queue : 문제는 금방 풀었으나 storage 객체 접근하는데서 this를 빼먹어서 헤맸다 3. Horse & FlyingHorse : 상속 부분, 안쓰니까 매번 까먹는다 다시 공부하기 4. module-exports 5. this 6. tree map 토이 25~28(hashtable, linkedList, queueStack, binaryHeap) 자료구조 부분 어렵다.. 추석스프린트 day01(Source Tree, Redux) git reset : 버전을 변경하면서 이전내역 삭제, 저장소가 예전 상태로 돌아간다, 해당 버전을 reset 하게되면 이전버전으로 돌아간다 git revert : 버전을 변경하면서 변경내역 기록 이전내역 보존, 역순으로 하나씩 revert Redux : state container - single source of truth : 단 한개의 store 사용 / Flux와의 주요 차이 - state is read-only : 변경을 하려면 action이 dispatch 되어야함 - changes are made with pure functions : reducer는 순수함수로 작성 되어야함 (네트워크 및 데이터베이스 접근 x, 인수변경 x, 순수하지 않은 API사용불가(Date, Math...) Actio.. 2주프로젝트(WebPaper_day10 : 프로젝트를 끝내면서) 개인적인 회고 마지막에 배포 관련 이슈가 생겨서 팀 회고 시간을 갖지 못하게 되었다. 개인적으로 배포를 하는것보다 팀 회고 시간이 더 중요하다 생각해서 회고 시간을 갖길 원했으나 설득하질 못했다. 모두다 다른 방향을 생각하고 있고, 같은 방향으로 이끄는 일은 참 힘든것 같다. 그래서 개인적으로나마 2주간 팀프로젝트를 진행하면서 있었던 일들을 되돌아보고자 한다. 처음에 아이디어 기획안을 냈을때는 기획대로 구현해보고 싶은 마음이 컸지만, 현실적인 시간과 상황이 처음 했던 기획과는 다른 방향으로 이끌었다. 항상 디테일하게 계획을 짜고 일을 진행하고 싶었지만, 시간이라는 압박에 쫓겨 그냥 그냥 넘어가고 말았던것같다. 글을 쓰면서 느끼는 점은 시간이라는 압박에 제대로 대처를 못한것같다. 시간을 더 확보하려는 노력.. 2주프로젝트(WebPaper_day09 : GridList, Comment Component 만들기) 2주 프로젝트 발표 준비 결과물 30% 이하, 고생했던 부분, 다음에 주의 해야할점, 아키텍쳐를 잘못 짬(처음시작이 중요하다 ) -> 4주에서 주의할점 Comment Component에서 _id를 찾아서 db에서 코멘트를 가져오기로, 상위컴포넌트에서 _id props 전달 상위컴포넌트 하위 컴포넌트 관계가 정리가 잘안된다( 처음 시작때 그림 그려놓기) 2주프로젝트(WebPaper_day08 : React state & setState) map을 써서 dynamic하게 렌더링을 했지만, 모든게 버튼처리 되는 문제 발생 -> 상위컴포넌트에서 Link 처리 기사 li 클릭시 state 변경 -> article 인자 받아와서 setState 설정 setState는 aysnchronous이므로 바로처리 되지않는다 (콜백이용) link로 연결시 props 전달하는법 -> _id를 써서 api에 접속해서 data를 가져오려했는데 넘겨주는게 나을거같다 -> link안에서도 state를 전달할 수 있구나 2주프로젝트(WebPaper_day08 : React state & axios) 카테고리를 선택하면 axios get 요청을 해서 데이터를 렌더해야한다 - state 부분 수정 , 특정기사 수 만큼만 저장 선택한 카테고리들의 state 변화 줘야됨 prevState is a name that you have given to the argument passed to setState callback function. What it holds is the value of state before the setState was triggered by React; Since setState does batching, its sometimes important to know what the previous state was when you want to update the new state ba.. 2주프로젝트(WebPaper_day07 : React Hooks) 기사의 클릭수를 저장하기위해 리액트 훅을 사용하기로 결정 비슷한 예시들을 찾아보기로 처음엔 클릭수를 저장해서 넘겨주려 했으나 이벤트가 클릭되면 Api에 아이와 카테고리를 포스트 하는 방식으로 => 공부해야할것 : React Hooks, axios 오피스아워 - 훅스 보다 기존 기술을 먼저 연습 - 커밋을 중요하게 생각하자 Hooks useEffect 사용해서 Data fetch하기 export default () => { const [count, setCount] = useState(0); const [person, setPerson] = useState(null); const [loading, setLoading] = useState(true); useEffect(async () => { const r.. 2주프로젝트(WebPaper_day06 : 라우터 셋팅) BrowserRouter It uses history API, i.e. it's unavailable for legacy browsers (IE 9 and lower and contemporaries). Client-side React application is able to maintain clean routes like example.com/react/route but needs to be backed by web server. Usually this means that web server should be configured for single-page application, i.e. same index.html is served for /react/route path or any other rou.. 2주프로젝트(WebPaper_day05 : 기본 컴포넌트 작성) 컴포넌트 업무 분배에 고민 -> 기능별로 분배하는것이 좋다 클릭된 아이템의 디테일페이지로 어떻게 넘어가느냐 고민.. React-Hooks > Hooks가 편하긴 하지만 클래스 컴포넌트로 먼저 사용하는게 나을듯 React Router - Link : to 를 이용하여 해당 url로 link( a 태그 역할) exact를 붙이면 정확한 url에만 반응 - Route : props로 받은 path로 접속하면 component props의 컴포넌트로 연결(render)시켜준다 Link와 마찬가지로 exact 키워드 사용 가능 props를 사용하고 싶다면 Mycomponent myProps='hello; />} /> exact render={(props) => ...props} isAuth={true} /> -S.. 2주프로젝트(WebPaper_day04 : 스탠드업 미팅, 리액트라우터) 스탠드업 미팅 세션 - 어제 뭐 했는지, 오늘 뭐 할건지 정리 - Scrum 테이블 - 팀장 주도하기 - 코드 및 스택에 대한 질문은 따로 미팅 스프린트 후 회고 작성 프로젝트 과정이 중요! (그러므로 회고 중요) 헬프데스크 더 이용하기 Eslint 에러 지속적으로 발생 > 글로벌 설치가 아니라 프로젝트 내에서 설치후 다시 해보기로 > Failed to load config \"standard\" to extend from > 노드모듈 삭제, package-lock.json, package.json 에 eslint관련 삭제 컴포넌트 설계하기 오피스아워 route Switch 헤더 이전 1 2 3 4 5 다음
