개발 로그

기술 기록

• 

  소스코드로 react hook 동작 원리 살펴보기 이 글은 react 19를 기반으로 쓰여졌습니다. 목차react hook은 어디서 구현되고 있을까?useState는 진짜 useReducer로 이루어져 있을까?훅 객체 생성하고 linked list로 연결하기circular queue를 이용해 상태 update하기느낀점 책을 읽던 중, useState는 useReducer로 구현되었다고 하기에 진짜인지 궁금해서 소스코드를 찾아보기 시작했다.react hook은 어디서 구현되고 있을까?react/packages/react/src/ReactHooks.js at main · facebook/react · GitHubReactHooks 파일 뜯어보기react hook이니 ReactHooks.js 파일에 있을 것이라 예상했고, 다음과 같은 코드를 찾을 수 있었다... 댓글 2 2025.06.15

• 

  Next.js의 fetch API로 캐싱된 데이터는 어디에 저장될까? 고민의 시작Next.js로 프로젝트를 하던 중, fetch를 사용할 것인지 axios를 사용할 것인지에 대한 고민이 있었다.fetch 함수를 사용하면 Next.js의 캐싱 기능을 활용할 수 있지만, axios의 interceptor 등 인증을 위한 편리한 기능을 사용할 수 없었다. 어차피 캐싱을 하려면 React Query나 SWR을 사용하면 되지 않나? 라는 생각을 했는데, React Query의 캐시는 클라이언트의 인메모리에 저장되기 때문에, SSR에 적합하지 않을 수 있다는 사실을 알게 됐다. (Next.js의 SSR을 활용하려면 서버에서 렌더링해야하는데, React Query는 데이터를 클라이언트에 저장하므로 SSR을 하기에 제약이 생길 것 같았다.) 그러던 중, fetch로 캐싱된 데이터는 정확.. 댓글 0 2025.04.29

• 

  Git으로 협업하기 회사에서 팀원들과 공유하기 위해 작성한 문서이다.  Git을 사용해서 코드를 관리하는 방법은 대체로 아래 순서를 따릅니다. 이슈 생성→브랜치 생성 및 브랜치 변경→작업→commit→push→PR→merge→pull 1. 이슈 생성하기Git Repository에서 Issues를 클릭하고 New issue를 클릭합니다 title과 description을 씁니다Assginees에는 보통 assign yourself를 클릭해서 자기 자신을 선택합니다본인이 맡은 이슈는 본인을 assgin하고 같이 하거나 다른 사람이 맡는 일은 다른 사람 assign 하면 됩니다.  Labels이나 Milestone은 저희 프로젝트에서는 따로 안썼는데 쓰고 싶으시면 도입하는 것도 좋을 것 같아요~  마크다운을 쓰시면 이렇게 편하게.. 댓글 0 2024.12.13

회고

• 

  2025년 상반기를 마무리하며... 벌써 6월이다. 2025년 상반기를 회고해보려 한다.회고라고 하긴 민망하고 그간 무엇을 했는지 + 생각 정리에 대한 글이다. 목차 1. 데브 캠프1-1. 어떤 개발자가 되고 싶은지2. IT 연합 동아리3. 공모전4. 취미 생활 24년 12월, 인턴을 끝내고 백수가 되었다.25년 1월~3월에는 스마일게이트 데브 캠프 면접 탈락자들을 대상으로 진행한 온라인 데브 캠프에 참여했다.이후에는 휴학을 하고, 지금은 사람들을 더 많이 만나고 프로젝트를 더 해보고 싶어 it 연합 동아리에 참여하며 프로젝트를 하고 있다. 1. 데브 캠프를 통해 참 많은 충격을 받았다. (좋은 의미이다) 정말 개발이 좋고 개발자를 하고 싶으면 이렇게 밍숭맹숭한 마음으로 임해서는 안되는구나.. 하는 생각이 들었다. 개발을 정말 좋아하고,.. 댓글 5 2025.06.08

