SOSOLOG - mysetting

12:53 5/31

so-so.dev

mobile screenshot relative

12:53

so-so.dev

mobile screenshot

SOSOLOG
https://so-so.dev/

Blog posted about ...

저작도구: GatsbyJS

최종 피드 수집: 2024-12-03 03:18

전체 (46)

7M

디자인 시스템, 코드를 넘어서

커리어에서 세 번째 디자인 시스템을 만들고 있다. 그중 한 번은 처음부터 만들었고 두 번은 기존 시스템 위에서 재개발했다. 이 세 번의 과정에서 중요한 것과 그렇지 않은 것을 알게 됐고 그 과정 속에서 겪은 여러 어려움을 글로 정

002

11M

Deploy 2023

12월 회고 시즌이다. 올 해는 개인적으로도, 일적으로도 수평적으로 넓어진 한 해였다.
기억에 남는 경험을 중심으로 회고를 작성했다.
새로운 팀, 새로운 디자인 시스템
올 해 3월 토스의 PC Design Platform Team

000

1y

렌더링 성능 개선(2) — 합성 애니메이션 사용

이번 글에서는 성능 개선의 관점에서 렌더링을 다시 살펴보려 한다. 렌더링 성능 최적화는 어떻게 접근해야 할까?
웹 성능 최적화는 가장 빠른 렌더링 패스를 구현하는 것이 아니다.
렌더링 과정은 전적으로 브라우저에서 진행되는 것으로,

000

1y

렌더링 성능 개선(1) — 렌더링 과정 이해하기

들어가며
최근 개인 프로젝트의 렌더링 성능을 개선하며 브라우저 렌더링 과정에 대해 정리하고 정확히 무엇이 성능 저하의 원인인지, 어떻게 개선될 수 있었는지 정리해봤다.
렌더링 파이프라인
렌더링 성능을 개선하려면 먼저 렌더링 과정과

003

1y

Deploy 2022

매년 회고 글에서 ‘올해는 특별했다.’라고 적는 것 같지만, 이번 해는 좀 더 그렇다. 일(work)과 커리어, 개인의 삶에서 크고 작은 변화가 있었다. 여러 가지 변화 중 기억에 남는 몇 가지 키워드들로 회고를 작성했다.
fle

000

2y

Design System Decision Record

이 글은 FEConf2022 디자인 시스템, 형태를 넘어서 발표에서 다루지 않은 linear라는 Design System에 대한 고민과 결정에 대한 글입니다.
Table of Contents
Principle
Problem fro

000

2y

Scoped Context

React Context API는 React 컴포넌트 트리 내의 전역적(global)인 데이터를 공유할 수 있는 방법이다. Provider가 선언된 컴포넌트 기준으로 하위 컴포넌트에서는 해당 Context의 값을 사용할 수 있다.

0030

2y

Select 컴포넌트

Intro
어떤 디자인 시스템에서 Select 컴포넌트를 제공한다면, 어떤 기능들을 기대하시나요?
이 글에서는 Select컴포넌트에게 바라는 기능을 중심으로 구현 방법과 예제 코드를 설명합니다.
⚠️ 이 글에서 소개되는 코드는 모

0010

2y

그 많던 import React from ‘react’는 어디로 갔을까

이 글에서는 React 17릴리즈에 포함되었던 JSX Transform의 RFC문서를 살펴보며 이 변경사항이 어떤 의미를 가지고 있는지 정리해 보았습니다.
중간중간 내용에 대한 첨언과 약간의 추측을 덧붙였습니다. 관련하여 피드백이

000

2y

Deploy 2021

작년에 썼던 이야기
올해를 돌아보니 작년 회고를 쓸 때 생각했던 방향과는 꽤 다른 방향으로 걸었다.
작년에 생각했던 큰 목표 중 하나는 Infra관련 공부였는데 올해 새로운 곳으로 이직하고 정신없이 보내다 보니 회고를 쓸 즘에야

2021_회고

1018

2y

Tree Shaking과 Module System

들어가며
어플리케이션은 개발자가 직접 작성한 코드, 외부 라이브러리 등 다양한 코드조각들로 이루어져 있습니다. 어플리케이션이 복잡해질수록 번들 사이즈에 신경을 쓰게 되는데요, 이때 필요한 코드만 남기기 위한 작업, 흔히 Tree

000

3y

immutable.wedding 개발후기

2021년 10월 23일 결혼을 앞두고 개인적으로 사용할 모바일 청첩장과 함께 immutable.wedding이라는 모바일 청첩장 템플릿을 만들었습니다. COVID-19상황이 악화되면서 결혼식은 취소했지만, 청첩장 개발 후기를 적

0010

3y

CSS-in-JS, 무엇이 다른가요?

Table of Contents
CSS in JS?
Critical CSS와 CSS-in-JS
Performance
Atomic CSS
마무리
References
CSS in JS?

https://css

000

3y

입력을 다루는 다양한 방법

웹 애플리케이션에서 복잡한 문제 중 하나는 사용자의 입력 데이터를 받아 처리하는 Form입니다. 이 글에서는 Form을 다루는 여러 방법과 대표적 form 라이브러리 중 하나인 react-hook-form에 대해 소개합니다.
간단

002

3y

이직.log('SoYoung')

이직 여정을 마무리하며 준비하고, 경험했던 것들에 대해 정리해보려고 합니다. 개인적으로는 약 두 달간의 여정을 되돌아보고자 하고, 이직을 고민하시거나 진행 중이신 분들에게는 하나의 경험 공유가 되었으면 하는 바람으로 글을 적어봅니

000

3y

Rollup.js 환경설정

이 글에서는 디자인 시스템 개발 환경을 구축하는 단계에서 rollup.js과 라이브러리 설정에 관한 내용을 정리하는 글입니다. 하지만 환경설정에 대한 튜토리얼은 아니기 때문에 필요한 모든 내용을 다루지는 않습니다.
이 글에서 구성

002

3y

Deploy 2020

어김없이 회고 시즌이 돌아왔다. 작년에도 ‘시간이 참 빠르게 지나갔구나’라고 생각한 것 같은데, 올해가 더 그런 것 같다.
되돌아보고, 기록하고, 언젠가 이맘때의 나를 다시 보기 위해 회고 글을 작성한다.
나의 2020년은 어땠을

000

3y

[서평] 파워풀 - 넷플릭스 성장의 비결

‘자율과 책임’이라는 단어가 조직문화에 어떤 영향을 주는지, 좋은 조직문화란 무엇이고 어떤 영향을 주는지에 대해 나만의 대답이 없었다. 이 두 가지 단어를 가장 중요하게 여긴다는 넷플릭스의 이야기가 궁금했고, 연휴 첫날 첫 장을

000

3y

비전공자 개발자도 다르지 않아요

⚠️ 이 글은 철저히 개인적 관점에서 작성했으며, 특정 단체나 개인을 타깃으로 하는 글이 아닙니다. 짧은 경험에서 적은 글이기 때문에 보시는 분에 따라 불편하신 부분이 있더라도 너른 양해 부탁드립니다.
들어가며
이 글은 개발을

000

4y

You don't know polyfill

Babel은 ES6+ 코드를 ES5로 변환하는 도구이다. 이 문장만 읽으면 Babel이 polyfill과 동일한 개념이라고 오해할 수 있지만, Babel이 곧 polyfill을 의미하는 것은 아니다. ES5에 존재하지 않는 ES

000