개발ꡬ리🐸

μ œλ„€λ¦­ κ³΅μ‹λ¬Έμ„œ νŒŒν•΄μΉ˜κΈ° (6)

μ•ˆλ…•ν•˜μ„Έμš” 🐸! 곡뢀에 헀이해진 μš”μ¦˜ λ‹€μ‹œ μ •μ‹  λ‹€μž‘κ³  곡뢀 μ‹œμž‘ν•©λ‹ˆλ‹€! μ™€μΌλ“œμΉ΄λ“œμ™€ ν•˜μœ„ μœ ν˜• 이전에 μ œλ„€λ¦­μ˜ 상속에 λŒ€ν•΄ λ΄€μ—ˆμŠ΅λ‹ˆλ‹€. μ œλ„€λ¦­μ€ νƒ€μž… λ³€μˆ˜ κ°„μ˜ 상속이 μ œλ„€λ¦­ ν΄λž˜μŠ€μ—μ„œ 관계와 μ—°κ²°λ˜λŠ” 것은 μ•„λ‹˜μ„ λ΄€μŠ΅λ‹ˆλ‹€. 예둜 List<Number> 와 List<IntegerλŠ” μ„œλ‘œ 상속 관계에 μžˆμ§€ μ•ŠμŠ΅λ‹ˆλ‹€. 그리고 이 λ‘˜μ˜...

μ œλ„€λ¦­ κ³΅μ‹λ¬Έμ„œ νŒŒν•΄μΉ˜κΈ° (5)

μ•ˆλ…•ν•˜μ„Έμš” ! 🐸 μ™€μΌλ“œμΉ΄λ“œ 뢀뢄은 곡식 λ¬Έμ„œλ₯Ό 읽어도 μ΄ν•΄ν•˜κΈ°κ°€ μ–΄λ €μ›Œμ„œ 직접 예제 μ½”λ“œλ₯Ό μ¨λ³΄λ©΄μ„œ μ΄ν•΄ν•˜λŠλΌ 였래 κ±Έλ¦¬λ„€μš”. 논리적 이해가 ν•„μš”ν•œ 파트 μž…λ‹ˆλ‹€. μ™€μΌλ“œμΉ΄λ“œ μ œλ„€λ¦­ μ½”λ“œμ—μ„œ μ΄λ”°κΈˆμ”© λ³΄μ΄λŠ” <?> κ°€ μ™€μΌλ“œ μΉ΄λ“œλΌκ³  ν•©λ‹ˆλ‹€. λ‹€μ–‘ν•œ μƒν™©μ—μ„œ μ‚¬μš©ν•  수 있으며 μ–΄λ–€ νƒ€μž…μ΄λ“  될 수 μžˆλ‹€λŠ” λœ»μ„ κ°€μ§‘λ‹ˆλ‹€. μƒν•œ 경계 ...

μ œλ„€λ¦­ κ³΅μ‹λ¬Έμ„œ νŒŒν•΄μΉ˜κΈ° (4)

μ•ˆλ…•ν•˜μ„Έμš” 🐸! μ œλ„€λ¦­μ˜ 상속과 ν•˜μœ„ μœ ν˜•μ— λŒ€ν•΄ μ•Œμ•„λ³΄κ² μŠ΅λ‹ˆλ‹€. 상속 관계 μ•žμ„œ 일반적으둜 상속은 μ•„λž˜μ™€ 같은 관계λ₯Ό λ³΄μž…λ‹ˆλ‹€. Object obj = new Object(); Integer integer = new Integer(10); obj = integer; // OK IntegerλŠ” Object의 μžμ‹ 이기 λ•Œλ¬Έμ— Object 객...

λ¦¬μ•‘νŠΈ 맛보기 5일차

