이뇽의 인기 글
-
브라우저 동작원리를 알아야 하는 이유가 무엇인가요?
💡 해당 글은 React의 SSR인 Next.js 프레임워크에 의존하여 작성된 글입니다. 그러나 전체적인 맥락과 핵심 내용을 이해하시는 데는 큰 문제는 없습니다. 프론트엔드 주니어 개발자가 꼭 알아야 하는 기본지식 중 하나로 많이 소개되고 있는 '브라우저 동작 원리' 취업이나, 이직 준비를 해봤다면 무조건 들여다봤을 내용인 만큼, 브라우저가 어떻게 동작하는지에 대해서는 프론트엔드 개발자라면 이미 어느 정도는 알고 있을 것이라 생각한다. 그러나 개발자에게 필요한 기본 지식이라고 해서 어찌어찌 들여다보고 이해는 했는데... 도대체 이게 왜 필요한 걸까? 지금까지 이런 지식 없이도 개발은 잘만 해왔고, 왠지 앞으로도 굳이 필요 없을 것 같긴 한데.. 브라우저 동작원리에 대해 상세하게 다루는 블로그 글과 영상은..
-
Node.js가 왜 싱글 스레드로 불리는지 "정확한 이유"를 알고 계신가요?
Node.js가 왜 싱글스레드 환경으로 불리는 것일까? Javascript 언어가 싱글 스레드 기반 언어라서? 사실 이에 대해서는 단순 허무하면서도 마냥 재미있는 이유가 숨겨져 있다. 우선 내가 Node.js가 싱글스레드라는 것을 인정하기까지 꽤나 혼란과 고생이 있었고, 결과를 알고 난 뒤에도 인정하기 어려운 결론이라 찝찝하긴 하다. 그래서 그 과정을 이렇게 블로그로 한번 남겨보려고 한다. 나는 지금까지 Node.js가 멀티 스레드인 줄 알았다. 아마 모두 위 소제목을 보자마자 "풉!" 하고 웃었을 수도 있겠다는 생각이 든다. 왜냐하면 너무나도 기초적이고 면접 준비를 조금이라도 해봤을 것이라면 무조건 알 수밖에 없을 내용이고, 그만큼 굉장히 핵심적인 내용이기 때문에. 그런데 나도 처음부터 잘못 알고 있었..
-
GCP CloudBuild에서 Test CI 시간 단축시킨 과정 정리
GCP 프로젝트에서 Test CI 마다 항상 새롭게 디펜던시를 설치하고 빌드함으로써 많은 시간을 소요하는 것이 마음에 들지 않았다. 시간이 오래 걸리면 개발 생산성에도 영향을 미치지만, 무엇보다 CI로 소요된 시간만큼 비용 산정이 되므로 시간이 길어질수록 인프라 비용이 늘어나는 문제가 발생한다. 문제점 CI Test의 가장 큰 문제점은, CI가 돌 때마다 항상 아무것도 없는 상태에서 새롭게 시작한다는 것이다. 그런데 생각해 보면, 대부분 변경되는 사항은 비즈니스적 로직과 코드 단이지, 디펜던시 모듈이 자주 변경되지 않는다. 대부분 큰 차이가 없을 node_modules를 항상 새롭게 설치할 필요가 있을까?라는 생각이 들었다. 이미 이전에 생성했든 node_modules를 그대로 보유한 채 계속해서 다음 ..
-
팀워크를 위한 모노레포(Monorepo) 시스템 구축, 그리고 회고
꽤 오랜 시간 동안 모노레포 이전 및 안정화 작업을 계속 진행해왔다. 그래도 이제는 상대적 주요 프로젝트들은 모두 모노레포로 이전이 완료되었고, 팀원들이 이제 모두 모노레포 내에서 작업이 가능한 수준으로 안정화를 시키게 된 것 같다. 콴다 팀 블로그에도 해당 블로그 글을 쓰긴 했지만, 내 스스로도 좋은 경험 및 큰 성장 과정이 되었던 것 같아서 내 블로그에도 기록을 남겨보고 싶어 이렇게 한번 더 작성을 해본다. (비록 내용이 거의 중복이 되겠지만..) 우리 팀은 이번 모노레포를 통해 새로운 팀워크 방향성이 생기면서, 이를 통해 향상된 팀 협업 요소들을 정리해 보려고 한다. 우선 그전에, 우리가 어떤 계기로 인해 팀 전체가 모노레포 시스템을 이용하기로 결정하게 되었는지 배경을 먼저 소개하고 싶다. 모노레포..
-
[Yarn berry] pnp(Plug And Play), Zero Install을 위한 Dependency 문제 해결하기
이번에 프로젝트 빌드 환경을 개선시키기 위해 Zero install을 적용시키려고 한다. yarn berry 환경 세팅까지는 수월했으나, PnP(Plug In Play)을 통해 Zero install을 하려고 하니 Yarn에 대한 개념이 꽤나 필요했다. 그래서 이번에 Yarn Berry의 핵심 기능인 Plug In Play가 무엇인지 간단히 설명해보고, PnP를 통해 Zero Install을 하기 위해 우리가 해결해야 할 문제가 무엇인지 설명해 보려고 한다. Zero Install Zero Install은 말 그대로 설치를 하지 않고 이용하는 방식을 말한다. 기존에 node_modules에서 모든 디펜던시를 새로 인스톨하려고 하면, 모든 디펜던시 모듈이 인스톨에만 굉장히 많은 시간이 소모하게 된다. 그러..
-
데이터베이스 인덱스는 왜 'B-Tree'를 선택하였는가
데이터베이스의 탐색 성능을 좌우하는 인덱스. 인덱스는 데이터 저장, 수정, 삭제에 대한 성능을 희생시켜 탐색에 대한 성능을 대폭 상승하는 방식이라 볼 수 있다. DB의 인덱스는 B-tree 자료구조를 이용하여 테이블의 요소를 빠르게 탐색하도록 설계되어있다. 그러면 인덱스는 그 많은 자료구조 중에 왜 하필 'B-tree'를 사용하는 것일까? 참고로 해당 글에서는 데이터베이스의 인덱스가 무엇인지에 대해서는 다루지 않는다. 하지만 인덱스에 대해 잘 몰라도 이 글을 읽는 것에 큰 어려움이 없을 것이다. DB를 직접 다루는 개발자가 아니더라도 SW 성능에 관심이 많거나 자료구조, 알고리즘 공부를 하는 사람이라면 관심을 가지고 읽어볼 만한 글이 될 것 같다. 인덱스가 B-Tree를 이용하는 이유에 대해 알기 위해,..
이뇽의 최신 글
-
이뇽의 개발 인생 2부 종료 (2019 ~ 2024년)Life Log 2024.12.17 10:48
5년 전 코드스테이츠를 수료 후, 프론트엔드 신입이자 주니어 개발자로서의 새로운 삶을 시작했을 때가 아직도 생생한데 벌써 5년이라는 시간이 흘렀다.이뇽의 개발 인생 1부 종료 이뇽의 개발 인생 삶 1부 종료(2011~2019년, 현재 27살)지금 내가 여기까지 개발자의 길을 걷게 되고, 지금 이 만큼 오게 된 나 자신이 마냥 신기하게 느껴진다. 돌이켜보면 하나하나 운이 좋아서 여기까지 오게 된 느낌이 크다. 지금까지의 내 인생에helloinyong.tistory.com 5년 동안 나는 정말 많이 변했다. 변했다는 것은 개발 실력도 있겠지만, 성격이나 성향, 생각하는 방식과 관점 등 ‘정인용’이라는 사람에 대해 많은 것의 변화를 느끼게 되었다. 그만큼 정말 많은 것을 경험하고 활동하고 다양한 것을 느낄 ..
-
'환경'이란 요소가 우리에게 주는 영향Life Log 2024.11.08 00:54
AI시대에 살아가면서 너무 많이 정보통 속에서 내가 원하는 가치를 찾기 위해 열심히 살아가고 있다.그러다 문득, 이러한 동일한 세상에 살아가면서도, 이러한 AI 시대를 아직 받아들이기 못하고 본인의 삶의 변화를 느끼지 못하거나 영향을 받지 못하며 살아가는 사람들이 참 많을 수도 있겠다는 생각이 들었다.몇달 전, 오랜만에 만났던 내 고향 친구들은 딱히 지금의 AI시대에 비해 본인들에게 변화된 영향이 별로 없다는 말을 듣고, 나는 친구들과 다르게 어떻게 이러한 변화를 받을 수 있을까를 생각해 보게 되었다.어쩌면 나도 친구들처럼 작은 지방에서만 살아가고 있다던가, 혹은 이 IT업계라는 곳에서 활동하고 있지 않았다면 나도 지금의 큰 변화를 딱히 느끼지 못했을 수도 있었을 것이다. 하지만 개발자로써 IT업계에 종..
-
나약한 생각을 버리고, 어떻게하면 멋진 개발자가 될지를 고민하자Life Log 2024.10.11 22:40
최근 특정 프로젝트에 대해 굉장히 지친 상태가 될 만큼 QA가 길어진 프로젝트가 하나 있었다.기획은 아주 조그마했지만, 그 기획에 엉켜있던 지금까지의 많은 컨텍스트와 기술 부채들이 걸림돌이 되었던 것이다.분명 내가 했던 것들도 아닌데...과거의 개발자들과 기획자들이 지금 당장의 빠른 임팩트를 내어보기 위해 나중의 후폭풍은 생각하지 않고 우선 지금 당장의 문제를 해결할 수 있는 방식을 택하다보니 발생한 결과들이었다.어떻게든 닥친 문제를 해결할 수 있는 역량 자체도 어쩌면 좋은 것이지만, 장기간 해당 코드의 유지보수를 생각하는 부분이 정말 중요한 것 같다는 생각이 들어, 최근에 코어그룹 엔지니어들에게 "나중의 문제가 발생하지 않는 방식의 코드를 생각하는 관점을 가지자"는 얘기를 한 적도 있었다.그래서 그런지..
-
React Compiler 파헤치기React 개념 2024.07.24 02:20
우리는 리액트에서 렌더링 최적화를 위해, 변화되지 않는 부분들을 리렌더링 되지 않도록 useMemo, React.memo, useCallback Hook을 사용한다. 그러나 이러한 함수들을 사용할 때, 정확하게 필요한 곳에 적용하여 완전히 렌더링 최적화를 시킬 수 있다면 아주 좋겠지만, 사실상 Deep하게 이러한 위치를 찾는 것과 리렌더링 최적화 분석을 하는 것이 굉장히 까다롭고 시간이 들어간다.적절한 곳에 사용하지 못하면 해당 Hook에 대해 큰 이점을 챙길 수 없을 뿐더러 그렇다고 모든 곳에 메모제이션 처리를 해버리면, 그만큼 메모리에 저장되는 메모제이션 상태가 많아지기 때문에 성능에 악영향을 끼칠 수 있게 된다.그만큼 React 내에서 메모제이션 기능을 통한 렌더링 최적화를 적용하는게 마냥 쉽지 않..
-
함께 자라기를 다시 읽으며Life Log 2024.07.18 01:25
[팀 내에서 퍼포먼스를 잘 내는 사람]가장 성과를 잘 내는 사람은 자기의 포지션에서 능력이 굉장히 뛰어난 사람보다, 능력은 어느정도여도 사회성이 좋은 사람이다.사회성이 좋으면 내가 힘든 상황이 와도 언제든 도움을 받을 수 있다. 또한 내가 도움을 주면서 나 역시 한번 더 성장할 계기가 된다.또한 무엇보다 팀원들끼리의 신뢰와 안정감을 유지할 수 있음. [애자일, 삶의 애자일]내가 생각한 애자일은, 개발에서만 적용되는 방법론이 아닌, 우리 삶에 적용할 수 있는 철학이다.애자일을 통해 우리의 삶을 더 나은 방향을 이끌어 갈 수 있다.애자일은 빠른 액션에 그에 대한 피드백 수용이다.불확실성과 친밀해지기 위한 두가지 키워드: 학습과 협력[학습]목적지와 우리의 위치를 항상 정검하고, 정확한 방향으로 가고 있는지를 ..
-
현재 내가 놓여있는 상황을 돌이켜보고 생각을 정리Life Log 2024.06.16 18:52
최근에 약 3주 정도의 리프레시 기간을 통해 짧지만 많은 것을 공부하고 쉬고 보고 놀았다.그리고 다시 콴다 팀으로 돌아간지 어느덧 약 2주 정도 지났다.돌아가서 지금까지는, 기존의 CoreGroup에서 진행하던 테스크보단, 우리 콴다가 앞으로 AI 산업 안에서 교육 서비스로 살아남기 위해 새로운 모습으로 리뉴얼 중인데 이와 관련된 많은 준비에 몰두중이다.이와 관련하여 나 역시 새로운 지식을 습득해야할 것이 많아진 상태이다. React-native, 안드로이드 기반의 개발을 의한 학습을 하며 지금은 이미 어느정도 실무에 기여하고 있다.어떻게보면 지금 새로운 것들을 어느정도 마주하고 있고, 새로운 서비스에 대해서도 곧 마주하게 될 예정인데,지금의 내 상태는 생각보다 열정이 그렇게 크지않다. 심지어 큰 Les..
-
내가 가진 내적 가치에 대해Life Log 2024.06.16 17:19
리프레시 기간동안 여러 책을 읽었는데, 그 중 공간이 주는 가치에 대해 다루는 글을 읽게 되며, 문득 나에 대한 내적 가치에 대해서도 생각을 해보게 되었다.희소가치란, 그 시장에 있어서 수요보다 공급이 부족한 현상을 말한다.나 라는 사람에 대해서 내적 가치를 정리해보면,- 나는 개발자이다.- 웹, 앱 서비스 개발이 가능한 사람이며, 어느정도 컴퓨터 공학적인 지식을 가지고 있다.- 새로운 것을 배우고 학습하는 것을 즐겨하며 시간 보내는 것을 꺼려하지 않는다.위 정도로 될 수 있을 것 같고, 이를 잘 살리기 위해서는 나의 전문성을 잘 살리는 것이 중요하다.전문성을 살리기 위해서는, 특정 분야에서 이해도가 높고 경험을 통한 많은 인사이트를 가지고 있는 사람을 말한다.콴다 내에서는 내가 발산할 수 있는 가치가 ..
-
약 3주 간의 리프레시 시간을 가지게 되었다.Life Log 2024.05.21 00:35
현재 다니고 있는 회사에서 어느덧 3년 이상 근무를 하게되서 리프레시 휴가를 가지게 되었고, 24년 5월 15일 공휴일을 시작으로 6월 2일까지 약 3주 가까이 나의 시간을 가질 수 있는 기회가 생겼다.그리고 지금은 벌써 리프레시 휴가를 쓴지 5일차가 끝나간다.사실 이번에 리프레시 휴가를 올리고 나서, 꽤나 장기적인 나만의 시간을 가질 수 있는 이 흔치 않은 기회를 어떻게 써야할지 정말 많은 고민을 했다. 주위 사람들도 그렇고, 대부분 유럽여행을 떠나기 일쑤인데, 나 역시 평소라면 가기 힘든 곳이기 때문에 이번 기회에 유럽여행을 다녀와볼까 했다.그런데 또 한편으로는, 나는 지금 욕심내고 싶은 활동들이 너무 많았다.평소 회사 일로 너무 바빠 하지 못했던 주식과 부동산 공부라던가, 하루종일 영어 공부 몰두하..
-
[React Native] RN 공부하며 익힌 내용 정리핵인싸 개발자의 길 2024.05.15 00:03
무지성으로, RN에 대한 기본 개념 쌓아야 하는 내용들을 작성한 내용. ReactNative가 Native 코드로 변환 및 동작할 수 있는 원리 우선 ReactNative 코드가 Android, iOS 환경에서 돌아갈 수 있는 코드로 컴파일이 가능한 이유는, 각 네이티브의 구성 요소와 매핑이 되도록 정해져 있는 react-native에서 제공하는 CoreComponent를 사용하여 구현할 수 있기 때문이다., 등, react-native에서 정한 Core Component를 기반으로 구현하면, 빌드 타임에 이러한 요소들이 각 네이티브의 요소로 변환되면서 UI를 그릴 수 있게 된다.그러나 이렇게 native로 변환되는 부분은 UI 담당인 마크업 부분만 컴파일되서 변환되는 것이고, 돌아가는 내부로직 코드들이..
-
당신의 TreeShaking은 정말로 안녕하신가요?오늘의 TIL 2023.10.24 15:48
프로젝트를 진행하면서 어느 순간 번들 사이즈가 대폭 커지면서 의아함을 감출 수가 없었다. 지금까지 진행한 프로젝트에 비해 약 2배 가까이 되는 번들 사이즈를 보고 내가 어딘가를 놓쳤다는 의구심이 들 수 밖에 없었다. 번들 사이즈의 원인으로 의심되는 부분은 아래 4개였다. Dynamic Import를 놓쳤다. 사이즈 큰 모듈을 Lazy하게 가져오도록 하지 않았다. TreeShaking이 제대로 되지 않았다. Dynamic Import 문제였는지 체크 가장 상단의 컴포넌트를 주석 처리를 하고 빌드를 해보니 First Load Bundle Size가 약 10kb 정도 줄어들긴 했지만, 여전히 300kb나 되는 굉장히 큰 것을 보고 이것이 큰 원인은 아니라는 것을 깨달았다. 사이즈 큰 모듈 Lazy하게 가져오도..