dev.daisy

이번 우아콘에서 이벤트 버스 패턴을 처음 접했을 때, “이렇게 간단한 구조로도 컴포넌트 간 통신이 가능하구나”라는 점이 가장 인상적이었습니다. 기존에는 상태 관리 도구를 통해서만 해결할 수 있다고 생각했던 부분들을 이벤트 버스를 통해 훨씬 가볍게 구현할 수 있다는 점이 새롭게 다가왔습니다. 특히 발행/구독(Pub-Sub) 모델의 단순함 속에서 느껴지는 구조적 유연함이 좋았지만, 반면 구독 해제를 잊거나 이벤트 이름을 잘못 관리하면 예기치 않은 버그로 이어질 수 있음을 주의해야겠다는 생각이 들었습니다. 학습을 통해 도구보다 패턴의 본질적 의도를 이해하는 것이 얼마나 중요한지를 배웠고, 앞으로는 상태 관리 라이브러리를 무조건 도입하기보다, 문제의 복잡도에 맞는 패턴을 선택하는 사고 방식을 더 의식적으로 가져..

운 좋게 표를 양도받아 참여할 수 있었는데, 현장에서 느낀 생생한 에너지와 강연자들의 깊이 있는 이야기가 정말 인상적이였습니다. 컨퍼런스를 올 때마다 생각하는거지만, 아직 모르는 개념이 많고 배워야 할 건 정말 끝도 없다는 것을 다시 한 번 느꼈습니다. 대단한 분들 사이에서 강연을 들을 수 있어서 좋았고 스스로 동기부여가 많이 되는 경험이였습니다 :) 이번에 좋은 기회로 우아콘 2025 표를 양도받아서 참여할 수 있었습니다! 굿즈는 흰색 우아콘 티셔츠를 받았고, 행사장은 파르나스몰 5층에서 진행되어 굉장히 넓고 쾌적했습니다! 배민 캐릭터로 수박게임하기, 네컷사진 찍고 sns에 업로드하기 등 참여할 수 있는 행사도 함께 진행되었습니다. 특히 강연히 끝난 뒤 20분동안 '연사와의 대화' 세션에서 연사자들과 ..

프론트엔드 개발을 하면서 가장 많이 듣는 단어 중 하나가 “디자인 패턴”이지만, 막상 설명하려고 하면 추상적인 개념처럼 느껴질 때가 많았습니다. 실제로 면접을 볼 때 디자인 패턴에 대한 질문을 자주 받았는데, 명확히 답하기 어려운 부분이 있어 정리해보게 되었습니다.디자인 패턴을 공부하면서 느낀 점은 단순히 이론을 외우는 것이 아니라 “코드를 더 잘 이해하기 위한 언어”를 배우는 과정이라는 것입니다. 처음엔 이름과 구조를 외우는 데 집중했지만, 점점 ‘왜 이런 구조가 필요했을까?’라는 질문을 던지면서 패턴의 본질을 이해해야겠다는 생각을 하게 되었습니다.앞으로 공부한 개념을 바탕으로 실제 프로젝트를 진행하면서 디자인 패턴을 적용하며 문제를 해결하기 위한 도구로 유연하게 선택할 수 있는 개발자가 되려고 합니다..

브라우저 렌더링 파이프라인을 공부하며 가장 크게 느낀 점은 '보이지 않는 비용'에 대해 인지하고 있어야겠다는 것입니다. 그저 코드를 작성하면 화면에 나타난다고 당연하게 생각했지만, 바이트가 DOM과 CSSOM으로 파싱되고, 결합하여 렌더 트리를 만드는 작업의 동작 과정을 알게 되었습니다. 자바스크립트의 async/defer 속성 하나가 파싱을 중단시키는지 여부를 결정하고, 무심코 쓴 offsetWidth 조회가 강제 동기식 레이아웃을 유발해 전체 파이프라인을 멈추게 할 수 있다는 사실도 놀랍게 느껴졌습니다. 이제는 코드 한 줄을 작성하더라도 이 코드가 렌더링 엔진을 얼마나 영향을 주는지, 어떻게 하면 레이아웃과 페인트를 건너뛰고 합성 단계만으로 효율적으로 처리할 수 있을지 고민하는 습관을 갖게 되었습니다..

Next.js를 사용해 첫 프로젝트를 진행하면서 가장 깊게 고민했던 부분 중 하나가 '어떤 페이지에 어떤 데이터 캐싱 전략을 적용해야 할까?'였습니다. 단순히 빠른 로딩 속도 뿐만 아니라 UX와 서버 리소스에도 직접적으로 연결되는 중요한 문제였기에 Request Memoization, Data Cache, Full Route Cache와 같은 Next.js의 핵심적인 캐싱 방법을 사용하기 위한 나만의 기준을 잡아야겠다는 생각이 들어 찾아보았습니다.이 글에서 주요 캐싱 전략의 개념, 사용 방법과 실제 프로젝트에서 적용한 예시를 함께 담아보았습니다. 공부한 내용을 기반으로 앞으로는 각 페이지의 특성과 데이터의 변화 주기에 맞춰 캐싱 전략을 설정하고, 앞으로도 사용자에게 더 빠르고 부드러운 UX를 제공하면서 ..

