프론트엔드 개발자의 기록 공간

❗❗ 데브코스 18일차 (08.25) ✏️ ~~ing 어제에 이어서 To do App을 만드는 실습을 계속 진행했다. 기본적인 fetch api, 데이터 흐름까지는 이해할 수 있었지만 세세한 디테일이나, 낙관적 업데이트, 비동기 처리가 엮기면서 조금씩 이해하기가 힘들어졌다. 강의를 수강 후에, 코드를 보며 컴포넌트 구조를 그려갔다. 이제서야 눈에 보였다... 앞으로 두번 세번 봐야 진짜 내 것이 될 것같았다. 평소 React로만 개발을 했어서 VanillaJS로 개발하는 과정에서 많은 것을 배울 수 있었다. VanillaJS로 구현하다보니 state, props등의 관리가 다소 까다로웠고 왜 React가 나왔고 사용하는지 조금 더 깊게 이해할 수 있었다. 왜 사람들이 기본기를 중요시하고 또 과제테스트를 ..

❗❗ 데브코스 17일차 (08.24) ✏️지금까지 배운 VanillaJS을 활용한 TodoApp만들기 실습을 진행했다. 기본적인 구상은 다음과 같다. 초기 화면에 user들의 정보가 담겨져있는 userList가 나타난다. 이후 user를 클릭하면 user에 해당하는 todoList를 불러와 화면에 랜더링 한다. user에는 user추가 기능이 있고, todoList는 추가, 삭제, 토글 기능이 존재한다. 이 모든 기능은 fetch api 통신으로 처리한다. 또한 각 user.name 기준으로 history api를 이용하여 라우팅 처리를 해준다. ✏️지금까지 배웠던 것을 모두 써보면서 조금 더 데이터 흐름을 어떻게 구성해야하고, 컴포넌트 구성을 어떻게 해야하는지 조금씩 이해하기 시작했다. 또한 낙관적 업..

❗❗ 데브코스 16일차 (08.23) 벌써 4주차 시작이다. 역대급으로 시간이 빨리 흐르는 것 같다. 오늘은 history api학습에 앞서 이것이 나오게 된 계기인 SPA (Sing Page Application)에 대해서 먼저 학습을 진행했다. 일반적인 정적인 웹페이지의 경우 HTML 파일들로 페이지가 구성된다 URL이 파일 경로와 이름이 된다. URL상 파일명이 없을 경우 index.html을 찾을려고한다. 하지만 웹 애플리케이션과 같은 하나의 페이지에서 여러개의 화면을 처리해야하는 상황이 많이 발생하면 SPA가 대두되기 시작했다.(facebook과 같은 사이트) ✅ SPA의 경우 서버는 API만 처리하고 모든 랜더링 과정을 클라이언트에서 하는 방식 클라이언트에서 html 파일은 index.html..

❗❗ 데브코스 15일차 (08.20) 저번시간에 비동기 학습에 이어서 오늘은 fech api를 활용한 수업을 진행했다. fech api로 데이터 정보를 받아와서 필요한 요구사항에 맞게 화면에 랜더링을 구현하였다. ✅ fetch api란 비동기 http 요청을 좀 더 쓰기 편하게 해주는 API XMLHTTPRequest을 대체합니다. Promise기반으로 동작합니다. fetch("http://~~~") .then(data => { return data.json() }) .then(list => { console.log(list); }) 대략적인 사용법은 위와 같은 방법으로 사용된다. Promise기반으로 사용되기 때문에 then을 이용하여 Promise를 처리해준다. 그리고 fetch의 기본 응답 결과는 ..

✍ 3주간 회고록 작성 타임 ✏️내가 하고자 했던 것 강의를 밀리지 않고 학습하고 이해하기 CS 공부 VanillaJS 이해하기 TIL, Article 작성하기 뒤쳐지지 않고 잘 따라가기 과제 제때 잘 수행하기 체력관리를 위해 운동 다시 시작하기 ✏️보완해야 할 점 시간관리를 잘못하여 해야할 일을 미뤘다.( TIL, Article 작성, 강의듣기 등) 앞으로는 시간관리나 선택과 집중을 정확히 기준을 세워 미루지 않도록 해야겠다. 생각보다 알고리즘, CS에 대한 지식이 부족하여 많은 학습이 필요하다는 것을 느꼈다. CS 스터디를 활용하여 몰랐던 지식을 학습하고 팀원들에게 공유하도록 해야겠다. 과제 수행시, 변수명에 대한 지적을 많이 받았다. 평소 마음대로 짓는 습관이 있었는데 앞으로 주의해서 작성해야겠다...

❗❗ 데브코스 14일차 (08.19) 오늘 스크럼때 팀원분들과 돌아가면서 질의응답 시간을 가졌다. 한 명이 응답자가 나머지 팀원들이 질문을 하면 그에 대한 대답을 해주면 된다. 굉장히 재밌었고, 시간 또한 금방 지나갔다. 팀원들과 더 친해진 것 같아서 좋았다. 이어서 오늘은 비동기에 대해 다뤄보았다. 어제 작성한 TodoList를 비동기 통신으로 데이터를 받아와서 뿌려주는 형식으로 발전시키면서 실습을 통해 학습할 수 있었다. callback, promise, asyns, await에 대한 개념을 대충 알고 있었지만, 정확히 어떨때 사용하는지 잘 몰랐다. 하지만 직접 실습을 통해 설명하면서 비교를 해주시니깐 온전히 깨달을 수 있었다. 비동기에 대해서는 중요하다고 생각하여 따로 정리할 예정이다. 📖 학습한 ..