일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- 개발공부
- 자바스크립트
- typescript
- GPU
- 항해99
- React
- 항해
- javascript
- 성장일지
- 백준
- FE
- 항해플러스
- 항해 플러스
- 개발 공부
- 분기 회고
- 알고리즘
- rust
- 프론트엔드
- wil
- 회고
- 테스트 코드
- frontend
- 보안
- naver
- 항해 플러스 프론트엔드
- 개발자
- webGPU
- 리뷰
- React Query
- 성능최적화
- Today
- Total
목록전체 글 (48)
느릿늘있
항해 플러스를 진행하면서 메모이제이션을 구현해보는 미션을 받았습니다. 객체를 비교함에 있어서도 얕은 복사(Shallow Copy), 깊은 복사(Deep Copy)와 마찬가지로 얕은 비교(Sallow Equals), 깊은 비교(Deep Equals)라는 용어를 사용한다는 것도 이번 과제을 진행하면서 처음 알게 되었는데요. 그런데 두 개념을 이해함에 있어서 깊이(Depth)라는 키워드가 약간 다르게 쓰이는 것 같아서 이번 기회에 깔끔하게 정리해보겠습니다. 보통 개발을 바닥부터 시작하게 되면 저처럼 얕은 복사와 깊은 복사에 대해서 먼저 접하게 되는데요. 제 기준으로는 비교에 대해서 먼저 짚고 넘어가는 게 이해하기가 더 수월하다고 생각이 듭니다! 그래서 비교에 대해서 먼저 정의를 해보겠습니다. 정말 간단한데요..
Q1. 과제 이번주 과제의 주제는 React Hooks 였습니다. 회사에서 class 기반으로 개발을 하다보니(Angular) hook을 쓸 일이 없었는데 이번에 확실하게 개념을 잡을 수 있었습니다. hook도 그 근본은 class이다보니 이해하는 데 큰 어려움은 없었습니다. 그래서인지 심화 과제도 hook 그 자체보다는 메모이제이션과 관심사 분리가 주된 내용이었습니다.Q2. 시도 가장 기억에 남는 시도는 useRef를 useState로 구현하는 부분이었습니다.Q3. 문제점 머리 속에 useRef는 리랜더링 되지 않는 값, useState는 리랜더링이 필요한 값이라고 주입식으로 외우다 보니 useRef를 useState를 써서 구현하라는 요구 사항이 처음에는 이해가 되지를 않았습니다. 그러나 잘 생..
Q1. 과제 이번주 과제는 Virtual DOM을 직접 구현해보는 것이었습니다. 전체적인 구조는 잡혀 있는 상태로 미션이 주어졌고 내부 구조를 구현하는 방식이었습니다. 처음에는 이번주에 휴일도 이틀이나 있으니 여유로운 마음으로 시작했는데 AI의 도움이 없었더라면 완성하지 못했을 것 같다는 생각이 들 정도로 구현해야 하는 양도 많고 생각할 거리들이 많았던 것 같습니다.Q2. 시도 Virtual DOM을 직접 구현해 볼 거라고는 생각해본 적도 없었기에 처음에는 감조차 잡히지 않았습니다. 요구 사항에 따라 하나씩 구현을 해 나가다 보니 점점 모습이 갖춰지는 게 재미있었던 것 같습니다.ㅎㅎ 특히 DOM Element를 vNode로 만들어서 비교하고 변경점들을 다시 DOM Element에 주입하는 작업이 어려..
Q1. 과제 이번주 과제는 SPA를 Vanilla JS로 구현하는 것이었다. 이번 주 과제를 진행하면서 마주한 문제들 중 가장 기억에 남는 두 가지를 뽑자면 구조 설계와 클릭 이벤트 처리였다.Q2. 시도 1. 구조 설계시작할 때, 프로젝트 구조를 main -> router -> 각 component 구조로 구성하면 되겠다라고 생각했고 각각의 역할을 아래와 같이 부여했다.1. main : 프로젝트 진입점, router에 현재 url path를 전달하여 컴포넌트를 실행함2. router : 전달받은 path를 기준으로 각 컴포넌트를 실행함3. component : 화면을 그림 2. 클릭 이벤트 처리버튼이면 버튼, a태그면 a태그를 querySelector로 잡아서 addEventListener clic..
협업을 하게되면 코드 리뷰에 대해 고민을 많이 하게된다. 특히 아무것도 모르는 주니어이기에 내가 뭘 리뷰할 수 있겠어라며 코드 리뷰를 포기하기도 한다. 하지만 대부분의 좋은 개발 조직에서는 코드 리뷰에 대해 고민하고 좋은 코드 리뷰를 해야한다고 강조한다. 하지만 한 번 반대로 생각해보자. 이직을 생각하고 있는 지원자의 입장에서 좋은 개발 조직으로의 이직을 원한다면 그 조직이 좋은 코드 리뷰를 하고 있는 지 물어볼 수 있어야 한다. 그리고 그 질문을 하려면 자기 자신이 생각하는 좋은 코드 리뷰에 대해서 명확하게 정의할 수 있어야 한다. 2년이 채 안되는 경력이지만 그간의 경험을 바탕으로 주니어 레벨인 현재의 내가 생각하는 좋은 코드 리뷰와 반대로 나쁜 코드 리뷰에 대한 기록을 남기고자 한다.나쁜 코드 리..
1. 지금까지의 회고 7월부터 지금까지 사전 스터디부터 네트워킹 파티 그리고 사전 OT까지 진행을 했다. 본 과정 시작 전 부족한 React와 Typescript 지식을 보강하기 위해 사전 스터디를 신청했고 예상대로 듬성듬성 구멍난 기초를 다듬는데 큰 도움이 되었다. 사전 스터디만 해도 이렇게 성장에 도움이 되었는데 본 과정은 더욱 더 기대가 된다. 또, 본 과정 시작 전부터 교육생들을 위해 적극적으로 소통해주시는 매니져분들과 네임드 코치진들을 보면 웅장이 가슴해진다. 극내향인으로서 동기들과의 네트워킹은 다소 부담되지만 이 또한 혼자 학습했다면 시도조차 해보지 않았을 것이다. 고생도 많이 하고 체력적으로 정신적으로 많이 힘들겠지만 그럼에도 불구하고 앞으로가 정말 기대되는 순간이다.2. 항해 플러스 참..