[feat] Home/DashboardPage 구현

[bakhacode]

구현해야 할것

컴포넌트

공통 컴포넌트

• Header
• Footer
• UserControls

그 외

• Search
• TickerTape

핵심

• Nav
  • Header와 Footer의 Nav 둘 다 사용할 수 있고, 변경될 UI를 고려해서 사용처에서 Style을 주입해서 사용하도록 Compound Component로 구현

---

사용 예시

    <NavWrapper links={headerNavLinks}>
      <NavWrapper.NavList style={navListStyle}>
        {headerNavLinks.map((link) => (
          <NavWrapper.NavItem style={navItemStyle} key={link.url} link={link} />
        ))}
      </NavWrapper.NavList>
    </NavWrapper>

const navListStyle = {
  display: "flex",
  gap: "16px",
};

const navItemStyle = {
  width: "80px",
  height: "40px",
  display: "flex",
  justifyContent: "center",
  alignItems: "center",
  fontSize: "16px",
  fontWeight: "bold",
};