• 

  6개월 간의 프론트엔드 현장실습 인턴 회고 React도 제대로 쓸 줄 모르던 내가 사수가 없는 곳에서 6개월 간 인턴을 했다. 왜 인턴을 했는가?여러가지 이유가 있다.프론트엔드 실무 경험을 해보고 싶어서좋아하는 일로 돈을 벌고 싶어서내가 회사 생활에 적성이 맞는 사람인지 알고 싶어서3학년 2학기까지 수료하고 다리 수술을 해서+조금 쉬면서 진로를 찾고 싶어서 휴학 신청을 했다. 퇴원하고 걷는게 좀 괜찮아졌을 때는 알고리즘이랑 리액트 공부도 하고, 다리를 절면서 학원에서 아르바이트를 했는데 알바를 하는게 너무 재미가 없어서… 내가 좋아하는 일로 돈을 벌고 싶었다. 그리고 리액트를 공부하다 보니 더 깊게 실무 경험을 하고 싶은 마음이 들었다. 그래서 그 때부터 자소서도 쓰고 리액트, 자바스크립트 공부도 더 열심히 하며 인턴을 준비하기 시작했다. 운이 .. 댓글 3 2024.12.17

최신 글

• 

  소스코드로 react hook 동작 원리 살펴보기 이 글은 react 19를 기반으로 쓰여졌습니다. 목차react hook은 어디서 구현되고 있을까?useState는 진짜 useReducer로 이루어져 있을까?훅 객체 생성하고 linked list로 연결하기circular queue를 이용해 상태 update하기느낀점 책을 읽던 중, useState는 useReducer로 구현되었다고 하기에 진짜인지 궁금해서 소스코드를 찾아보기 시작했다.react hook은 어디서 구현되고 있을까?react/packages/react/src/ReactHooks.js at main · facebook/react · GitHubReactHooks 파일 뜯어보기react hook이니 ReactHooks.js 파일에 있을 것이라 예상했고, 다음과 같은 코드를 찾을 수 있었다... 2025.06.15

• 

  2025년 상반기를 마무리하며... 벌써 6월이다. 2025년 상반기를 회고해보려 한다.회고라고 하긴 민망하고 그간 무엇을 했는지 + 생각 정리에 대한 글이다. 목차 1. 데브 캠프1-1. 어떤 개발자가 되고 싶은지2. IT 연합 동아리3. 공모전4. 취미 생활 24년 12월, 인턴을 끝내고 백수가 되었다.25년 1월~3월에는 스마일게이트 데브 캠프 면접 탈락자들을 대상으로 진행한 온라인 데브 캠프에 참여했다.이후에는 휴학을 하고, 지금은 사람들을 더 많이 만나고 프로젝트를 더 해보고 싶어 it 연합 동아리에 참여하며 프로젝트를 하고 있다. 1. 데브 캠프를 통해 참 많은 충격을 받았다. (좋은 의미이다) 정말 개발이 좋고 개발자를 하고 싶으면 이렇게 밍숭맹숭한 마음으로 임해서는 안되는구나.. 하는 생각이 들었다. 개발을 정말 좋아하고,.. 2025.06.08

• 

  변화하는 디지털 세상, 어떤 개발자가 될 것인가? - <랜덤 액세스 프로젝트 4.0>를 관람하며 진로 고민으로 심란해진 마음에 안정을 찾기 위해 백남준 아트센터에 방문했다. 관람한 전시는 랜덤 액세스 프로젝트 4.0>으로, 변화하는 디지털 세상을 주제로 미디어 아트 작품을 여럿 전시하고 있었다. 가장 인상 깊었던 작품은 얀투 작가의 진행 중인 설치>였다. 이 작품은 자동 운반 차량이 전시장을 돌아다니며 다양한 오브제를 선택, 운반, 전시, 철거하는 과정을 반복한다. 차량이 운반하는 오브제들 중에서는 예술 작품 뿐만 아니라 의자, 택배 박스 등도 포함되어 있다. 이 자동 운반 차량은 예술품과 예술품이 아닌 것을 구별하지 못한다. 이는 기계가 가치 판단에 있어 인간의 한계를 벗어났으나 동시에 인간의 한계를 넘지 못하는 모습을 보여준다. 나는 개발자를 꿈꾸고 있다. 어떤 개발자가 될 것인지, 어떤 데이터.. 2025.06.03

