Yongbeen Im

프론트 비스무리한 거 합니다

[David K 🎹 @DavidKPiano]

I have been screaming this for years 💯

[ElleMeDit @beingbook]

3년간 관찰해본 결과, React + TS 유지보수 비용 7할은 다음에서 발생한다.

1. useEffect로 로직 공유
2. 모든것을 메모이제이션
3. 명시적으로 검증해야 하는 에러 상태를 any로 관리
4. 파생상태로 표현 가능한 녀석을 useState
5. 서스펜스/에러바운더리 안쓰고 한무 null/불필요 맥락 전파

[유르마무 @jayjinjay]

🥊 프론트엔드 파이트 클럽 LIVE

Round 1: 뛰어난 문제 해결사 동료 vs 커뮤니케이션 친절한 동료
Round 2: CSS vs CSS-in-JS
Round 3: pnpm vs yarn

사내 파일럿 행사때... 실시간 댓글 760개를 기록하며 도파민 배애앰

9/27 라이브 참관 신청 링크 요기써요 https://t.co/SEJl46jFCb

[Yongbeen Im @been_dev]

dot notation 제발 그만..

[Seb ⚛️ ThisWeekInReact.com @sebastienlorber]

Using components like <Card.Body> ?

❌ Avoid this: code can't tree shake 😅
- Card.Body = function() {...}
- Object.assign(Card,{Body})

✅ Use ESM-named exports instead!
- export function Body() {}
- import {Body} from "./card"

Libs doing this well: Chakra, Radix

[Basix @Basix1120]

안녕하세요.
발표합니다.

https://t.co/BrF5pfu5tT

[토스 프론트엔드 @TossFrontend]

Using Bootstrap? Check out overlay-kit! 🚀

It integrates smoothly with Bootstrap modals, tooltips, and popovers. No more hassle with modal state management—overlay-kit takes care of it.
@getbootstrap #opensource #webdev

https://t.co/UNcPYBazRD

[Yongbeen Im @been_dev]

왜 사파리는 이 코드에서도 버그가 날 수 있는거지

[응... 시로코 내꺼 @if1live]

"브랜치를 왜 따는데요?" 가 핵심인데

Git이 대세가 되서 브랜치가 당연한것처럼 되엇지만 cvs, svn 시절에는 지금같은 위치가 아니었는데

브랜치를 따는 이유를 생각해볼때 작업물의 충돌이 사실상 없는 상황에서는 브랜치 꼭 써야하나?

[토스 프론트엔드 @TossFrontend]

💡React에서 오버레이를 다루는 선언적 방법, overlay-kit
모달, 토스트 같은 오버레이를 React로 다루는 건 생각보다 어려워요. 열리고 닫힌 상태를 새로 관리해야 하거든요.
토스에서 오버레이를 선언적으로 쉽게 다룰 수 있게 돕는 새 오픈소스 라이브러리를 공개합니다.
https://t.co/TZy2na9umh

[Biome @biomejs]

🚨 HUGE NEWS 🚨

We are ready to slowly rollout GraphQL support in Biome. You can use our playground to test it. Write any GraphQL sytanx, rename the file to .graphql/.gql and inspect the "Syntax" tab:

https://t.co/E2xuW31qi4

[🦋 hyeseong.kim @cometkim]

JSON이 느리다기 보단 타입정보 없는 ser/de는 대체로 느리다. JSON은 가장 빠른 구현체를 가진 포맷중 하나다.

실 사례에서의 데이터 압축은 대부분 gzip/br/zstd를 쓰는 json이 더 우수하다.

Protobuf는 검토할 수 있는 대안 중 최악이다.

바이너리 지원이 필요했다면 첨부터 JSON이 아니였을 것이므로 문제가 없다.

[Yongbeen Im @been_dev]

한글 리액트 문서가 필요하다면 아래 링크를 이용하면 됩니다

https://t.co/CjRdqXwZTa

[🦋 hyeseong.kim @cometkim]

@reactjs hey, someone forks official website and publish it to https://t.co/WkpAs8LSX2

It hijacks the authority of React brands and makes unfair profits with @AdSense

[🦋 hyeseong.kim @cometkim]

@reactjs hey, someone forks official website and publish it to https://t.co/WkpAs8LSX2

It hijacks the authority of React brands and makes unfair profits with @AdSense

[토스 프론트엔드 @TossFrontend]

📚 작고 빠른 유틸리티 라이브러리, es-toolkit
10살이 넘은 lodash, 더 개선할 지점은 없을까요? 토스에서 현대적인 구현의 es-toolkit을 공개했어요.
- 2~3배 빠른 런타임 성능을 제공해요.
- 최대 97% 작은 번들 사이즈를 가져요.
- 견고하고 정확한 타입을 내장해요.
https://t.co/RzAiFtxXjl

[토스 프론트엔드 @TossFrontend]

🌊 토스 Frontend Platform Engineer 공개채용 (~6/21)
토스와 한국, 전세계의 프론트엔드 개발자들이 일하는 개발환경을 함께 만들어 나갈 동료를 찾아요!
FE 개발환경을 번들러부터 클라우드까지 체계적으로 배우며, 최고의 UX와 DX를 제공하는 프레임워크를 만들어 나가요.
https://t.co/MFIkVoeQXk

[토스 프론트엔드 @TossFrontend]

🇰🇷 한글을 다루는 작은 라이브러리, es-hangul
토스에서 현대적인 방법으로 한글을 다루는 es-hangul 라이브러리를 오픈소스로 공개합니다.
초성 검색, 조사 붙이기와 같이 한글을 다룰 때 자주 개발하게 되는 내용을 컴팩트한 라이브러리에 담았어요. 📦
https://t.co/9nB3WFU0n1

[토스 프론트엔드 @TossFrontend]

🎨 토스커뮤니티 UX 전 직군 집중 채용 (~3/24)

🖍️ 프론트엔드 UX 엔지니어 : 최고의 사용자 경험을 만들기 위해 기술적 기반을 설계하고 구현해요. 웹 프론트엔드 기술에 대한 전문성을 바탕으로 혁신적인 디자인 시스템, 인터랙션, 생산성 도구를 만들어요.

🔗 https://t.co/XEcyPIcZSF

[Roy Derks 🚀 @gethackteam]

GraphQL is the future of APIs for web development, and you should start learning it now

[tldraw @tldraw]

state charts + wireframes + annotations