πŸ“styled-component λ¬΄λΆ„λ³„ν•œ μ‚¬μš©μ— κ΄€ν•˜μ—¬

10_2pangΒ·2023λ…„ 6μ›” 5일
0

βš½οΈνŠΈλŸ¬λΈ”μŠˆνŒ…

λͺ©λ‘ 보기
25/94
post-thumbnail

πŸ‘¨β€πŸ’» μ‚¬κ±΄


  • ( 일단 μš°λ¦¬λŠ”, 각 μ»΄ν¬λ„ŒνŠΈ λ‹¨μœ„ νŒŒμΌμ•ˆμ— μŠ€νƒ€μΌλ“œ μ»΄ν¬λ„ŒνŠΈλ₯Ό λ§Œλ“€μ–΄ μ‚¬μš©ν•˜μ˜€λ‹€. )
  • νŒ€μ›λ“€κ³Ό ν˜‘μ—…μ„ ν•˜λ‹€κ°€, κ³Όμ—° μž‘μ€λ‹¨μœ„μ˜ νƒœκ·Έλ“€λ„ μŠ€νƒ€μΌλ“œ μ»΄ν¬λ„ŒνŠΈν™” λ₯Ό μ‹œν‚€λŠ” 것이 λ§žλŠ”κ°€μ— λŒ€ν•˜μ—¬, 고민에 λΉ μ‘Œλ‹€. λ‚˜λŠ” μ»΄ν¬λ„ŒνŠΈ μžμ²΄κ°€ ν•˜λ‚˜μ˜ κΈ°λŠ₯λ‹¨μœ„λ‘œ 생각을 ν•˜μ—¬μ„œ, κ·Έ κΈ°λŠ₯듀을 ν•œλ²ˆμ— μŠ€νƒ€μΌλ“œ ν™” ν•  wrapper μŠ€νƒ€μΌλ“œλ₯Ό μ£Όκ³ , 각 ν•˜μœ„νƒœκ·Έλ“€μ— 클래슀 아이디λ₯Ό λΆ€μ—¬ν•œν›„ κ·Έ 클래슀만 λ”°λ‘œ μŠ€νƒ€μΌν™”λ₯Ό μ£ΌλŠ” 방법을 주둜 μ΄μš©ν–ˆλ‹€. 이λ₯Ό 톡해 λ‚˜λŠ” λ¬΄λΆ„λ³„ν•œ μ»΄ν¬λ„ŒνŠΈν™”λ₯Ό μ§€μ–‘ν•˜μ˜€λ‹€. λ˜ν•œ ꡬ글링을 톡해, 이λ₯Ό κ²€μƒ‰ν–ˆμ„λ•Œ μ½”λ“œκ°€λ…μ„±μ΄ λ–¨μ–΄μ§ˆ 수 μžˆλ‹€λŠ” λ‚΄μš©μ„ κ°„κ°„νžˆ λ³΄μ•„μ„œ 쑰금 더 꺼렀쑌던 것이닀.
  • λ°˜λŒ€λ‘œ, μͺΌκ°œμ–΄μ„œ μŠ€νƒ€μΌλ“œ μ»΄ν¬λ„ŒνŠΈλ₯Ό μ‚¬μš©ν•˜λ©΄, ν΄λž˜μŠ€λ„€μž„μ„ λ”°λ‘œ λΆ€μ—¬ν•˜μ§€ μ•Šμ•„λ„ λ˜λŠ” μž₯점 μ•„λ‹Œ μž₯점과 λ‚˜μ€‘μ— μž¬μ‚¬μš©μ„±μ„ κ³ λ € ν•˜μ˜€μ„ λ•Œ, λ”μš± 직관적인 μž₯점이 μžˆλ‹€. λ˜ν•œ νŒ€κ³Ό ν˜‘μ—…μ„ ν•  경우, 각 μ»΄ν¬λ„ŒνŠΈμ˜ λ„€μž„μ„ μ •ν•  것 이기에, 이λ₯Ό ν†΅ν•˜μ—¬ μ§κ΄€μ μœΌλ‘œ 무슨 역할을 ν•˜λŠ” νƒœκ·ΈμΈμ§€ μ•Œ 수 μžˆλ‹€. ( ꡳ이 className 을 μ•ˆμ°Ύμ•„λ„ λœλ‹€. )

βœ… ν•΄κ²°


  • μ‹€λ¬΄μž λΆ„μ—κ²Œ ν•œλ²ˆ 우리의 고좩에 λŒ€ν•΄ ν„Έμ–΄λ†“μ•˜λ‹€. μ²˜μŒμ— λ‚΄κ°€ μš°λ €ν•œ λ¬΄λΆ„λ³„ν•œ μ‚¬μš©μ— κ΄€λ ¨ν•˜μ—¬, λ¨Όμ € μ™œ λ¬Έμ œκ°€ λ˜λŠ”κ°€μ— λŒ€ν•΄ λ‚˜μ—κ²Œ λ°˜λ¬Έν•˜μ˜€λ‹€. 이에 λ‚˜λŠ” λŒ€λ‹΅ ν•  수 μ—†μ—ˆλ‹€. μ–΄λ–»κ²Œ 보면 κ·Έλƒ₯ 그룹화일 수 있던 것이닀. λ˜ν•œ μ½”λ“œκ°€λ…μ„±μ— κ΄€λ ¨ν•˜μ—¬μ„œ λ¬Όμ–΄λ³΄μ•˜λ‹€. μ΄λ˜ν•œ λ§ˆμ°¬κ°€μ§€μ΄λ‹€. μ»΄ν¬λ„ŒνŠΈ ν™”λ₯Ό ν†΅ν•˜μ—¬, 각 μ»΄ν¬λ„ŒνŠΈκ°€ μ–΄λ–€ 역할인지 λ”μš± λͺ…ν™•νžˆ λ³΄μ΄λŠ” 것 κ°™μ•˜λ‹€. μ΄λŸ¬ν•œ 쑰언을 λ°›μœΌλ‹ˆ, 마음이 νŽΈμ•ˆν•΄ μ‘Œλ‹€.

πŸ’­ κ°œμ„ 


  • νŒ€μ›κ³Ό ν•¨κ»˜ν•˜λŠ” ν”„λ‘œμ νŠΈμ—¬μ„œ, 쑰금 더 μ‘°μ‹¬μŠ€λŸ½κ²Œ μƒκ°ν•˜λŠ” 뢀뢄이 λ§Žμ•„μ‘Œλ‹€. μ΄λŠ” ν•œλ²ˆ 더 κ³ λ―Όν•˜κ²Œ ν•΄μ£ΌλŠ” 사항일 μˆ˜λ„ μžˆμ§€λ§Œ, νŒ€μ›λ“€μ—κ²Œ λΆˆν•„μš”ν•œ μ‹œκ°„μ„ 빼앗을 수 μžˆλ‹€λŠ” 생각이 λ“€μ—ˆλ‹€. 무엇이 옳고 κ·Έλ₯Έμ§€λŠ” λͺ…ν™•νžˆ νŒλ‹¨μ΄ λΆˆκ°€λŠ₯ν•˜μ§€λ§Œ, 잘 μ„ νƒν•˜μ—¬ λ‚˜μ•„κ°€μ•Όκ² λ‹€.
profile
μ£Όλ‹ˆμ–΄ ν”„λ‘ νŠΈμ—”λ“œ 개발자 이광렬 μž…λ‹ˆλ‹€ 🌸

0개의 λŒ“κΈ€

Powered by GraphCDN, the GraphQL CDN