팀 소개 섹션 개발

[Hecklebot]

변경 사항

• 마케팅 페이지의 팀원 소개 섹션 개발

리뷰어에게

• 윈도우에서 국기 이모지가 정상적으로 그려지지 않습니다. 이모지 말고 대안이 있을지 고민이 필요합니다.
• Github, Linkedin URL이 올바른지 각자 확인 부탁드립니다.

PR 작성자 체크 리스트

• UI Review를 요청하고 검토를 받았나요?
• UI Tests를 진행했나요?

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!

[DaleSeo]

@Hecklebot 님, PR이 아직 Draft 상태이지만 코드를 보면 구현 작업은 거의 끝나신 것 같네요. 본 PR이 병합되는데 얼마나 시간이 걸릴 것 같으신가요? 올해가 가기 전에 마케팅 페이지 홍보가 가능할지 파악하기 위해 여쭙니다.

[Hecklebot]

@DaleSeo 님. 제가 수, 목요일에는 작업이 어려워서 오늘 중에 마무리해보겠습니다! 병합은 리뷰 상태에 따라 빠르면 금요일, 늦어도 일요일에는 진행되면 좋겠습니다.

[codecov]

Bundle Report

Changes will increase total bundle size by 23.88kB (4.31%) ⬆️. This is within the configured threshold ✅

Detailed changes

Bundle name	Size	Change
daleui-bundle-esm	577.63kB	23.88kB (4.31%) ⬆️

Affected Assets, Files, and Routes:

view changes for bundle: daleui-bundle-esm

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
assets/index-*.js	22.98kB	276.26kB	9.07% ⚠️
assets/index-*.css	900 bytes	64.46kB	1.42%

Files in assets/index-*.js:

• ./src/assets/images/marketing/team/linkedIn-dark.webp → Total Size: 3.85kB

• ./src/assets/images/marketing/team/linkedIn-light.webp → Total Size: 3.25kB

• ./src/App.tsx → Total Size: 1.55kB

• ./src/marketing/Team.tsx → Total Size: 12.42kB

• ./src/assets/images/marketing/team/github-light.webp → Total Size: 4.6kB

• ./src/assets/images/marketing/team/github-dark.webp → Total Size: 4.6kB

[DaleSeo]

스토리북에서 location과 role의 정렬이 틀어지는 현상을 발견하였습니다.

[hyoseong1994]

@Hecklebot 안녕하세요 한샘님 디자인쪽 수정이 발생하였는데 누락될까봐 링크 남깁니다.
https://www.figma.com/design/mQ2ETYC6LXGOwVETov3CgO?node-id=5772-7278#1568988666

[DaleSeo]

@Hecklebot 님, #681 (review) 에서 말씀드린 문제가 여전히 해결이 안 된 것으로 보입니다.

[Hecklebot]

@DaleSeo 님.

제 윈도우 환경에서는 현재 이렇게 보이고 있습니다. 스토리북 Docs에선 실제 너비와 반응형 브레이크 포인트가 일치하지 않아

    docs: {
      story: {
        inline: false,
        iframeHeight: 900,
      },
    },

설정을 추가해 실제 너비에 맞는 반응형 레이아웃을 그리도록 설정해 두었습니다. 맥/사파리 환경의 문제인지 퇴근해서 다시 확인해보겠습니다.

[hyoseong1994]

사진 저장한건 제거하고 링크 방향으로 가는거 같아서 저는 추가 코멘트 없습니다

고생하셨습니다!

[jj5u]

linkedIn 아이콘 비율이 맞지 않습니다. 해당 아이콘 이미지 원 비율이 1:1이 아니라서 높이 지정해주신 걸 빼주시면 자연스럽게 고쳐질 것 같습니다. 확인부탁드립니다.

[Hecklebot]

@jj5u 님 linkedIn light 이미지 비율 변경했습니다.

[DaleSeo]

제 윈도우 환경에서는 현재 이렇게 보이고 있습니다. 스토리북 Docs에선 실제 너비와 반응형 브레이크 포인트가 일치하지 않아

    docs: {
      story: {
        inline: false,
        iframeHeight: 900,
      },
    },

설정을 추가해 실제 너비에 맞는 반응형 레이아웃을 그리도록 설정해 두었습니다. 맥/사파리 환경의 문제인지 퇴근해서 다시 확인해보겠습니다.

@Hecklebot 님, 저는 #681 (review) 에서 Marketing Page의 스토리에 대해서 문제를 보고드렸었는데, 한샘님께서는 Team의 스토리를 보고 계신 것 같습니다. 방금 다시 확인해봤는데 여전히 문제가 해결되지 않았습니다.

[DaleSeo]

Icon 컴포넌트를 쓰지 않고, 생 이미지를 쓰는 이유가 있을까요?

[Hecklebot]

우선 iconography에 브랜드 아이콘에 createBrandIcon 함수를 이용해 fill="currentColor"를 적용하고 있는데, 이걸 적용하지 않는 아이콘을 또 export 하는 게 맞는지 고민이 되었습니다.

또한 Figma에서 사용 중인 아이콘과 iconography에 추가된 svg 아이콘의 크기가 달라 Icon 컴포넌트에 className을 통한 스타일링을 적용해야 하는데, #491 에서 추가하지 않는 방향으로 논의가 진행되어서 그 부분도 고려했습니다.

[DaleSeo]

@Hecklebot 아하, 그런 고민이 있으셨군요! 아이콘 컴포넌트의 API를 수정하는 방향으로 풀 수도 있었던 문제일 것 같은데, 이제와서 관련 논의를 시작하기에는 너무 늦은감이 있네요. 앞으로는 이렇게 일관성에 타협을 하셔야하는 상황에서는 차선책에 대해서 좀 더 적극적으로 팀 차원에서 커뮤니케이션 해주시면 좋을 것 같습니다.

@jj5u 님, 피그마 디자인을 보니 애초에 아이콘 컴포넌트를 쓰지 않으신 것 같네요. 디자인 단부터 일회성 스타일을 지양하고 최대한 디자인시스템에서 제공하는 컴포넌트를 활용하는 것이 매우 중요하다고 생각합니다. 그렇지 않으면 개발 과정에서 이렇게 임의의 구현 결정을 하게 됩니다. 가급적 이러한 결정은 시스템 단에서 이미 되어 있어서 개발자가 고민할 필요가 없는 것이 디자인시스템의 목표일 것입니다.

[RiaOh]

@Hecklebot 님, 저는 #681 (review) 에서 Marketing Page의 스토리에 대해서 문제를 보고드렸었는데, 한샘님께서는 Team의 스토리를 보고 계신 것 같습니다. 방금 다시 확인해봤는데 여전히 문제가 해결되지 않았습니다.

확인해보니 Marketing Page의 스토리에서는 4개의 column으로 되어있고, Team 스토리에서는 2개의 column으로 되어있네요!

[Hecklebot]

@DaleSeo 님. MarketingPage Docs에서 틀어짐 이슈 수정했습니다.