• 

  [리뷰] 멀티패러다임 프로그래밍 읽게 된 계기백엔드 개발도 하긴 하지만, 프론트엔드 개발을 주로 하다보니 함수형 프로그래밍에 익숙해져 객체지향 패러다임은 잘 활용하지 않았다. 자바스크립트에서 class를 이용해 객체지향적으로 개발을 할 수 있다는 사실을 알고 있음에도, 막상 프론트엔드 개발을 할 때는 잘 사용하지 않으니 그 필요성과 활용 방법에 대해 잘 알지 못했다. 그러던 중 멀티패러다임을 활용해 적재적소에 객체지향과 함수형을 활용하며 개발을 할 수는 없을까? 라는 생각이 들었고, 책을 읽게 되었다. 멀티패러다임이라는 것은 무엇이라고 딱 정의된 개념이 아니다.그러나 이 책은 우선 객체지향 패러다임의 반복자 패턴과 함수형 패러다임의 일급 함수(함수를 변수에 할당하고, 함수의 인자로 받을 수 있음)가 만나 map, filter, redu.. 2025.05.22

• 

  멀티패러다임 프로그래밍 책을 시작하며 한빛미디어 서평단에 선정되어 책을 받았다.자바스크립트를 공부하며 자바스크립트는 절차지향인지 객체지향인지 함수형인지 궁금한게 많았다. 자바스크립트는 객체지향과 함수형의 속성을 모두 가진 멀티패러다임 언어라는 것을 알게되고, 어느 경우에는 객체지향으로 코드를 짜고 어느 경우에는 함수형으로 코드를 짜는게 좋을지 고민을 하게 됐다.그러던 중 이 책을 통해 그 답을 얻을 수 있을 것 같아 서평단을 신청했는데, 감사하게도 선정이 되어 책을 선물받았다..타입스크립트로 프론트 개발도 하고 백엔드 개발도 해 본 입장에서 비교하며 책을 읽어보고싶다.연휴 동안 집을 비우느라 발송해주신 것에 비해 늦게 수령했다.얼른 읽어야지.. ^^ 2025.05.14

• 

  Next.js의 fetch API로 캐싱된 데이터는 어디에 저장될까? 고민의 시작Next.js로 프로젝트를 하던 중, fetch를 사용할 것인지 axios를 사용할 것인지에 대한 고민이 있었다.fetch 함수를 사용하면 Next.js의 캐싱 기능을 활용할 수 있지만, axios의 interceptor 등 인증을 위한 편리한 기능을 사용할 수 없었다. 어차피 캐싱을 하려면 React Query나 SWR을 사용하면 되지 않나? 라는 생각을 했는데, React Query의 캐시는 클라이언트의 인메모리에 저장되기 때문에, SSR에 적합하지 않을 수 있다는 사실을 알게 됐다. (Next.js의 SSR을 활용하려면 서버에서 렌더링해야하는데, React Query는 데이터를 클라이언트에 저장하므로 SSR을 하기에 제약이 생길 것 같았다.) 그러던 중, fetch로 캐싱된 데이터는 정확.. 2025.04.29

