๐ ํ๋กํ ์์ญ ์ปดํฌ๋ํธ ๊ตฌํ #25
Conversation
| } | ||
|
|
||
| const ProfileSection = ({ | ||
| profileImg = 'https://github.com/shadcn.png', |
There was a problem hiding this comment.
๋ฐ๋ก ์์ํํด์ ์ฌ์ฉํ๋ฉด ์ข์ ๊ฒ ๊ฐ์์.
const DEFAULT_PROFILE_IMAGE = '~~' ์ด๋ฐ ์์ผ๋ก?
There was a problem hiding this comment.
Avatar ์ปดํฌ๋ํธ ์์ฒด์ default๋ก ๋ฃ์ด๋๋ ์ข์ ๊ฒ ๊ฐ์ต๋๋ค.
There was a problem hiding this comment.
์ค ๊ทธ๋ ๋ค์!! avatar ์ปดํฌ๋ํธ ์์ฒด์ ๋ํดํธ๋ก ํด๋๊ฒ ์ต๋๋ค! ํน์ ํ๋กํ ์ด๋ฏธ์ง๋ฅผ ๋ฐ๊ฟ ์๋ ์์ผ๋๊น ๋ชจ๋ฅด๋๊น ์์ํ๋ ํด๋๊ฒ ์ต๋๋ค
| return ( | ||
| <main className="flex-col min-h-screen bg-background-color"> | ||
| <div>์ด๋ฏธ์ง ์ฌ๋ผ์ด๋ ์์ญ</div> | ||
| <ProfileSection userName="์์์ด๋ฆ" /> |
There was a problem hiding this comment.
์์ profileImg ๋ ์ผ๋จ ๋นผ๋์ ๊ฑด๊ฐ์?
There was a problem hiding this comment.
์ profileImg๊ฐ ๋น ์ก๊ตฐ์!! ๋ฐฑ์๋ํ๊ณผ ์๊ธฐํ์ ๋ ์ด๋ฏธ์ง๊ฐ ์์๋์๋ ๋ฐฑ์๋์์ null๊ฐ์ผ๋ก ๋ฐํํด์ฃผ๋๊ฑธ๋ก ์๊ธฐ๊ฐ ๋์์ null๋ก ์ฌ๋๋ ๋ํดํธ ์ด๋ฏธ์ง๊ฐ ๋ณด์ด๊ฒ ํด๋จ์ต๋๋ค!
| <Avatar size="md"> | ||
| <AvatarImage src={profileImg} /> | ||
| </Avatar> | ||
| <div className={`ml-9 ${TYPHOGRAPHY.profile}`}>{userName}</div> |
There was a problem hiding this comment.
sizes๋ฅผ ์ ๊ฐ ์ฌ์ฉํ์๊ณ ์ ์ํ๊ธด ํ๋๋ฐ ๋ง์ ์ด๋ ๊ฒ ๋ณด๋, ๋ญ๊ฐ tailwind์ ๋๋์ ํด์น๋๊ฒ ๊ฐ์ ์ฐ๋ ค์ค๋ฝ๊ธฐ๋ ํ๋ค์.
ํ์๋ฅผ ํตํด ๊ด๋ จํด์ ์ ํ๋ฉด ์ข์๊ฒ ๊ฐ์ต๋๋ค.
- ๋ชฉ์
๊ด๋ จ ํฐ์ผ ๋ฒํธ: 85
- ์ฃผ์ ๋ณ๊ฒฝ ์ฌํญ
๊ธฐํ ์ฌํญ (์ ํ)
- ์คํฌ๋ฆฐ์ท (์ ํ)