[250812] TIL
μ½λ© ν μ€νΈ 곡λΆ
κΈ°μ λ©΄μ 곡λΆ
κΈ°μ λ©΄μ 곡λΆ
κΈ°μ λ©΄μ 곡λΆ
λν - μ΅μ’ λ°ν μ€λΉ
λν - μ½λ μ€ν리ν μ μ©
λν - μΉ μ±λ₯ μ§ν νμΈ, ν¬νΈν΄λ¦¬μ€ μμ
λν - μΉ μ±λ₯ μ΅μ ν κ°λ³ λ€μ΄λλ―Ή μλΈμ μΌλ‘ λ³κ²½
λν - ISR μ μ© μ§νμ€
λν - SEO μ΅μ ν μ§νμ€
λν - SEO μ΅μ ν μ§νμ€
λν - SEO μ΅μ ν μ§νμ€
λν - μ΅μ ν μ§νμ€
λν - μ΅μ ν μ§νμ€
Next.js Suspense, use
λν μ΅μ ν μμ - μ΄λ―Έμ§
리μ‘νΈ λ λλ§ - λ©λͺ¨μ΄μ μ΄μ κ³Ό κ΄κ³β
리μ‘νΈ λ λλ§β
νΈλ¬λΈ μν - NextImage μ μ© ν, CDN μ΄λ―Έμ§ μλΆλ¬μμ§λ νμ
StrictMode λ λλ§
λ λλ§ λμμ λν μλ²½ν κ°μ΄λ μ½κΈ°
λν κΈ°λ‘ λλ©μΈ Next/Image μ»΄ν¬λνΈλ‘ λ³κ²½
λν - Tanstack Query 무νμ€ν¬λ‘€ μ μ©
μΈνλ° μΉ μ΅μ ν PART 2 κ°μ λ£κΈ°
μΈνλ° μΉ μ΅μ ν PART 2 κ°μ λ£κΈ°
μΈνλ° μΉ μ΅μ ν PART 2 κ°μ λ£κΈ°, μ΄λ ₯μ μμ±
μΈνλ° μΉ μ΅μ ν PART 2 κ°μ λ£κΈ°
μΈνλ° μΉ μ΅μ ν PART 1 κ°μ λ£κΈ°
λν μΉ΄μΉ΄μ€λ§΅ ν΄λ¬μ€ν°λ§ ꡬν
DI ν¨ν΄ μ μ© μ¬λ‘ μ 리
Container/Presentational ν¨ν΄
λν λͺ¨λ¬ μμ€ν ꡬν
λν v2 QA λ° λ¦¬νν λ§
λν v2 QA λ° λ¦¬νν λ§
λν v2 QA λ° λ¦¬νν λ§
λν v2 μΆμ μ΄ν μ€λ₯ μμ
λν v2 κΈ°λ₯ ꡬν
λν v2 QA μ§ν
λν v2 QA μ§ν
λν v2 κΈ°λ₯ ꡬν
λν v2 κΈ°λ₯ ꡬν
IntersectionObserverλ‘ λ¬΄ν μ€ν¬λ‘€ ꡬννκΈ°
λν v2 κΈ°λ₯ ꡬν
λν v2 κΈ°λ₯ ꡬν
λν v2 κΈ°λ₯ ꡬν
λν v2 κΈ°λ₯ ꡬν
λν v2 κΈ°λ₯ ꡬν
리μ‘νΈ μλ² μ»΄ν¬λνΈ μ΄ν΄νκΈ° μ§νμ€
λν ν ν¬λ¬Έμ μμ±
λν μ¬μ©μνν λ°μ νΌλλ°± λ°μ μλ£
λν μ¬μ©μνν λ°μ νΌλλ°± λ°μ μ§νμ€
λν λ²κ·Έλ‘ μ¨λ¦μ€ .. λλμ΄ ν΄κ²° !!
λν λ²κ·Έλ‘ μ¨λ¦μ€ .. νλ ν΄κ²°
λν λ²κ·Έλ‘ μ¨λ¦μ€ ..
νλ‘ νΈμλ λ‘컬 νκ²½μμ λ°±μλ μλ² μ°λνκΈ° (μνμ΄ μΏ ν€)
λν νλ‘μ νΈ μμ - MVP μΆμ !
λν νλ‘μ νΈ μμ - MVP ν μ€νΈ λ° λ²κ·Έ μμ
λν νλ‘μ νΈ μμ - MVP ν μ€νΈ λ° λ²κ·Έ μμ
λν νλ‘μ νΈ μμ - λμ€μ½°μ΄μ MVP λ°°ν¬
λν νλ‘μ νΈ μμ - λμ€μ½°μ΄μ MVP λ°°ν¬
λν νλ‘μ νΈ μμ
λν νλ‘μ νΈ μμ
λν νλ‘μ νΈ μμ
λν νλ‘μ νΈ μμ
λν νλ‘μ νΈ μμ
λν νλ‘μ νΈ μμ
νλ‘μ νΈ μ€κ³ λ¨κ³ μμ - κΈ°μ μ€ν μ μ λ§μΌμ€ν€
νλ‘μ νΈ μ€κ³ λ¬Έμ μμ±
νλ‘μ νΈ μ€κ³ λ¬Έμ μμ±
νλ‘μ νΈ μ€κ³ λ¬Έμ μμ±
νλ‘μ νΈ μ€κ³ λ¬Έμ μμ±
μλ°μ€ν¬λ¦½νΈ μ μΆλ ₯, ν¨ν€μ§ μμ‘΄μ± κ΄λ¦¬, TypeScript λΈλλ νμ , νλ‘μ νΈ μμ΄λμ΄ νμ
μΉ΄μΉ΄μ€ν ν¬ ν νλ‘μ νΈ μμ΄λμ΄ νμ
κΈ°μ λ©΄μ μ€λΉ, μΉ΄μΉ΄μ€ν ν¬ ν νλ‘μ νΈ μμ΄λμ΄ νμ
κ°μΈ νλ‘μ νΈ κ³Όμ μ μΆ λ° νκ³
κ°μΈ νλ‘μ νΈ μμ
React ν¨μν μ»΄ν¬λνΈμ ν΄λμ€ν μ»΄ν¬λνΈλ μνκ΄λ¦¬μ λΌμ΄ν μ¬μ΄ν΄ μ²λ¦¬ λ°©μμμ μ°¨μ΄
Spring boot μμ JWT ν ν° μΏ ν€λ‘ κ΄λ¦¬νκΈ° (HttpOnly)
λ©λͺ¨λ¦¬ λμ μμΈκ³Ό ν΄κ²° λ°©λ²
Vanilla JSλ‘ Virtual domμ ꡬννλ€λ©΄ κ³ λ €ν΄μΌν λ΄μ©
ERD μμ±
ERD νμ΅
ν΄μ»€ν€ μ§ν - μΉ΄μΉ΄μ€λνμ΄μ¬μ μμ !
μ½λ μμ
JS λ―Έλνμ€νΈ νκΈ°
리νλ‘μ°μ 리νμΈνΈλ₯Ό μ€μΌ μ μλ λ°©λ²
JS μμ© ν€μλ μ 리 2
JS μμ© ν€μλ μ 리
HTTP ν€μλ μ 리
λ°λλΌ JS νλ‘μ νΈ μ§ν
ν¬λ¨ν΄λ¦° IDE νΉκ°, μΉ΄μΉ΄μ€ν ν¬ 2μ£Όμ°¨ κ³Όμ λ§λ¬΄λ¦¬
μ€λ λ νμ΅ λ° CIL νλ‘κ·Έλ¨ ν΄λμ€ λ€μ΄μ΄κ·Έλ¨ 그리기
Java GC
Java κΈ°λ³Έ κ°λ κ³Ό JVM μν€ν μ²
μ¬μ΄λ νλ‘μ νΈ μ€λ₯
μ¬μ΄λ νλ‘μ νΈ λ°°ν¬
μ¬μ΄λ νλ‘μ νΈ μμ
μ¬μ΄λ νλ‘μ νΈ μμ
nextjs Optimistic Updates
nextjs cashing
μλ°ν΄ 컀νΌμ±, μΊλΏλ§μΌ Authentication ꡬν, iron-session
λ Έλ§λμ½λ λͺ¨κ°μ½, μΊλΏλ§μΌ, bcrypt
prisma
μΊλΏλ§μΌ κ³Όμ , zod, validator
μΊλΏλ§μΌ κ³Όμ μ μΆ
컨νΌλ°μ€, μΊλΏλ§μΌ
μκ³ λ¦¬μ¦κ³Ό μλ£κ΅¬μ‘°
tailwindcss
ν΄μ¬, ν΄μ, λ Έλ§λμ½λ μ€ν°λ νλ
μ λ°λ―Έ 100μΌ μ½λ© (9-14μΌμ°¨)
μ λ°λ―Έ 100μΌ μ½λ© (4-8μΌμ°¨)
μ λ°λ―Έ 100μΌ μ½λ© (3μΌμ°¨)
μ λ°λ―Έ 100μΌ μ½λ© (1~2μΌμ°¨)
λ°λΈμ½μ€ 7μΌμ°¨
λ°λΈμ½μ€ 6μΌμ°¨
λ°λΈμ½μ€ 5μΌμ°¨
λ°λΈμ½μ€ 4μΌμ°¨
λ°λΈμ½μ€ 3μΌμ°¨, git config core.pager
λ°λΈμ½μ€ 2μΌμ°¨
νλ‘κ·Έλλ¨Έμ€ λ°λΈμ½μ€ κ°κ°
λ₯λ€μ΄λΈ 49κ° μ€μ΅, ES.NEXT λ²λ€λ§ μ©μ΄
μν°ν΄ μ½κ³ (μλ°μ€ν¬λ¦½νΈμμ§κ³Ό λ°νμμ μ°¨μ΄μ )
ν΄λμ€μμ static μ°λ©΄ μλλ μ΄μ
μΈλΆ λΌμ΄λΈλ¬λ¦¬ μ λ΅ ν¨ν΄ μ΄μ©ν΄μ 컨νΈλ‘€ νκΈ°
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
getServerSideProps
Tree-shaking, as const
Nullish Coalescing Operator
git pull μ λ°μνλ warning ν΄κ²°νκΈ°
리νν λ§ ν κ², μ€ν 리λΆ
νμ€ν 리μ‘νΈ λΌμ΄λΈμ½λ© λ£κ³
Deep Diveλ₯Ό μ½κ³
Deep Diveλ₯Ό μ½κ³
μΌνλ©΄μ λ°°μ΄ κ²λ€
μΌνλ©΄μ λ°°μ΄ κ²λ€
μ½λ 리뷰 λ°κ³ λ°°μ΄ κ²
μ½λ 리뷰 λ°κ³ λ°°μ΄ κ²
Deep Dive λ₯Ό μ½κ³
Deep Dive λ₯Ό μ½κ³
Deep Dive λ₯Ό μ½κ³
typescript κ΄λ ¨ ν
typescript κ΄λ ¨ ν
typescript κ΄λ ¨ ν
ν°λ―Έλ μμκ² κΎΈλ―ΈκΈ° (iTerm2)
Nextjs μμ μ 곡νλ ꡬκΈν°νΈ μ μ©
typescript μλ‘ μκ² λ κ²
lint κ΄λ ¨ ν
Storybook μ΄λ―Έμ§ κΉ¨μ§λ μ€λ₯
μΌνλ©΄μ λ°°μ΄ κ²λ€
μΌνλ©΄μ λ°°μ΄ κ²λ€
μΌνλ©΄μ λ°°μ΄ κ²λ€
μΌνλ©΄μ λ°°μ΄ κ²λ€
Deep Dive μ½κ³
typescript μλ‘ μκ² λ κ²
react mui λΌμ΄λΈλ¬λ¦¬ μ¬μ©
js, ts μ¬ν
μΌνλ©΄μ λ°°μ΄ κ²λ€
μΌνλ©΄μ λ°°μ΄ κ²λ€
νΉμ 컀λ°μ νμ¬ λΈλμΉλ‘ κ°μ Έμ€κΈ°
react hook
react swr hook
typescript
μμ λ° μ 리
μμ λ° μ 리
μ½ν λ¬Έμ νμ΄
μ½ν λ¬Έμ νμ΄
git commit μλͺ» μμμ λ
μ½ν λ¬Έμ νμ΄
μ½ν λ¬Έμ νμ΄
μ½ν λ¬Έμ νμ΄
μ½ν λ¬Έμ νμ΄, νμ΅λ΄μ© μ 리
μ½ν λ¬Έμ νμ΄, νμ΅λ΄μ© μ 리
μ½ν λ¬Έμ νμ΄, JS νμ΄ν, μΌλ°ν¨μ μ°¨μ΄μ
μ½ν λ¬Έμ νμ΄, JS AbortController κ°μ²΄
μ½ν λ¬Έμ νμ΄
μ½ν λ¬Έμ νμ΄, JS λ¬Έλ², μ€λ³΅ ν΄λ¦ λ°©μ§
React λ¬Έλ²
ꡬ쑰 λΆν΄ ν λΉ
κ΅κ° λ³ μκ°
ios safari μμ vh μ€λ₯ ν΄κ²°νκΈ°
ios κ³ μ ν΄λ¦ μ΄λ²€νΈ μ΄μ ν΄μ, λ²λΈλ§ μΊ‘μ²λ§
css μ μ²λ¦¬κΈ°, css νμ²λ¦¬κΈ°, css-in-js
λͺ¨λ°μΌμ μ°μ μ μΌλ‘ κ³ λ €νλ λμμΈ λ° κ°λ°μ μ κ·Ό λ°©μ
λμμΈ ν¨ν΄ - λ°μ½λ μ΄ν°
λμμΈ ν¨ν΄ - λ°μ½λ μ΄ν°
νλ‘ νΈμλ νμ λΌμ΄λΈλ¬λ¦¬
UI μ»΄ν¬λνΈ λΌμ΄λΈλ¬λ¦¬
μ€μ μμ λ°λ‘ μ°λ Next.js μ½κ³ μ 리
μ€μ μμ λ°λ‘ μ°λ Next.js μ½κ³ μ 리
λ¬Έμμ΄μμ μ»΄ν¬λνΈ νμ λ£κ³ μΆμΆνλ ν¬νΌ ν¨μ λ§λ€κΈ°
stash μμμ μ₯νκΈ°, merge βno-ff μ΅μ
ptμ px , word-breack
typesciprt is as
μ¬λ¦ν΄κ°, react
Mapped Types
Indexed Access Types, Conditional Types
μ¬μ΄λ νλ‘μ νΈ - κ°€λ¬λ¦¬ λ§λ€κΈ°
μ¬μ΄λ νλ‘μ νΈ μμ μ€μ λΌμ°ν° μ€λ₯
next.js μκ°μμ μμ² λ° κ°λ¨ν μ€μ΅
νμ μ€ν¬λ¦½νΈ νΈλλΆ λ°ν λ° λ³΅μ΅
μΈλ±μ€ μκ·Έλμ², μ λλ¦, JS νλ‘νΌν°, ν΄λ‘μ
μ λλ¦, ν¨μ μ€λ²λ‘λ λ±
μ λλ¦, ν¨μ μ€λ²λ‘λ λ±
νμ μ§ν
axios api μμ
type μ μ’νλ κ³Όμ
Literal Types, 리ν°λ΄ μΆλ‘ , Enums
Primitive type, Union, Type alias, Interface λ±
μ μ νμ κ²μ¬, μ격λ
νΈλλΆ νμ΅ μμ
μ¬μ©λ² λ° ν μ€νΈ
μΏ ν€, μΈμ , JWT, Cache
react μ½λ리뷰
μν λ―Ή λμμΈ(Atomic), μ€λ°κΏ
callback promise
λλ¦Όμ½λ© μμ²
css-flex , jira νμ ν΄
prettier , react κ²μλ¬Ό λ§λ€κΈ°
react router, link to
react, styled-components, branch & merge κ·μΉ
menorepo μ€μ΅