정글 [week4] WIL + React(Vdom, diff)
정글 4주차 회고
정글 [week4] WIL + React(Vdom, diff
1. 이번 주 목표
이번 주 목표는 트리,이진 검색 트리, 그래프(vertex, edge, node, arc), BFS, DFS, 위상정렬 개념을 설명할 수 있을 정도로 이해하고, BFS와 DFS를 직접 코드로 구현할 수 있도록 익히는 것이었다.
또한 단순히 문제를 푸는 데서 끝나는 것이 아니라,
- 아이디어와 시간복잡도, 예외 케이스를 먼저 정리해보고 구현하기
- 함수의 역할을 주석으로 적고 TODO를 작성한 뒤 시작하기
- 변수명을 더 명확하게 짓고, 주석을 충분히 남기기
- 팀원들과 적극적으로 질문하고 공유학습에 참여하기
- 내가 모르는 것을 정확히 파악해 AI에게 질문하기를 이번 주 학습 태도의 목표로 삼았다.
추가로, 유튜브 강의를 보고 다른 사람에게 설명할 수 있을 정도로 개념을 정리하는 것도 목표였다.
2. 시도한 접근 방식
저번 주에는 문제를 보면 먼저 입력,출력, 그리고 어떤 흐름으로 풀 수 있을지를 VSCode에 짧게 적어본 뒤 문제를 풀려고 했다.
이번 주에는 그 방법만으로는 부족하다고 느꼈다. 특히 트리와 그래프, BFS/DFS 같은 개념은 머릿속으로만 이해하려고 하면 잘 잡히지 않았다. 그래서 직접 그림을 그리면서, 스택이나 큐에 값이 어떤 순로 들어가고 나오는지 흐름을 시각적으로 확인해 보았다. 그 과정을 통해 추상적인 개념을 코드와 연결하려고 노력했다.
또 구현을 시작하기 전에
- 이 함수가 어떤 역할을 하는 함수인지 간단히 적고
- TODO를 먼저 작성한 뒤
- 그 다음 코드를 채워 넣는 방식을 의식적으로 연습해 보았다.
3. 문제와 해결 과정
이번 주에는 지난주보다 더 어려운 트리와 그래프 관련 알고리즘 문제를 풀었다.
개념 자체는 어느 정도 이해했다고 생각했지만, 막상 그것을 코드로 옮기려고 하니 어떻게 구현해야 할지 막막한 순간이 많았다.
그래서 단순히 “이 알고리즘은 이런 것이다”로 넘어가지 않고,
이 개념이 실제 코드에서는 어떤 자료구조와 연결되는지를 많이 고민했다.
예를 들어 BFS는 “너비 우선 탐색”이라는 설명만 들으면 추상적으로 느껴질 수 있다. 하지만 실제 코드에서는 이것이 큐(Queue)와 연결되고,
- 먼저 들어간 노드가 먼저 나온다는 점
- 방문한 노드를 기록해야 중복 탐색이 생기지 않는다는 점
- 현재 노드에서 갈 수 있는 다음 노드들을 큐에 차례로 넣는 방식으로 구현된다는 것을 연결해서 이해하려고 했다.
DFS도 마찬가지였다. 깊이 우선 탐색이라는 개념을,
- 재귀 호출로 구현할 수도 있고
- 스택으로 직접 구현할 수도 있다는 점을 생각하며 “탐색 방식의 차이”가 코드에서 어떻게 드러나는지 보려고 했다.
즉, 이번 주에는 문제를 푸는 것보다도
개념과 코드가 어떻게 매칭되는지 이해하는 과정에 많은 시간을 썼다.
4. 새롭게 배운 점
이번 주에 가장 크게 배운 점은,
트리, 이진 검색 트리, 그래프, BFS, DFS, 위상정렬 같은 개념을 예전보다 훨씬 더 구체적으로 설명할 수 있게 되었다는 점이다.
아직 완벽하다고 말할 수는 없지만,
“이 개념을 코드로 어떻게 구현할 수 있어?”라는 질문을 받았을 때
이전보다 훨씬 더 자신 있게 흐름을 설명할 수 있을 것 같다.
또 하나 새롭게 인상 깊었던 점은 React에 대한 이해였다.
전에도 React를 사용해본 적은 있었지만, “어떻게 만들어지고 동작하는지”까지는 깊게 생각해보지 않았다. 이번 수요 코딩회를 통해 React도 결국 트리 구조로 생각할 수 있고, 탐색 과정과 재귀적인 구*를 바탕으로 동작한다는 점을 배웠다. 또한 diff 알고리즘을 통해 변경된 노드만 비교하고 반영한다는 점도 새롭게 알게 되었다.
이 경험을 통해 알고리즘 개념이 단순히 문제 풀이에서만 쓰이는 것이 아니라,
내가 익숙하게 사용하던 프론트엔드 기술과도 연결된다는 점이 흥미로웠다.
5. 아쉬웠던 점
아쉬웠던 점도 있었다.
Codex가 만들어준 가상 DOM 프로젝트의 코드를 완벽하게 이해하지 못한 점이 가장 아쉬웠다.
프로젝트를 먼저 만들고, 각자 그 코드를 분석하는 방식으로 진행했는데,
돌이켜보면 다 같이 코드를 한 줄씩 분석하고 토론하는 방식으로 진행했으면 더 좋았을 것 같다는 생각이 들었다.
단순히 결과물이 있는 것보다,
그 안의 구조와 흐름을 모두가 함께 해석해보는 과정이 있었다면
이해도가 더 높아졌을 것 같다.
6. 회고
이번 주는 실력 면에서 많이 성장했다고 느낀 주였다.
동시에, 공부하는 내 태도에 대해서도 많이 생각해보게 된 한 주였다.
예를 들어 “HTML에는 DOM이 있고, 그것이 어떤 구조로 이루어진다”는 말을 들으면 나는 종종 “아 그렇구나” 하고 넘어가는 편이었다. 그런데 다른 분들은 거기서 멈추지 않고
“왜 DOM으로 만드는 건데?”,
“왜 이런 구조를 쓰는 거지?”
같은 질문을 계속 던지면서 토론을 이어갔다.
그 토론을 보면서 나도 많이 배웠고,
동시에 나는 왜 그냥 수긍하고 넘어가는 편일까를 돌아보게 되었다.
이번 주는 단순히 개념을 배운 것뿐 아니라,
더 깊게 파고드는 질문의 중요성을 느끼게 된 주였다.
7. 다음 주 계획
다음 주에는 동적 계획법(Dynamic Programming, DP) 과 탐욕 알고리즘(Greedy Algorithm) 을 배우게 된다. 이번 주와 마찬가지로, 단순히 문제를 푸는 수준이 아니라
- 개념을 직접 설명할 수 있고
- 왜 그 알고리즘을 쓰는지 말할 수 있고
- 코드로 어떻게 구현되는지까지 설명할 수 있는 수준으로 이해하고 싶다.
또한 CSAPP 1장에 대해서도 개념을 정리하며,
알고리즘뿐 아니라 컴퓨터 시스템의 기초에 대해서도 이해를 넓혀가고 싶다.