μ•ˆλ…•ν•˜μ„Έμš” 🐸 λ¦¬μ•‘νŠΈ 맛보기 5일차 μž…λ‹ˆλ‹€! 01. react-router-dom react-router-dom은 URL을 κ°μ§€ν•˜κ³  화면에 λ³΄μ—¬μ§ˆ νŽ˜μ΄μ§€λ₯Ό λ Œλ”λ§ ν•˜λŠ” 라이브러리 μž…λ‹ˆλ‹€ μ•„λž˜μ˜ λͺ…λ Ήμ–΄λ‘œ μ†μ‰½κ²Œ μ„€μΉ˜ κ°€λŠ₯ν•©λ‹ˆλ‹€ npm i react-router-dom 버전을 λͺ…μ‹œν•˜μ§€ μ•ŠμœΌλ©΄ μ΅œμ‹  λ²„μ „μœΌλ‘œ μ„€μΉ˜κ°€ λ˜λŠ”λ° μž‘μ„±μΌ(2024-06-29...

μ΄ν΄λ¦½μŠ€μ—μ„œ 상속 클래슀 μ°ΎκΈ°

μ•ˆλ…•ν•˜μ„Έμš” 🐸 μž‘μ—…μ„ ν•˜λ‹€λ³΄λ©΄ 가끔 μ–΄λ– ν•œ 클래슀λ₯Ό 상속받은 ν΄λž˜μŠ€κ°€ 무엇이 μžˆλŠ”μ§€λ₯Ό ν™•μΈν•˜κ³  싢을 λ•Œκ°€ μžˆμŠ΅λ‹ˆλ‹€. 이럴 λ•Œμ—λŠ” 찾고자 ν•˜λŠ” ν΄λž˜μŠ€μ— μ»€μ„œλ₯Ό 두고 Ctrl+T λ₯Ό μž…λ ₯ν•˜λ©΄ ν•΄λ‹Ή ν΄λž˜μŠ€μ™€ κ΄€λ ¨λœ 클래슀λ₯Ό ν•œλˆˆμ— λ³Ό 수 μžˆμŠ΅λ‹ˆλ‹€. Number ν΄λž˜μŠ€κ°€ 상속받고 μžˆλŠ” Object 와 Numberλ₯Ό μƒμ†λ°›λŠ” ν΄λž˜μŠ€λ“€μ˜ λͺ©λ‘μ΄ λ³΄μ΄λŠ” ...

제이쿼리 객체 μΆ”κ°€ / 이동

μ•ˆλ…•ν•˜μ„Έμš” 🐸 문제의 λ°œλ‹¨β€¦ μ΄λ²ˆμ— 업무 쀑에 잘 보이던 λ²„νŠΌμ΄ κ°‘μžκΈ° μ‚¬λΌμ§€λŠ” λ¬Έμ œκ°€ λ°œμƒν–ˆμŠ΅λ‹ˆλ‹€! ν•˜λ‚˜μ˜ ν™”λ©΄μ—μ„œ λ‹€μˆ˜μ˜ 탭을 두고 λ ˆμ΄μ•„μ›ƒμ΄ λ°”λ€ŒλŠ” κ΅¬μ‘°μ—μ„œ ν•˜λ‚˜μ˜ λ²„νŠΌμœΌλ‘œ λͺ¨λ“  νƒ­μ—μ„œ μ‚¬μš©ν•˜λ €κ³  ν•˜λ‹ˆ CSSκ°€ κΌ¬μ΄λŠ” λ¬Έμ œμ˜€μŠ΅λ‹ˆλ‹€. CSSλ₯Ό μ‘°μ • ν•˜λŠ” 것은 λ‹€λ₯Έ μž‘μ—…μ΄ μΌμ–΄λ‚˜ 인접 μš”μ†Œμ˜ CSSκ°€ 변경될 경우 같은 λ¬Έμ œκ°€ λ‹€μ‹œ λ°œμƒν•  수 ...

μ œλ„€λ¦­ κ³΅μ‹λ¬Έμ„œ νŒŒν•΄μΉ˜κΈ° (3)

μ•ˆλ…•ν•˜μ„Έμš” 🐸 μ˜€λŠ˜μ€ νƒ€μž… λ³€μˆ˜λ₯Ό μ œν•œν•˜λŠ” extends 에 λŒ€ν•΄ μ •λ¦¬ν•΄λ³΄κ² μŠ΅λ‹ˆλ‹€. extends λͺ©μ  μ œλ„€λ¦­μ€ κ°œλ°œμžκ°€ νƒ€μž… λ³€μˆ˜λ₯Ό 직접 μž…λ ₯ν•˜μ—¬ μ‚¬μš©ν•˜κΈ° λ•Œλ¬Έμ— μ½”λ“œμ˜ μœ μ—°μ„±μ΄ λŠ˜μ–΄λ‚©λ‹ˆλ‹€. ν•˜μ§€λ§Œ 상황에 λ”°λΌμ„œλŠ” νƒ€μž…μ„ μ œν•œμ„ ν•΄μ•Όν•  κ²½μš°κ°€ μžˆμŠ΅λ‹ˆλ‹€. 예λ₯Ό λ“€μ–΄ Numberλ₯Ό κ΅¬ν˜„ν•œ ν΄λž˜μŠ€λ§Œμ„ λ°›μ•„μ•Όν•œλ‹€λ“ μ§€ ν•˜λŠ” 상황이 그런 예일 수 있겠...

μ œλ„€λ¦­ κ³΅μ‹λ¬Έμ„œ νŒŒν•΄μΉ˜κΈ° (2)

μ•ˆλ…•ν•˜μ„Έμš” 🐸 μ˜€λŠ˜μ€ μ œλ„€λ¦­ λ©”μ„œλ“œμ— λŒ€ν•΄ μ •λ¦¬ν•΄λ³΄κ² μŠ΅λ‹ˆλ‹€. μ œλ„€λ¦­ λ©”μ„œλ“œλŠ” μ œλ„€λ¦­μ˜ λ‹€λ₯Έ ν•­λͺ©μ— λΉ„ν•΄ μ΄ν•΄ν•˜κΈ°κ°€ μ–΄λ €μ›Œμ„œ μž‘μ„±ν•˜λŠ”λ° μ‹œκ°„μ΄ κ±Έλ Έλ„€μš” 01. μ œλ„€λ¦­ λ©”μ„œλ“œ (Generic Method) μ œλ„€λ¦­ λ©”μ„œλ“œλŠ” νƒ€μž… λ³€μˆ˜λ₯Ό 톡해 맀개 λ³€μˆ˜, λ°˜ν™˜ νƒ€μž…μ„ κ²°μ •ν•˜λŠ” λ©”μ„œλ“œ μž…λ‹ˆλ‹€. μ œλ„€λ¦­ λ©”μ„œλ“œμ™€ μ œλ„€λ¦­ ν΄λž˜μŠ€λŠ” μ„œλ‘œ λ…λ¦½μ μž…λ‹ˆλ‹€. μ œλ„€...

Http delete의 body에 데이터 λ‹΄κΈ°

μ•ˆλ…•ν•˜μ„Έμš”!🐸 μ§€λ‚œ μž‘μ—… νšŒμ‚¬μ—μ„œ HTTP DELETE인 APIλ₯Ό μ‚¬μš©ν•˜λŠ”λ° request body에 데이터λ₯Ό λ‹΄μ•„ λ³΄λ‚΄λ‹¬λΌλŠ” μš”μ²­μ΄ μžˆμ—ˆμŠ΅λ‹ˆλ‹€. μ œκ°€ μž‘μ—…ν•˜λŠ” ν™˜κ²½μ€ μžλ°” 7 버전을 μ‚¬μš© 쀑 μž…λ‹ˆλ‹€. λ¨Όμ € μœ„ν‚€ν”Όλ””μ•„μ˜ 정보에 λ”°λ₯΄λ©΄ 기본적으둜 HTTP DELETEλŠ” BODY에 λ‹΄λŠ” 것이 선택 사항이라고 ν•˜κ³  μžˆμŠ΅λ‹ˆλ‹€ ν•˜μ§€λ§Œ μœ„μ˜ ν‘œκ°€ μ°Έμ‘°...

λ§ˆν¬λ‹€μš΄ 이미지 μ‘°μ ˆν•˜κΈ°

μ•ˆλ…•ν•˜μ„Έμš” 🐸 λ§ˆν¬λ‹€μš΄ μ–Έμ–΄λŠ” μ΄λ―Έμ§€μ˜ μ‚¬μ΄μ¦ˆ 쑰절이 λΆˆκ°€ν•©λ‹ˆλ‹€. κ·Έλž˜λ„ 방법을 찾아보렀고 검색해보면 λ§ˆν¬λ‹€μš΄μ—μ„œ 이미지 μ‘°μ ˆμ„ ν•˜κ³  μ‹Άλ‹€λ©΄ <img> νƒœκ·Έλ₯Ό μ‚¬μš©ν•˜λΌκ³  ν•˜μ£  ν•˜μ§€λ§Œ κΉƒν—ˆλΈŒ λΈ”λ‘œκ·ΈλŠ” <img> νƒœκ·Έκ°€ μ—…λ‘œλ“œ λœλ‹€λ©΄ 내뢀에 alt 속성을 λ°˜λ“œμ‹œ μ‚¬μš©ν•˜λ„λ‘ κ°•μ œν•©λ‹ˆλ‹€. λ§Œμ•½ alt νƒœκ·Έλ₯Ό μ‚¬μš©ν•˜μ§€ μ•ŠμœΌλ©΄ λΉŒλ“œ μ‹€...