프론트엔드, 디자인 시스템, 웹에 대해 기록하는 이소영의 블로그https://so-so.dev/kohttps://so-so.dev/ko/react/design-system-beyond-code/https://so-so.dev/ko/react/design-system-beyond-code/커리어에서 세 번째 디자인 시스템을 만들고 있다. 그중 한 번은 처음부터 만들었고 두 번은 기존 시스템 위에서 재개발했다. 이 세 번의 과정에서 중요한 것과 그렇지 않은 것을 알게 됐고 그 과정 속에서 겪은 여러 어려움을 글로 정리했다. 만들기 전에 목표 중요한 것은 퀄리티 대원칙 만들기 만드는 중에 대원칙 수호하기 코드는 기본이다 정의가 전부다 하나만 선…Sun, 07 Apr 2024 16:00:09 GMTreacthttps://so-so.dev/ko/essay/retro2023/https://so-so.dev/ko/essay/retro2023/12월 회고 시즌이다. 올 해는 개인적으로도, 일적으로도 수평적으로 넓어진 한 해였다. 기억에 남는 경험을 중심으로 회고를 작성했다. 새로운 팀, 새로운 디자인 시스템 올 해 3월 토스의 PC Design Platform Team에 합류했다. ‘토스에 PC제품이 있어?’라고 생각할 수 있지만 토스 커뮤니티(계열사)에는 대고객 제품부터 어드민까지 PC제품이 …Sun, 31 Dec 2023 11:59:59 GMTessayhttps://so-so.dev/ko/web/browser-rendering-performance/https://so-so.dev/ko/web/browser-rendering-performance/이번 글에서는 성능 개선의 관점에서 렌더링을 다시 살펴보려 한다. 렌더링 성능 최적화는 어떻게 접근해야 할까? 웹 성능 최적화는 가장 빠른 렌더링 패스를 구현하는 것이 아니다. 렌더링 과정은 전적으로 브라우저에서 진행되는 것으로, 렌더링 과정 자체를 개선할 수는 없다. 따라서, 성능 ‘개선’의 접근 방식은 렌더링 과정 자체의 개선이 아니라 과정 중 병목이 …Wed, 08 Feb 2023 08:00:09 GMTwebhttps://so-so.dev/ko/web/browser-rendering-process/https://so-so.dev/ko/web/browser-rendering-process/들어가며 최근 개인 프로젝트의 렌더링 성능을 개선하며 브라우저 렌더링 과정에 대해 정리하고 정확히 무엇이 성능 저하의 원인인지, 어떻게 개선될 수 있었는지 정리해봤다. 렌더링 파이프라인 렌더링 성능을 개선하려면 먼저 렌더링 과정과 이에 관여하는 요소를 대해 알아야 한다. 이 글에서 다룰 내용은 Blink엔진 기준이며, RenderingNG 글과 2020년 …Sun, 05 Feb 2023 08:00:09 GMTwebhttps://so-so.dev/ko/essay/retro2022/https://so-so.dev/ko/essay/retro2022/매년 회고 글에서 ‘올해는 특별했다.’라고 적는 것 같지만, 이번 해는 좀 더 그렇다. 일(work)과 커리어, 개인의 삶에서 크고 작은 변화가 있었다. 여러 가지 변화 중 기억에 남는 몇 가지 키워드들로 회고를 작성했다. flex 2.0과 협업에 대한 고민 현재 flex 제품은 팀에 합류했던 시점과 다르다. 2021년 8월부터 ‘2.0 프로젝트’라는 이름…Wed, 25 Jan 2023 12:59:59 GMTessayhttps://so-so.dev/ko/react/design-system-decision-record/https://so-so.dev/ko/react/design-system-decision-record/이 글은 FEConf2022 디자인 시스템, 형태를 넘어서 발표에서 다루지 않은 linear라는 Design System에 대한 고민과 결정에 대한 글입니다. Table of Contents Principle Problem from Principle Interface Compound Component Headless 예시 1. Trigger 예시 2. 다양…Sat, 05 Nov 2022 16:00:09 GMTreacthttps://so-so.dev/ko/react/scoped-context/https://so-so.dev/ko/react/scoped-context/React Context API는 React 컴포넌트 트리 내의 전역적(global)인 데이터를 공유할 수 있는 방법이다. Provider가 선언된 컴포넌트 기준으로 하위 컴포넌트에서는 해당 Context의 값을 사용할 수 있다. Provider 하위컴포넌트에서 Context를 사용할 수 있다는 것은, “Consumer는 가장 가까운 Provider기준으로…Mon, 06 Jun 2022 16:00:09 GMTreacthttps://so-so.dev/ko/react/make-select/https://so-so.dev/ko/react/make-select/Intro 어떤 디자인 시스템에서 Select 컴포넌트를 제공한다면, 어떤 기능들을 기대하시나요? 이 글에서는 Select컴포넌트에게 바라는 기능을 중심으로 구현 방법과 예제 코드를 설명합니다. ⚠️ 이 글에서 소개되는 코드는 모두 수도코드(pseudo code)입니다. 동작여부보다는 소개하고자하는 맥락을 중심으로 작성되었습니다. Table of Conte…Sat, 23 Apr 2022 16:00:09 GMTreacthttps://so-so.dev/ko/react/import-react-from-react/https://so-so.dev/ko/react/import-react-from-react/이 글에서는 React 17릴리즈에 포함되었던 JSX Transform의 RFC문서를 살펴보며 이 변경사항이 어떤 의미를 가지고 있는지 정리해 보았습니다. 중간중간 내용에 대한 첨언과 약간의 추측을 덧붙였습니다. 관련하여 피드백이 있으시다면 댓글로 남겨 주시면 감사하겠습니다. 발단 React17은 2020년 10월 20일에 릴리즈되었다. 이 글이 릴리즈 이…Sun, 20 Feb 2022 17:00:09 GMTreacthttps://so-so.dev/ko/essay/retro2021/https://so-so.dev/ko/essay/retro2021/작년에 썼던 이야기 올해를 돌아보니 작년 회고를 쓸 때 생각했던 방향과는 꽤 다른 방향으로 걸었다. 작년에 생각했던 큰 목표 중 하나는 Infra관련 공부였는데 올해 새로운 곳으로 이직하고 정신없이 보내다 보니 회고를 쓸 즘에야 이 단어를 다시 떠올리는 걸 보면 여러 가지 우선순위 뒤쪽에서 오래 방치해뒀다는 뜻이겠다. 새로운 곳은 당연히 시스템이 다르고, …Fri, 31 Dec 2021 23:59:59 GMTessayhttps://so-so.dev/ko/web/tree-shaking-module-system/https://so-so.dev/ko/web/tree-shaking-module-system/들어가며 어플리케이션은 개발자가 직접 작성한 코드, 외부 라이브러리 등 다양한 코드조각들로 이루어져 있습니다. 어플리케이션이 복잡해질수록 번들 사이즈에 신경을 쓰게 되는데요, 이때 필요한 코드만 남기기 위한 작업, 흔히 Tree Shaking이라고 불리는 과정이 수반되어야 합니다. 이 글에서는 Tree Shaking에 대한 기본 개념과 Tree Shakin…Sun, 12 Dec 2021 08:00:09 GMTwebhttps://so-so.dev/ko/essay/immutable-wedding-epilogue/https://so-so.dev/ko/essay/immutable-wedding-epilogue/2021년 10월 23일 결혼을 앞두고 개인적으로 사용할 모바일 청첩장과 함께 immutable.wedding이라는 모바일 청첩장 템플릿을 만들었습니다. COVID-19상황이 악화되면서 결혼식은 취소했지만, 청첩장 개발 후기를 적으며 아쉬운 마음을 달래봅니다. 🔗 GitHub Repository 🐝 나의 immutable.wedding 진행방식 같이 사…Sat, 09 Oct 2021 17:01:21 GMTessayhttps://so-so.dev/ko/web/css-in-js-whats-the-defference/https://so-so.dev/ko/web/css-in-js-whats-the-defference/Table of Contents CSS in JS? Critical CSS와 CSS-in-JS Performance Atomic CSS 마무리 References CSS in JS? https://css-tricks.com/a-thorough-analysis-of-css-in-js CSS-in-JS는 단어 그대로 JavaScript코드에서 CSS를 작성하는…Sat, 31 Jul 2021 16:00:09 GMTwebhttps://so-so.dev/ko/react/form-handling/https://so-so.dev/ko/react/form-handling/웹 애플리케이션에서 복잡한 문제 중 하나는 사용자의 입력 데이터를 받아 처리하는 Form입니다. 이 글에서는 Form을 다루는 여러 방법과 대표적 form 라이브러리 중 하나인 react-hook-form에 대해 소개합니다. 간단한 Form Form에서 떠올릴 수 있는 단순한 예시는 Email과 Password를 받는 Login Form이다. 이 경우 각 …Sun, 21 Mar 2021 16:00:09 GMTreacthttps://so-so.dev/ko/essay/2021-turnover/https://so-so.dev/ko/essay/2021-turnover/이직 여정을 마무리하며 준비하고, 경험했던 것들에 대해 정리해보려고 합니다. 개인적으로는 약 두 달간의 여정을 되돌아보고자 하고, 이직을 고민하시거나 진행 중이신 분들에게는 하나의 경험 공유가 되었으면 하는 바람으로 글을 적어봅니다. 왜 이직을 하는가? 이직 여정을 시작하기에 앞서, 이 질문에 답을 찾는 것은 매우 중요하다. 이 질문에 대한 답은 옮기게 될…Wed, 27 Jan 2021 17:01:21 GMTessayhttps://so-so.dev/ko/tool/rollup/rollupjs-config/https://so-so.dev/ko/tool/rollup/rollupjs-config/이 글에서는 디자인 시스템 개발 환경을 구축하는 단계에서 rollup.js과 라이브러리 설정에 관한 내용을 정리하는 글입니다. 하지만 환경설정에 대한 튜토리얼은 아니기 때문에 필요한 모든 내용을 다루지는 않습니다. 이 글에서 구성한 환경 구축 내용만 보고 싶으시다면 @soyoung/design-system-config 에서 보실 수 있습니다. Table O…Sun, 17 Jan 2021 16:00:09 GMTtoolhttps://so-so.dev/ko/essay/retro2020/https://so-so.dev/ko/essay/retro2020/어김없이 회고 시즌이 돌아왔다. 작년에도 '시간이 참 빠르게 지나갔구나'라고 생각한 것 같은데, 올해가 더 그런 것 같다. 되돌아보고, 기록하고, 언젠가 이맘때의 나를 다시 보기 위해 회고 글을 작성한다. 나의 2020년은 어땠을까? 아는 것보다 모르는 것이 많아졌다. Banksalad Product Language(이하 BPL, 설명: Banksalad에…Wed, 30 Dec 2020 17:13:16 GMTessayhttps://so-so.dev/ko/essay/the-secret-to-netflix-growth/https://so-so.dev/ko/essay/the-secret-to-netflix-growth/'자율과 책임'이라는 단어가 조직문화에 어떤 영향을 주는지, 좋은 조직문화란 무엇이고 어떤 영향을 주는지에 대해 나만의 대답이 없었다. 이 두 가지 단어를 가장 중요하게 여긴다는 넷플릭스의 이야기가 궁금했고, 연휴 첫날 첫 장을 펴서 단숨에 다 읽었다. 책을 덮는 순간 나의 첫 반응은 '대단하다'였다. 넷플릭스의 더 깊은 고민과 시행착오들이 궁금해졌지만, …Fri, 25 Dec 2020 20:11:22 GMTessayhttps://so-so.dev/ko/essay/non-major-developers-are-no-different/https://so-so.dev/ko/essay/non-major-developers-are-no-different/⚠️ 이 글은 철저히 개인적 관점에서 작성했으며, 특정 단체나 개인을 타깃으로 하는 글이 아닙니다. 짧은 경험에서 적은 글이기 때문에 보시는 분에 따라 불편하신 부분이 있더라도 너른 양해 부탁드립니다. 들어가며 이 글은 개발을 시작할 때 '비전공자여서' 가질 수 있을 막연한 두려움이나 오해에 관한 개인적 생각을 적은 글이다. 본문에서 언급하게 될 CS지식은…Sat, 12 Dec 2020 20:12:32 GMTessayhttps://so-so.dev/ko/web/you-dont-know-polyfill/https://so-so.dev/ko/web/you-dont-know-polyfill/Babel은 ES6+ 코드를 ES5로 변환하는 도구이다. 이 문장만 읽으면 Babel이 polyfill과 동일한 개념이라고 오해할 수 있지만, Babel이 곧 polyfill을 의미하는 것은 아니다. ES5에 존재하지 않는 ES6의 메서드나 생성자는 지원하지 않기 때문이다. 예를 들어 Promise, Object.assign, Array.from 등은 ES…Wed, 11 Nov 2020 08:00:09 GMTwebhttps://so-so.dev/ko/tool/webpack/whats-different-in-webpack5/https://so-so.dev/ko/tool/webpack/whats-different-in-webpack5/이 글은 webpack5 Release 글을 정리한 글이며, 원글의 몇 가지 내용은 포함되지 않았습니다. 모든 변경사항을 알고 싶으신 분은 원글의 내용을 참고해주세요. v4에서 v5 migration에 대한 가이드는 이 글에 정리되어 있습니다. Breaking Changes의 의미 webpack 내부 아키텍처를 업데이트하고 향후 추가될 기능을 위한 기반을 …Sat, 07 Nov 2020 00:00:09 GMTwebpackhttps://so-so.dev/ko/tool/webpack/node-modules-splitting/https://so-so.dev/ko/tool/webpack/node-modules-splitting/web application을 만들 때 여러 기능을 빠르고 쉽게 지원하기 위해 여러 library를 사용합니다. 이 library를 어떻게 build하는지에 따라 초기 페이지 로딩 속도가 크게 좌우될 수 있습니다. 이 글에서는 webpack의 splitChunk 옵션을 수정하여 node module을 여러 개의 bundle file로 나눌 수 있는 방법에 …Sun, 30 Aug 2020 16:00:09 GMTwebpackhttps://so-so.dev/ko/essay/add-new-tool-at-team/https://so-so.dev/ko/essay/add-new-tool-at-team/개발 생태계는 빠르게 변화하고 있고, 10년 이상 '트렌드'로 자리 잡던 도구와 방식이 한순간에 레거시가 되기도 한다. 개발자는 늘 새로운 것에 끌리기 마련이고 회사에서 새 프로젝트를 기존과 다른 방식으로 진행해보고 싶다는 생각은 누구나 한 번쯤 가져봤을 것이다. 새로운 것에 대한 도입은 팀원들과 협의가 필요하고, 이 과정이 순조롭게 진행될 수도 있고 긴 …Sun, 09 Aug 2020 00:12:32 GMTessayhttps://so-so.dev/ko/pattern/mono-repo-config/https://so-so.dev/ko/pattern/mono-repo-config/들어가기 전에 이 글은 Lerna를 사용한 Monorepo에서 package 환경 구축 방법을 소개하는 글입니다. 들어가기에 앞서 Monorepo의 장점에 대해 간단히 소개하면, 프로젝트마다 반복되는 설정을 공유할 수 있고 모듈화된 패키지를 서로 참조할 수 있습니다. Monorepo로 구성되어 있는 대표적인 프로젝트인 babel패키지 중 babel-exte…Sun, 21 Jun 2020 00:04:01 GMTpatternhttps://so-so.dev/ko/web/service-worker/https://so-so.dev/ko/web/service-worker/ServiceWorker는 웹 서비스에서도 백그라운드 동기화, 푸시 알림 등이 가능하도록 지원해주는 도구입니다. 이 글에서는 서비스워커에 대한 소개와 간단하게 CRA기반에서 어떻게 cache설정을 적용하는지 살펴봅니다. 서비스워커란? 서비스워커는 브라우저가 백그라운드에서 실행하는 스크립트로, 웹페이지와는 별개로 작동하며 웹페이지 또는 사용자의 인터랙션이 필…Mon, 01 Jun 2020 08:00:09 GMTwebhttps://so-so.dev/ko/web/tailwindcss-w-twin-macro-emotion/https://so-so.dev/ko/web/tailwindcss-w-twin-macro-emotion/TailwindCSS는 utility-first CSS 프레임워크입니다. 이 글에서는 utility-first CSS에 대한 개념과 TailwindCSS를 어떻게 사용할 수 있는지 소개합니다. 평소 TailwindCSS에 관심이 있으셨거나 도입을 고려하고 계시다면 한번쯤 읽어보시면 좋을 것 같습니다. utility-first CSS utility-first…Sun, 10 May 2020 08:00:09 GMTwebhttps://so-so.dev/ko/essay/no-silver-bullet/https://so-so.dev/ko/essay/no-silver-bullet/Image by: https://dribble.com 첫 회사에 입사하기 전부터 '같이 성장할 수 있는 회사'를 찾고 싶었고, 내 목표는 개발자로서 '멈추지 않고 성장하는 것'이다. 작년에 이 주제로 많이 고민했었고 그 내용을 발표에서 공유하기도 했었다. 지금 다시 생각해본 성장에 '은탄환'은 없고 매번 많은 고민을 통해 이뤄진다고 생각한다. 그 내용을 짧…Mon, 13 Apr 2020 08:00:09 GMTessayhttps://so-so.dev/ko/web/cookie-recipes/https://so-so.dev/ko/web/cookie-recipes/Image by: https://www.freepik.com/ 작년에 발표된 Chrome SameSite 정책과 웹 사이트의 인증 기능을 구현하는 과정에서 '쿠키'에 대해 한 번쯤 들어 보셨을 것입니다. 이 포스팅에서는 쿠키가 무엇이고, 어떤 종류가 있는지, 쿠키의 특성과 연관된 브라우저 정책들을 살펴봅니다. 쿠키 쿠키란 웹사이트의 정보를 브라우저 쪽에 저…Sun, 12 Apr 2020 08:00:09 GMTwebhttps://so-so.dev/ko/web/about-navigator/https://so-so.dev/ko/web/about-navigator/프런트엔드 개발에서 navigator 객체에 대한 사용을 빼놓을 수 없습니다. 이 포스팅에서는 navigator객체의 여러 가지 속성들에 대해 살펴봅니다. navigator 객체는 대표적인 User Agent뿐만 아니라 사용자의 상태에 관한 여러가지 정보를 담고 있습니다. navigator의 속성들은 읽기 전용으로 접근할 수 있습니다. react-adapt…Fri, 27 Mar 2020 08:00:09 GMTwebhttps://so-so.dev/ko/pattern/saga-pattern-with-redux-saga/https://so-so.dev/ko/pattern/saga-pattern-with-redux-saga/redux 비동기 처리를 위해 redux-saga를 사용해보신 적이 있으신가요? "The mental model is that a saga is like a separate thread in your application that's solely responsible for side effects. redux-saga is a redux middleware…Sun, 01 Mar 2020 17:04:01 GMTpatternhttps://so-so.dev/ko/web/index-html-2/https://so-so.dev/ko/web/index-html-2/Part 1에서는 link tag와 script tag에 대해 알아보았습니다. 이번 편에서는 OpenGraph(이하 og), favicon, charset, lang에 대해 알아봅니다. OpenGraph Protocol OpenGraph Protocol(이하 og)이란, Facebook에서 정의한 HTML문서의 메타 데이터 정보를 적는 방식에 대한 규약입니…Sat, 22 Feb 2020 16:00:09 GMTwebhttps://so-so.dev/ko/web/index-html-1/https://so-so.dev/ko/web/index-html-1/React, Vue, Angular 같은 Library 혹은 Framework로 개발할 경우 빌드 결과물인 index.html은 자동으로 생성되기 때문에 직접 볼 필요가 없을 수도 있습니다. 하지만, 최종 html의 구성 요소를 잘 파악하고 있다면 성능 개선이나 디버깅하는 상황에서 용이하게 활용할 수 있습니다. Parts 1편: link, script ta…Thu, 13 Feb 2020 16:00:09 GMTwebhttps://so-so.dev/ko/essay/2020-my-good-code/https://so-so.dev/ko/essay/2020-my-good-code/작년 발표에서 '지식이 많다고 해서 반드시 좋은 코드를 쓸 수 있는 것은 아니다.'라고 했다. 물론 아는 것이 많아지면 좋은 코드를 작성할 확률이 높아질 수는 있다. 하지만, '좋은 코드'라는 단어는 지식 말고도 고려해야 할 점이 많은 단어이다. 이 글은 내가 생각해본 좋은 코드에 대해 소개하는 글이다. '좋다'라는 문장에서 알 수 있듯, 주관적 생각일 뿐…Sat, 25 Jan 2020 17:01:21 GMTessayhttps://so-so.dev/ko/k8s/k8s-simply-visually-explained/https://so-so.dev/ko/k8s/k8s-simply-visually-explained/이 글은 원작자의 허락을 받고 원문을 번역한 글입니다. Parts Part 1: this article Part 2: Kubernetes Ingress simply visually explained TL;DR ClusterIP의 근간이 되는 4개의 서비스가 있습니다. NodePort서비스를 생성하면 ClusterIP도 생성된다고 상상해봅시다. 그리고, Lo…Thu, 02 Jan 2020 18:12:43 GMTk8shttps://so-so.dev/ko/essay/retro2019/https://so-so.dev/ko/essay/retro2019/진정한 연말이다. 그리고 올해도 많은 분들의 회고글이 올라오고 있다. 곧 회고글을 쓴다고 하니, 이런 말을 들었다. "회고하면 반성만 하게 되고, 내년의 계획은 부담이 되는것 같아서 안쓰게 되더라구요. 동감한다. 나의 회고글은 '반성'이 아닌 '되돌아봄', '기록'을 목적으로 작성한다. 나의 2019년은 어땠을까? 모험이자 도전이었던 인턴기간에서 좋은 결과…Mon, 30 Dec 2019 17:13:16 GMTessayhttps://so-so.dev/ko/essay/2019%EC%9D%98-%EB%B0%9C%ED%91%9C%EB%93%A4-%ED%9A%8C%EA%B3%A0/https://so-so.dev/ko/essay/2019%EC%9D%98-%EB%B0%9C%ED%91%9C%EB%93%A4-%ED%9A%8C%EA%B3%A0/올해 총 5번의 발표를 했습니다. 처음 인턴으로 개발자를 시작했던 경험부터, 주니어 개발자로의 성장에 대한 이야기까지, 어떤 내용을 전달하였는지 돌아봅니다. 인턴상륙작전 https://speakerdeck.com/soyoung210/inteonsangryugjagjeon GDG Korea WebTech Lightning Talk에서 발표한 내용입니다. 처음…Mon, 16 Dec 2019 20:12:32 GMTessayhttps://so-so.dev/ko/react/ssr-4-ux-ssr/https://so-so.dev/ko/react/ssr-4-ux-ssr/SSR을 이용해서 두 가지 상황을 구현해보았습니다. 두 번째 글이 첫 번째보다 조금 어려웠다고 생각되는데요, 과연 어려운만큼 좋은 UX를 구현한것일까요? 제 대답은 그렇지 않다. 입니다. 사용자 관점 Server에서 Data Fetch SSR - Data Fetch의 방법으로 요청했을 때 어떤 일이 벌어지는지 그림으로 살펴봅시다. 사용자의 요청이 expre…Fri, 13 Dec 2019 22:13:14 GMTreacthttps://so-so.dev/ko/react/ssr-3-ssr-data-fetch/https://so-so.dev/ko/react/ssr-3-ssr-data-fetch/이 튜토리얼에 대한 전체 코드는 여기에서 보실 수 있습니다. 프로젝트를 만들면서 해결한 버그는 이 곳에 정리되어 있습니다. ✈️ SSR 라벨의 이슈를 참고해주세요. 다룰 내용 이번 포스트에서 할 일은 다음과 같습니다. Client에서 필요한 비즈니스 로직을 명시합니다. Server에서 1번에 정의된 동작을 수행합니다. 2번의 결과를 client에 전달해줍니…Sat, 07 Dec 2019 14:13:37 GMTreacthttps://so-so.dev/ko/react/ssr-2-ssr---basic/https://so-so.dev/ko/react/ssr-2-ssr---basic/이 튜토리얼에 대한 전체 코드는 여기에서 보실 수 있습니다. 프로젝트를 만들면서 해결한 버그는 이 곳에 정리되어 있습니다. ✈️ SSR 라벨의 이슈를 참고해주세요. 본 글에서는 CSR과 SSR의 차이나 기본 원리에 대해서 자세히 다루지 않습니다. 혹시 이에 대해 더 알고싶으시다면 아래의 참고글을 확인해주세요. 들어가기에 앞서 아래 빨간 네모 박스 영역인 /…Mon, 25 Nov 2019 00:05:07 GMTreacthttps://so-so.dev/ko/essay/simple-software/https://so-so.dev/ko/essay/simple-software/길벗 리뷰어로 선정되어 심플 소프트웨어 책을 받아보았다. 책 소개대로, 코드는 단 한줄도 등장하지 않는다. 저자의 경험에서 나오는 많은 생각들과 경험이 녹아있는 책이다. 나의 과거와 현재, 그리고 나의 미래를 상상하며 노트북 없이 밑줄을 그어가며 읽은 책이다. 좋았던 부분이 너무 많아 어떻게 서평을 써내려갈지 정말 많이 고민했다. 결국 각 Part별로 좋았…Tue, 19 Nov 2019 20:11:22 GMTessayhttps://so-so.dev/ko/react/ssr-1-codesplitting/https://so-so.dev/ko/react/ssr-1-codesplitting/⚠️ 이 내용은 master 브랜치에서 이어지는 내용입니다. master브랜치의 내용은 따로 설명을 적지 않습니다. 혹시 궁금하신 점이 있으시다면 댓글로 남겨주세요! Code Splitting은 기본적으로 React에서 지원하고 있습니다. 하지만 기본적으로 제공하는 lazy는 SSR을 지원하고 있지 않다고 하니, 과감히 포기하고 다른 도구를 찾아봅니다. �…Sun, 17 Nov 2019 18:00:46 GMTreacthttps://so-so.dev/ko/react/ssr-0-intro/https://so-so.dev/ko/react/ssr-0-intro/이 튜토리얼은 React에 ServerSideRendering, 그리고 Code Splitting을 적용하는 과정을 소개합니다. 모든 코드는 GitHub 에 있으니 각 단계별 branch에서 코드를 살펴보세요! React에 SSR을 도입한다면, Next.js도 좋은 선택일 수 있습니다. 하지만, 이 글은 프레임워크가 아닌 순수하게 React에 CodeSpl…Sun, 17 Nov 2019 16:00:09 GMTreacthttps://so-so.dev/ko/essay/what-i-learn150-1/https://so-so.dev/ko/essay/what-i-learn150-1/2018년 7월 17일 React 온라인 강의를 시작으로 FrontEnd에 첫 발을 떼고, 2018년 12월 26일 인턴 입사 후 150일 간의 기록을 정리했습니다. 지금은 회사에서 Web팀원으로 함께 일하고 있으며 그간의 여정을 회고하고 FrontEnd 개발자로 한걸음 더 나아가려 합니다. 1부 - Communication & Thinking 협업에는 스…Fri, 24 May 2019 00:08:03 GMTessayhttps://so-so.dev/ko/etc/googling/https://so-so.dev/ko/etc/googling/결국 정보를 찾는다는 것은 검색이다. 한번의 검색으로 silver bullet 같은 아티클을 읽어 문제를 해결할 수 있다면 얼마나 좋을까... 어떻게 해야 잘 검색할까? 이 문제에 앞서 선행되어야 하는 부분이 있다. 무엇을 모르는가? 검색은 모르는 것 을 해결하기 위해 이루어 진다. 어떻게 내가 무엇을 모르고 무엇을 알고 있는 지 정확히 파악할 수 있을까?…Tue, 23 Apr 2019 00:07:47 GMTetchttps://so-so.dev/ko/etc/official-docs/https://so-so.dev/ko/etc/official-docs/주의 : 공식문서를 읽지 않았다는 Blame 취지가 아닌, 생각보다 공식문서에 많은것이 담겨있다 라는 취지의 글입니다. (이소영이 생각하는 공식문서에 대해 이야기합니다.) Why ? 공식문서 를 잘 읽어보자 라는 말은 어쩌면 교과서 적이라고 할 수도 있다. 적당히 구글링하면 stackoverflow가 친절한 해결책을 알려주는데..! 하지만, 우선 잘 정리된…Mon, 04 Mar 2019 00:07:08 GMTetchttps://so-so.dev/ko/essay/retro2018/https://so-so.dev/ko/essay/retro2018/2018년이 마무리 되었으니, 이제 배포 를 위한 글을 작성한다. '회고' 라고 쓸까하다가 개발자적인 위트 끌어모아서 Deploy .. 2018 회고에 앞서 2017년 회고글을 다시 보았다. 역시 2017년 보다 2018년이 다사다난 했고, 개발자로 어찌저찌 첫 발을 떼면서 2018년을마무리 하게 되었다. 2018년도에 있었던 일들을 Header만 정리해보…Mon, 31 Dec 2018 00:07:57 GMTessay