CORS와 SOP에 대해 공부해보면서, 단순히 '도메인이 다르면 브라우저가 API 요청을 막는다'라고 알고 있던 개념이 CSRF와 같은 공격을 방어하기 위해 만들어졌다는 점에서 브라우저의 보안 설계 원칙을 이해하게 되었습니다.또한 프론트엔드 입장에서 단순히 백엔드에 'CORS 문제가 발생했어요' 라고 요청하기보다는 왜 요청이 막히는지, 어떻게 동작하는지 설명하고 프록시 서버로 안전하게 우회하는 방법을 제시한다면 협업하기 좋은 개발자가 될 것 같다는 생각이 들었습니다. 브라우저와 서버의 통신 구조를 더 체계적으로 이해할 수 있었고, 앞으로는 보안과 설계를 함께 고려하는 프론트엔드 개발자가 되어야겠다고 느꼈습니다.프론트엔드 개발을 하다 보면 한 번쯤은 다음과 같은 에러를 보게 됩니다.Access to fet..

백트래킹을 처음 접했을 때는 단순히 모든 경우의 수를 탐색하는 깊이 우선 탐색(DFS)이라고 생각했지만, 학습을 통해 백트래킹의 진정한 힘은 '가지치기(Pruning)'에 있다는 것을 깨달았습니다. 하나의 패턴을 이해하고 나니 N-Queens나 스도쿠 같은 완전히 다른 문제들도 동일한 접근법으로 해결할 수 있다는 것을 알게 되어 응용할 수 있겠다는 자신감도 생겼고 앞으로는 어떤 조건을 '유망하다'고 판단하고 효율적으로 가지치기를 할 것인지 고민하는 것이 관건이 될 것 같습니다. 백트래킹 (Backtracking)백트래킹은 가능한 모든 경우의 수를 탐색하는 알고리즘입니다. 하지만 무작정 모든 경우의 수를 다 보는 부르트 포스(Brute Force)와는 달리, 조건에 맞지 않는 경로는 더 이상 탐색하지 않고..

기존의 UI 라이브러리를 사용하면서 추상화된 컴포넌트 뒤에 숨겨진 복잡한 로직과 스타일 제약으로 코드를 수정하기 어려웠기 때문에 약간의 걸림돌으로 느껴지곤 했습니다. 하지만 shadcn/ui를 공부하며 '컴포넌트의 소유권을 온전히 이전받는다'는 철학으로 더 이상 외부 라이브러리의 스타일에 갇히지 않고 직접 코드를 통제하며 번들 사이즈를 최적화할 수 있다는 것을 알게 되어 꼭 이 프로젝트에 사용해봐야겠다는 다짐을 하게 되었습니다.이는 단순히 화면을 구현하는 것을 넘어, 서비스의 확장성과 유지보수성을 고려한 설계의 관점에서 UI를 고민해보았는데, 이제는 기술의 편리함에 의존하기보다 그 기술이 왜 그렇게 만들어졌는지 본질을 탐구하며 신중한 선택을 하는 개발자로 성장하고 싶습니다.8. shadcn/uishadc..

Turbopack과 Webpack을 비교하며 번들러를 선정하는 과정을 통해서, 기술 도입은 단순히 빠르거나 새로운 것이라는 이유로 선정하는 것이 적절하지 않다는 것을 깨달았습니다. 실제로 Turbopack의 속도나 효율성은 큰 장점이지만 아직 실험 단계에 있다는 문제가 있는데, 실제 서비스를 운영하게 될 경우에는 예측 가능한 빌드 결과가 굉장히 중요한 요소이기 때문에 Webpack을 fallback 처리하여 안정성을 보완하였습니다. 따라서 앞으로도 각 환경의 목적에 맞는 도구를 잘 따져보고 선정하는 것이 진정한 기술적인 의사결정이라는 생각이 들었고, 앞으로도 새로운 기술을 검토할 때 단순한 성능 비교가 아니라 실질적인 운영 관점에서의 리스크와 이점을 함께 고민해보려고 합니다.7. Turbopack (de..

서비스 구조에서 REST API 통신이 많고, 안정적이며 확장성 있는 네트워크 처리가 필요했기 때문에 Axios를 선정하게 되었습니다. 특히 Axios 1.8.4를 도입하면서, 안정적이고 체계적인 API 통신 구조가 얼마나 개발 생산성과 유지보수에 큰 영향을 주는지 실감했습니다. 인터셉터와 공통 설정을 활용하니 반복적인 요청 처리와 에러 핸들링이 훨씬 간단해졌고, 코드 가독성도 크게 향상되었습니다. 이전에는 fetch로 개별 처리하던 로직이 Axios로 통합되면서 중복 코드가 줄고 일관성이 생긴 점이 특히 인상적이었습니다. 또한 Tanstack Query, Zustand와 함께 사용하며 상태 관리와 비동기 통신을 자연스럽게 연결한 경험으로 복잡한 서비스 구조에서도 안정성을 유지할 수 있다는 자신감을 얻게..