본문 바로가기

분류 전체보기564

디자인을 잘하는 사람은 OOO을 잘한다? 글쓰기 = 디자인 목적과 타겟설정이 가장 첫 스텝 메시지 = 경험 어떤 이야기 흐름으로 전달할지 고민 목차 구성 = 구조 구성 정보구조에 살 붙여나가기 적합한 단어와 문장 구성 = 적합한 행동 UI 설계 정리하고 덜어내기 중복을 줄이고 파편화된 정보 한 곳으로 모으기 핵심을 해치지 않게 불필요하게 꾸며주는 정보들을 덜어내기 검수하고 피드백받기 공유하고 의견받기 참고 - 요즘 IT 2024. 3. 11.
React 19: Everything you need to know in one place The React Compiler: Converts React code into regular JavaScript, potentially doubling performance. Actions: Simplify handling data and interactions within web pages. Server Components: Render on the server for faster page loads and better SEO. Asset Loading: Background loading of assets for smoother page transitions. Document Metadata: Easy SEO enhancements with the component. Web Components: Im.. 2024. 3. 11.
Vue의 신기한 점 (feat. 동적 컴포넌트, 텔레포트) [Vue 살펴보면서 신기한점] - 동적 컴포넌트(Vue 2 이상)와 텔레포트(Vue 3 이상) 예시 1) 탭에 여러 버튼이 있고 각 버튼은 서로 다른 컴포넌트를 보여줌 selectedTab 데이터와 v-if를 이용해서 처리가능하지만 v-if 반복 성가심 → component 태그 이용 component 태그의 is 속성 컴포넌트 바꿀 때 이전 컴포넌트는 DOM에서 제거됨 → keep-alive 래퍼 컴포넌트 이용하여 컴포넌트를 완전히 제거하지 않고 상태를 내부에서 캐시로 저장하도록 Vue에 알려줌 예시 2) dialog 태그와 open 속성을 이용해서 만든 커스텀 오버레이 - 모달 → HTML Semantic/접근성 관점에서 모달 컴포넌트를 컴포넌트의 depth 깊이 위치시키는 것은 좋지 않음 전체 페이.. 2024. 3. 11.
최근 FE의 생태계의 움직임 (feat. Next/React, Tailwind) 테일윈드 기반 UI 컴포넌트 라이브러리 - Tailframes 위 라이브러리가 있는 것을 보고 생각이 든 점이 요즘 CSS-in-JS 즉 Styled-components나 emotion 같은 CSS는 지양되고 있습니다. 런타임 시 실행되고, 번들 사이즈 증가 등 오버헤드 관련 문제가 있는데 아무래도 FE 생태계를 꽉 잡고 있는 Next.js가 테일윈드를 권장하고 있기 때문입니다. 공식문서 예제를 보더라도 테일윈드로 되어 있고 아무래도 SSR과 서버 컴포넌트 사용 관점에서 스타일을 적용하기 힘들다는 점이 제일 크죠. 그래서 테일윈드 기반으로 편리하게 많이 사용되고 있는 것 같습니다. 물론 vanilla extract css와 같이 Zero-runtime 방식이 있긴 한데 아직은 Next에서 클라이언트 컴포.. 2024. 3. 11.
반응형