• 

  [리뷰] 제품을 성공시키는 프로덕트 매니저의 비밀 프로덕트 매니저란 뭘 하는 사람일까?이전까지는 기획자, PM이 따로 없이 개발자들끼리만 프로젝트를 진행하다 기획자, PM, 디자이너 등과 함께 프로젝트를 하게 되었다.그러다보니 PM이란 어떤 직무이고, 어떤 일을 하는지 궁금해졌다.그러던 중 길벗출판사에서 진행하는 길벗 24차 개발자 리뷰어 모집에 선정되어 이라는 책을 읽게 되었다. 프로덕트 매니징이란?프로젝트 혹은 프로덕트를 매니징 한다고 하는데, 프로덕트를 매니징하는 것이 정확히 어떤 것인지 알고 싶었다.책을 읽어보니 프로덕트 매니징이란 뭐 하나라고 정의하기가 힘들 정도로 다양한 일을 통 틀어 부른다는 것을 알게 되었다. 그럼에도 축약해서 말해보자면 고객의 문제를 해결하고 비즈니스 가치를 창출하기 위해 AtoZ로 프로덕트를 손보는 일을 프로덕트 매니징.. 2025.04.27

• 

  [리뷰] 그림으로 이해하는 시스템 설계 운이 좋게도 길벗 IT 리뷰어로 선정되어 책을 읽을 수 있는 기회가 생겼다. 최근 하는 프로젝트에서 시스템 설계를 할 일이 생겼는데, 시스템 설계란 무엇인지. 어떻게 해야하는지 감이 오지 않았었다. 그러나 이 책을 읽으니 희미하게나마 시스템 설계란 어떤 것이며, 설계는 어떻게 하고 설계서는 어떻게 쓰고 설계서 관리는 어떻게 해야하는지 알 수 있었다. 주요 내용1장 시스템 설계가 차지하는 위치2장 시스템 설계란?3장 시스템 설계에 영향을 주는 개념4장 전체 설계5장 입출력 설계6장 데이터베이스 설계7장 로직 설계8장 네트워크 설계9장 서버 설계10장 설계서 활용  전체적으로 시스템 설계 과정에 대해서 훑는다. 그러면서도, 요즘 많이 사용되는 MSA 구조를 사용할 때, 온프레미스 사내 서버가 아닌 클라우드를.. 2025.02.04

• 

  [그림과 실습으로 배우는 도커 & 쿠버네티스] Ch7 - 도커 컴포즈를 익히자 도커 컴포즈란?도커 명령어를 정의 파일(Compose file)에 기술해 실행하는 도구시스템 구축과 관련된 명령어를 하나의 파일에 기재해, 명령어 한번으로 시스템 전체를 실행→종료→폐기까지 가능하게 함up 커맨드: docker up과 비슷. 이미지 내려받고 컨테이너 생성 및 실행, 네트워크와 볼륨도 가능down 커맨드: 컨테이너와 네트워크를 정지 및 삭제. 볼륨과 이미지는 삭제 x도커 컴포즈와 Dockerfile의 차이도커 컴포즈: docker run 명령어를 여러 개 모아둔 것으로, 컨테이너, 네트워크, 볼륨 생성 가능Docker file: 이미지 생성만 가능도커 컴포즈와 쿠버네티스의 차이도커 컴포즈: 컨테이너 생성, 삭제만 가능 (관리 불가)쿠버네티스: 여러 개의 컨테이너 관리 도커 컴포즈의 설치와 .. 2025.01.08

• 

  [그림과 실습으로 배우는 도커 & 쿠버네티스] Ch6 - 실전에 활용 가능한 컨테이너 사용법을 익히자 컨테이너와 호스트 간에 파일 복사하기파일 복사파일 복사는 컨테이너→호스트, 호스트→컨테이너로 양방향 모두 가능하다.docker cp 원본_경로 복사할_경로 호스트→컨테이너docker cp 호스트_경로 컨테이너_이름:컨테이너_경로 컨테이너→호스트docker cp 컨테이너_이름:컨테이너_경로 호스트_경로 윈도우에서 호스트 경로는 C:\Users\사용자명\Documents\파일명 등으로 작성한다.index.html 파일 만들기 안녕하세요? 도커 공부용 html입니다. 호스트의 파일을 컨테이너 속으로 복사항목값컨테이너 이름apa000ex19이미지 이름httpd포트 설정8089:80 윈도우 원본 경로 (제 바탕화면 경로입니다..)C:/Users/whdms/Desktop/project/docker_p.. 2025.01.07