본문 바로가기

개발자 일기/일일회고 (TIL)69

부트캠프 70일차 (컴퓨터 공학 기초) 오늘의 생각 매우 힘든 하루였다. 오늘도 개념 위주로 배웠는데, 이론과 개념의 양이 압도적으로 많았다. 아마 이제껏 하루에 배운 양 중 제일 많지 않을까...싶다. 그래서 모든 개념들을 온전히 이해하고 사용하기에는 무리가 있는 것 같다. 두고두고 복습을 통해 조금이라도 이해도를 높일 예정이다. 오늘의 키워드 하드웨어, 소프트웨어, 입력장치(Input), 출력장치(Output), 중앙처리장치(CPU), 저장장치(Memory), 주 기억 장치, 보조 기억 장치, 폰 노이만 구조, 산술/논리 연사 장치(ALU), 레지스터, 범용 레지스터 (General-Purpose Register), 전용 레지스터 (Dedicated-Purpose Register), IR, PC, AC, 제어장치 (Control Unit).. 2022. 12. 2.
부트캠프 69일차 (React Hooks 페어 과제) 오늘의 생각 지난 이틀 간 개념 위주로 학습했다면 오늘은 하루 종일 페어와 과제를 진행하는 하루였다. 따라서 기존 TIL과 다르게 새롭게 배운 것과 과제를 진행한 과정을 위주로 적어보겠다. 목표: json-server 설치 및 상세 컴포넌트 구현을 통한 리펙토링 주어진 과제는 블로그 형식의 글에 좋아요를 누르고 기록할 수 있어야 했다. 이를 위해 먼저 주어진 과제를 다음과 같은 순서로 진행했다. 동적 불러오기를 위한 React.lazy와 React.suspense를 사용해 컴포넌트 리펙토링 useParams를 활용한 개별 페이지의 id 가져오기를 통한 내용 해당 포스팅 출력 fetch와 useNavigate를 통해 게시물 등록 버튼 기능 구현 (내용 추가 시 홈으로 이동 / 해당 데이터 POST 메서드를.. 2022. 11. 29.
부트캠프 68일차 (React.lazy(), Suspense) 오늘의 생각 지난 금요일에 일어 오늘도 개념 위주의 학습을 진행했다. 리액트 번들링 과정에서 보다 효율적인 번들링과 성능을 위해 코드 분할법을 배웠는데, 생각보다 쉽지 않았다. 늘 그렇듯 개념 자체는 잘 이해가 됐지만, 막상 실습에 적용시킬 때는 어려움이 있었다. 최근 컨디션도 난조라 공부가 더 힘들었던 것 같다. 그래도 Custom Hook은 매우 흥미로웠고, 잘 활용해서 좋은 코드를 작성하고 싶다고 생각했다. 오늘의 키워드 코드 분할, Static Import, Dynamic Import, Reacy.lazy(), React.suspense, fallback 오늘의 학습내용 코드 분할의 핵심 아이디어와 장점 정적 불러오기 (Static Import)와 동적 불러오기(Dynamic Import)의 차이.. 2022. 11. 28.
부트캠프 67일차 (Virtual DOM, React Hooks) 오늘의 생각 React 심화 개념인 가상 돔DOM과 리액트 훅Hook에 대해 학습했다. 실습을 많이 하지 못해서 정확히 이해하고 있는지 모르겠지만, 매우 유용한 개념이라고 생각했다. 가상 돔과 리액트 훅 모두 최적화에 도움을 주는 개념이라 실제로 많이 사용되고 있다고 생각했다. 헷갈렸던 부분은 Real DOM과 Virtual DOM의 차이에 대해 이해하는 한편, 다른 접근 방식을 시각화하기가 어려워서 코드 구조적으로 차이점을 이해하는데 조금 어려움이 있었다. 비슷한 느낌으로 휴리스틱 알고리즘(Heuristic Algorithm)도 개념은 이해했지만, 기본 조작 알고리즘과 코드적으로 다른 점을 알기 어려웠다. 오늘의 키워드 가상 돔Virtual DOM, Real DOM, React Diffing Algor.. 2022. 11. 25.
부트캠프 66일차 (리액트 번들링) 오늘의 생각 오늘은 리액트를 통한 번들링을 진행했다. 전체적으로 어제 배웠던 것들을 복습하는 느낌이 컸고, 기존의 프로젝트를 페어와 함께, 리액트로 진행하는 차이점이 있었다. 오늘 페어 과정을 진행한 방식은 1. npx create-react-app {개인프로젝트명}로 기본 프로젝트 생성 2. src/index.js, src/App.js, src/index.css, public/index.html을 제외한 모든 파일들을 삭제 후 진행 3. 페이지 구현 (이에 따른 필요한 라이브러리 설치) 4. 웹팩 구성 및 빌드 확인 5. 웹팩 기능 추가하며 확인, 최종 마무리 이었다. 덕분에 어제 프로젝트에서 한 발 더 나아가 MiniCssExtractPlugin, BundleAnalyzerPlugin 등을 추가적으로.. 2022. 11. 24.
부트캠프 65일차 (번들링과 웹팩) 오늘의 생각 웹팩과 번들링에 대해 배웠는데, 꽤나 생소한 개념들이라 유익한 시간이었다. 익숙하지 않은 개념을 배울 때면 왜 써야하는가에 대한 근본적인 의문이 드는데, 이 부분도 쉽게 납득이 가는 부분이었다. 번들링 자체는 다소 생소했지만 기본적인 접근 방식(묶어서 패키지로 제공하느 행위) 자체가 익숙한 접근이기 때문에 잘 이해가 됐던 것 같다. 웹팩은 꽤 낯선 개념이었는데, 지금까지 어렴풋이 알고만 있었고 정확히 모르고 쓰고 있었어서 흥미로웠다. 웹팩의 구성은 실습을 통해서 익혀보았지만, 정확히 알고 쓰고 있다기엔 무리가 있는 것 같아 조금 자신이 없다. 관련해서는 자주 빌드해보고 연습해봐야할 것 같다고 생각했다. 코드 경량화(Minify)에 대해서 공부해본 적이 있기 때문에 전체적으로 순탄한 하루였고,.. 2022. 11. 23.