웹 관련 읽어볼 정보 _ 25년 1월 1, 2, 3주차

요즘 IT,  velog  등등 IT 정보는 넘치는데 흘려보내는 것들이 많아서 정리해두는 기록

 

✅  레고 인터페이스 패널로 알아보는 UX

단순한 레고의 디자인은 실생활(ex.조종기, 자동차 버튼)에서 차별화된 버튼의 역할을 담고 있음

입력의 차별화는 형태, 크기, 질감, 위치, 조작 코딩의 접근법이 있음, 입력의 조직화는 공통항목을 식별하는 게슈탈트 법칙*이 적용됨

=> 가장 좋은(선호하는) 인터페이스: 명확하게 차별화된 입력과 간단하고 깔끔한 조직화를 갖춘 시각적인 레이아웃

읽은 글 : https://velog.io/@typo/the-ux-of-lego-interface-panels

* 게슈탈트 법칙: 인간의 개별이 아닌 전체 패턴, 구조로 요소를 지각하고 구조화하는 방식을 설명하는 심리학 이론 

 

✅   디자인 시스템은 디자인이 아닙니다.

디자인 시스템이란 확장성 있는 디자인을 위해 불필요한 중복을 줄이는 공통된 언어체계(의사소통) -> 사용법, 문법, 코드까지 있는 문서로 작성되어야 함

구글 머티리얼 디자인 (https://m3.material.io/components/buttons/overview) 참고,

=> 디자인시스템은 디자인이 아닌 규칙과 요소를 조합한 시스템

읽은 글 :  https://yozm.wishket.com/magazine/detail/2914

 

✅   좋은 플랫폼, 나쁜 플랫폼, 이상한 플랫폼

플랫폼의 정의와 확장 => 기술적 도구, 비즈니스 모델, 산업 구조 등

https://yozm.wishket.com/magazine/detail/2916/

 

⛔   light-dark() 함수로 다크모드 쉽게 적용하세요. / 호환성 확인!

https://www.youtube.com/watch?v=IhrfGroePPk&list=PL_6yF2upGJYtjc4m7Ug3dVyJ6UQCVZoXz&index=23

 

⛔   @scope CSS선택자 범위지정의 끝판왕! 앞으로 코딩방식이 바뀔듯합니다.

https://www.youtube.com/watch?v=0c4YS-5ow38&list=PL_6yF2upGJYtjc4m7Ug3dVyJ6UQCVZoXz&index=24

 

⛔    z-index의 취약점을 보완한 CSS isolation!

https://www.youtube.com/watch?v=063kOMcpqRk&list=PL_6yF2upGJYtjc4m7Ug3dVyJ6UQCVZoXz&index=22

 

⛔   CSS aspect-ratio에 대해서

https://www.youtube.com/watch?v=igdxcevOf5U&list=PL_6yF2upGJYtjc4m7Ug3dVyJ6UQCVZoXz&index=25

 

⛔   2025년의 FE 개발자는 어떤 기술 스택을 선택해야 할까?

https://www.xionwcfm.com/posts/frontend/future-frontend

 

⛔  비동기/대기보다 스레드가 유리한 이유

https://yozm.wishket.com/magazine/detail/2918/

 

⛔  코드 다듬기: 개발자를 생각하게 하지 마세요.

https://substack.com/redirect/560754ef-2281-4791-990e-6c23d57ccdce?j=eyJ1IjoiM25oY28yIn0.YTanSQ9m_ZT8Dbm1X3Mvm_xE0qW1SpPDKoMhw2FdCmA

 

⛔  일잘러는 멀티태스킹이 아닌 ‘퀵 스위칭’합니다

https://yozm.wishket.com/magazine/detail/2926/?data=odDm7RbuUxCzgl9B5miqNfqueQ7vw6ap+QM+gzH1iZw=&source=daily_latest_news

 

⛔  알다가도 모를 API, 제대로 잡고 가기

https://yozm.wishket.com/magazine/detail/2925/?data=odDm7RbuUxCzgl9B5miqNfqueQ7vw6ap+QM+gzH1iZw=&source=daily_latest_news

 

⛔   “AI 전쟁의 새로운 국면” 구글 vs 오픈AI

https://yozm.wishket.com/magazine/detail/2924/?data=odDm7RbuUxCzgl9B5miqNfqueQ7vw6ap+QM+gzH1iZw=&source=daily_latest_news

 

⛔  프런트엔드 아키텍처 시각화하기

https://junghan92.medium.com/%EB%B2%88%EC%97%AD-%ED%94%84%EB%9F%B0%ED%8A%B8%EC%97%94%EB%93%9C-%EC%95%84%ED%82%A4%ED%85%8D%EC%B2%98-%EC%8B%9C%EA%B0%81%ED%99%94%ED%95%98%EA%B8%B0-3ae9a3dd8e67

 

✅  2025년 이커머스 쇼핑 경험은 어떻게 달라질까?

24년은 데이터와 생성형 AI -> 개인정보보호, 비용 증가로 ROI 분석 필요

25년은 다양하고 정교화된 분석이 요구될 듯

https://yozm.wishket.com/magazine/detail/2923/

 

✅  CEL만 알면 나도 쿠버네티스 보안 정책 전문가!

CEL (Common Expression Language) : 빠르고 이식가능하며 안전하게 실행하도록 설계된 완전 표현식 언어 

https://yozm.wishket.com/magazine/detail/2922/

 

✅  급한 불 끄느라 바쁜 조직에서 벗어나는 법

=> 고객 중심의 프로덕트 문화와 리더십의 부재, 미래를 위한 시간투자가 필요함

https://yozm.wishket.com/magazine/detail/2929

 

✅  실제 코드에서 리액트 컴파일러의 성능

리렌더링으로 성능문제 발생가능성 차단을 위해 연쇄적인 리렌더링 방지해야함

=> 리액트 컴파일러로 리렌더링을 캐치하여 성능을 향상시킬 수 있으나 모두 캐치할 수 는 없음, 결론은 선택사항임

https://emewjin.github.io/react-compiler-performs-on-real-code/?utm_source=substack&utm_medium=email

 

✅  깃허브 코파일럿, 1년 동안 써보고 느낀 점들

vscode 확장프로그램으로 이용, 단순반복작업, 복잡한 규칙의 정규식 작성, 공통 컴포넌트 작성에 유용

https://yozm.wishket.com/magazine/detail/2931/

 

⛔  시니어 개발자는 주니어 대신 AI를 선택할까?

https://yozm.wishket.com/magazine/detail/2932/

 

⛔   바퀴 대신 로켓 만들기 (1)

https://yozm.wishket.com/magazine/detail/2933/

 

 

➕  디자인 시스템 참고 사이트

https://www.beercss.com/

➕  cursor AI

https://www.cursor.com/

➕  Notion face

1y0b10n18m105h343a0

 

  ❗  white-space: pre-line;

  ❗   text-size-adjust: none;

  ❗   read-only 와 disabled 차이

  ❗    BiomeJs

 

---

✅ 읽기/요약 완료 상태  /  ⛔ 아직/미처 읽어보지 못한 상태  /  ➕ 유용한 사이트  /  📌 다시봐도 좋을 글  /  ❗   더 알아보기