# 저번주 프론트엔드 볼거리
- `any` 지양하기를 지향하기
https://typescript-eslint.io/blog/avoiding-anys/
`any` 사용을 지양해야 할 때, 필요한 `typescript-eslint`속성들을 소개하는 글입니다. 물론 어쩔 수 없을 때만 `@typescript-eslint/no-explicit-any`을 사용하면 되겠지만, 히스토리 기록을 위해 코멘트를 장려하는 속성, 혹은 내장 글로벌 타입 지정을 구체적으로 하는 `ts-reset`( https://github.com/mattpocock/ts-reset ) 추천도 있습니다. 추가로 window에 삽입된 속성을 사용하기 위한 declare 사용법( https://www.totaltypescript.com/how-to-properly-type-window )도 알고 계시면 좋습니다
- 단축키를 구성할 때 유의할 점
https://blog.duvallj.pw/posts/2025-01-10-all-javascript-keyboard-shortcut-libraries-are-broken.html
단축키를 구성할 수 있는 라이브러리들 중 deprecated된 `keycode`, `which`, `keyIdentifier`를 사용하는 라이브러리가 많기에, 라이브러리 개발자나 크로스 브라우저 어플리케이션 개발자에게 권장되는 방법을 소개하는 글입니다.
- Next.js app router 리뷰
https://beeps.dev/blog/nextjs-an-honest-review
Next.js 14에 대한 주관적인 리뷰글입니다. 예전에도 App router에 대한 개인적인 리뷰( https://www.flightcontrol.dev/blog/nextjs-app-router-migration-the-good-bad-and-ugly ) 나 Server Components에 대한 리뷰( https://mayank.co/blog/react-server-components/ )가 있었는데, 글에서 담긴대로 Server Components관련 문제나 인식/접근 관련 문제가 모두 해결된 것 같지 않아 아쉽네요.
- JSDOM을 사용하지 않는 이유
https://www.epicweb.dev/why-i-won-t-use-jsdom
JSDOM이 무엇인지 소개하고, 왜 문제가 될 수 있는지, 대체할 수 있는 방법은 무엇이 있는지 소개하는 글입니다. 비슷하게 저자의 다른 글인 Global 패치가 위험한 이유( https://kettanaito.com/blog/why-patching-globals-is-harmful )도 비슷한 결을 띄지만 여러 위험한 점을 짚어주므로 읽어보시길 권장드립니다.
- 192바이트 WASM 컴파일러 분석하기
https://wasmgroundup.com/blog/wasm-compiler-in-a-tweet/
192바이트로 WASM을 실행하는 코드를 분석하면서 JS에서 보이는 최소화(Minification) 기법들과 WASM 바이트의 구성 방식을 알 수 있는 글입니다. WASM에 대한 전반적인 지식보다는, WASM 바이너리 형식이나 기술을 살짝 엿볼 수 있습니다.
- WebSocket 확장하기
https://composehq.com/blog/scaling-websockets-1-23-25
WebSocket 기반 어플리케이션을 만들 때 어려움을 겪은 부분들을 어떻게 해결했는지 간단하게 소개하는 글입니다. 여러 가지가 연결 끊김에 관한 것이여서, 연결 끊김을 어떻게 대비하나를 알아두기에 좋습니다.
- Electron에 대한 오해
https://felixrieseberg.com/things-people-get-wrong-about-electron/
Electron은 네이티브 어플리케이션을 만들기에 좋은 도구이지만, 모든 요구사항에 알맞는 도구는 아닙니다. Electron의 공식 문서에 있는 Electron을 선택해야 하는 이유( https://www.electronjs.org/docs/latest/why-electron )에 반대되는 네이티브를 선택해야 하는 이유를 소개합니다.
- JS 시간에 대한 역사
https://docs.timetime.in/blog/how-long-is-a-second-in-js/
시간 척도의 소개에서 시작해서, 그로부터 발생한 문제를 어떻게 해결했는지 알아보는 글입니다. 어플리케이션 개발에 중요한 개념은 아니지만, 흥미로운 글이네요.
- Tree view를 접근성 좋게 만들기
https://github.blog/engineering/user-experience/considerations-for-making-a-tree-view-component-accessible/
Github에서 Tree view 컴포넌트를 접근성 좋게 만들기 위해 어떤 사항을 고려했고, 어떻게 적용했는지 소개하는 글입니다.
- 반응형 디자인 배우기
https://web.dev/learn/design/welcome
예전에 나온 반응형 디자인에 대한 자료이지만, 많이 지나칠만한 다양한 모바일 환경의 숨겨진 요구사항, 잘 모르는 CSS 속성도 소개해주기 때문에, 반응형 디자인을 만들 때 지나쳤던 것들을 되새기기에 좋습니다.
- 새로운 친구들
https://standardschema.dev/
https://tailwindcss.com/blog/tailwindcss-v4
https://www.totaltypescript.com/erasable-syntax-only
https://github.com/facebook/create-react-app/issues/17004
https://developer.mozilla.org/en-US/blog/javascript-temporal-is-coming/
첫번째 글은 runtime validation 라이브러리의 표준인 Standard Schema를 소개하는 글입니다. 여러가지 유효성 검증 라이브러리를 빠르게 바꿀 수 있게 돕는 라이브러리입니다. 두 번째는 여러 CSS 지원과 빠른 성능의 엔진이 적용된 Tailwind 4버전을 소개하는 글입니다. 세 번째는 TypeScript 5.8버전(현재는 베타상태)에서 이전에 소개했던 ts-blank-space( )나 Node.js의 type stripping( https://satanacchio.hashnode.dev/everything-you-need-to-know-about-nodejs-type-stripping )을 typescript에서도 지원한다는 소식입니다. 네번째는 React 19가 되면서 CRA가 deprecated되었다는 소식을 접하지 못할 수도 있기에 CRA CLI나 문서에 deprecated되었다는 것을 알리자는 issue입니다. 마지막은 이전에 소개했던 Temporal API( https://docs.timetime.in/blog/js-dates-finally-fixed/ )가 개발중임을 알리는 글입니다.
더 오래된 볼 거리를 찾으신다면 https://ones-to-watch.ethansup.net/ 를 참조해주세요. :)
콘텐츠를 더 읽고 싶다면?
원티드에 가입해 주세요.
로그인 후 모든 글을 볼 수 있습니다.
로그인 후 모든 글을 볼 수 있습니다.
・댓글 1