SOSOLOG

πŸ‘‹@SO_YOUNG
πŸ“ μ†Œμ†Œν•˜κ²Œ λ„μ μ΄λŠ” 개발둜그

GitHubTwitter

μ•Œμ•„λ‘λ©΄ μ“Έλͺ¨ μžˆλŠ” Navigator지식

ν”„λŸ°νŠΈμ—”λ“œ κ°œλ°œμ—μ„œ 객체에 λŒ€ν•œ μ‚¬μš©μ„ 빼놓을 수 μ—†μŠ΅λ‹ˆλ‹€. 이 ν¬μŠ€νŒ…μ—μ„œλŠ” navigator객체의 μ—¬λŸ¬ 가지 속성듀에 λŒ€ν•΄ μ‚΄νŽ΄λ΄…λ‹ˆλ‹€. κ°μ²΄λŠ” λŒ€ν‘œμ μΈ User Agent뿐만 μ•„λ‹ˆλΌ μ‚¬μš©μžμ˜ μƒνƒœμ— κ΄€ν•œ μ—¬λŸ¬κ°€μ§€ 정보λ₯Ό λ‹΄κ³  μžˆμŠ΅λ‹ˆλ‹€. navigator의 속성듀은 읽기 μ „μš©μœΌλ‘œ μ ‘κ·Όν•  수 μžˆμŠ΅λ‹ˆλ‹€. react-adaptive-hooks ChromeL…

Saga Patternκ³Ό redux-saga

redux 비동기 처리λ₯Ό μœ„ν•΄ redux-sagaλ₯Ό μ‚¬μš©ν•΄λ³΄μ‹  적이 μžˆμœΌμ‹ κ°€μš”? β€œThe mental model is that a saga is like a separate thread in your application that’s solely responsible for side effects. redux-saga is a redux middlewar…

λ˜λŒμ•„λ³΄λŠ” index.html - Part 2

Part 1μ—μ„œλŠ” link tag와 script tag에 λŒ€ν•΄ μ•Œμ•„λ³΄μ•˜μŠ΅λ‹ˆλ‹€. 이번 νŽΈμ—μ„œλŠ” OpenGraph(μ΄ν•˜ og), favicon, charset, lang에 λŒ€ν•΄ μ•Œμ•„λ΄…λ‹ˆλ‹€. OpenGraph Protocol OpenGraph Protocol(μ΄ν•˜ og)μ΄λž€, Facebookμ—μ„œ μ •μ˜ν•œ HTMLλ¬Έμ„œμ˜ 메타 데이터 정보λ₯Ό μ λŠ” 방식에 λŒ€ν•œ κ·œμ•½β€¦

λ˜λŒμ•„λ³΄λŠ” index.html - Part 1

React, Vue, Angular 같은 Library ν˜Ήμ€ Framework둜 κ°œλ°œν•  경우 λΉŒλ“œ 결과물인 index.html은 μžλ™μœΌλ‘œ μƒμ„±λ˜κΈ° λ•Œλ¬Έμ— 직접 λ³Ό ν•„μš”κ°€ 없을 μˆ˜λ„ μžˆμŠ΅λ‹ˆλ‹€. ν•˜μ§€λ§Œ, μ΅œμ’… html의 ꡬ성 μš”μ†Œλ₯Ό 잘 νŒŒμ•…ν•˜κ³  μžˆλ‹€λ©΄ μ„±λŠ₯ κ°œμ„ μ΄λ‚˜ λ””λ²„κΉ…ν•˜λŠ” μƒν™©μ—μ„œ μš©μ΄ν•˜κ²Œ ν™œμš©ν•  수 μžˆμŠ΅λ‹ˆλ‹€. Parts 1편: link, script t…

2020λ…„ λ‚΄κ°€ μƒκ°ν•œ μ’‹μ€μ½”λ“œ

μž‘λ…„ λ°œν‘œμ—μ„œ β€˜μ§€μ‹μ΄ λ§Žλ‹€κ³  ν•΄μ„œ λ°˜λ“œμ‹œ 쒋은 μ½”λ“œλ₯Ό μ“Έ 수 μžˆλŠ” 것은 μ•„λ‹ˆλ‹€.β€˜λΌκ³  ν–ˆλ‹€. λ¬Όλ‘  μ•„λŠ” 것이 λ§Žμ•„μ§€λ©΄ 쒋은 μ½”λ“œλ₯Ό μž‘μ„±ν•  ν™•λ₯ μ΄ λ†’μ•„μ§ˆ μˆ˜λŠ” μžˆλ‹€. ν•˜μ§€λ§Œ, β€˜μ’‹μ€ μ½”λ“œβ€™λΌλŠ” λ‹¨μ–΄λŠ” 지식 말고도 κ³ λ €ν•΄μ•Ό ν•  점이 λ§Žμ€ 단어이닀. 이 글은 λ‚΄κ°€ 생각해본 쒋은 μ½”λ“œμ— λŒ€ν•΄ μ†Œκ°œν•˜λŠ” 글이닀. β€˜μ’‹λ‹€β€™λΌλŠ” λ¬Έμž₯μ—μ„œ μ•Œ 수 μžˆλ“―, 주관적 생각일 …

[λ²ˆμ—­] Kubernetes Services simply visually explained

이 글은 μ›μž‘μžμ˜ ν—ˆλ½μ„ λ°›κ³  원문을 λ²ˆμ—­ν•œ κΈ€μž…λ‹ˆλ‹€. Parts Part 1: this article Part 2: Kubernetes Ingress simply visually explained TL;DR ClusterIP의 근간이 λ˜λŠ” 4개의 μ„œλΉ„μŠ€κ°€ μžˆμŠ΅λ‹ˆλ‹€. NodePortμ„œλΉ„μŠ€λ₯Ό μƒμ„±ν•˜λ©΄ ClusterIP도 μƒμ„±λœλ‹€κ³  μƒμƒν•΄λ΄…μ‹œλ‹€. 그리고, …

Deploy 2019

μ§„μ •ν•œ 연말이닀. 그리고 μ˜¬ν•΄λ„ λ§Žμ€ λΆ„λ“€μ˜ νšŒκ³ κΈ€μ΄ 올라였고 μžˆλ‹€. 곧 νšŒκ³ κΈ€μ„ μ“΄λ‹€κ³  ν•˜λ‹ˆ, 이런 말을 λ“€μ—ˆλ‹€. β€œνšŒκ³ ν•˜λ©΄ λ°˜μ„±λ§Œ ν•˜κ²Œ 되고, λ‚΄λ…„μ˜ κ³„νšμ€ 뢀담이 λ˜λŠ”κ²ƒ κ°™μ•„μ„œ μ•ˆμ“°κ²Œ λ˜λ”λΌκ΅¬μš”. λ™κ°ν•œλ‹€. λ‚˜μ˜ νšŒκ³ κΈ€μ€ β€˜λ°˜μ„±β€™μ΄ μ•„λ‹Œ β€˜λ˜λŒμ•„λ΄„β€™, β€˜κΈ°λ‘β€™μ„ λͺ©μ μœΌλ‘œ μž‘μ„±ν•œλ‹€. λ‚˜μ˜ 2019년은 μ–΄λ• μ„κΉŒ? λͺ¨ν—˜μ΄μž λ„μ „μ΄μ—ˆλ˜ μΈν„΄κΈ°κ°„μ—μ„œ 쒋은 결…

2019, 5번의 λ°œν‘œ 회고

μ˜¬ν•΄ 총 5번의 λ°œν‘œλ₯Ό ν–ˆμŠ΅λ‹ˆλ‹€. 처음 μΈν„΄μœΌλ‘œ 개발자λ₯Ό μ‹œμž‘ν–ˆλ˜ κ²½ν—˜λΆ€ν„°, μ£Όλ‹ˆμ–΄ 개발자둜의 μ„±μž₯에 λŒ€ν•œ μ΄μ•ΌκΈ°κΉŒμ§€, μ–΄λ–€ λ‚΄μš©μ„ μ „λ‹¬ν•˜μ˜€λŠ”μ§€ λŒμ•„λ΄…λ‹ˆλ‹€. 인턴상λ₯™μž‘μ „ https://speakerdeck.com/soyoung210/inteonsangryugjagjeon GDG Korea WebTech Lightning Talkμ—μ„œ λ°œν‘œν•œ λ‚΄μš©μž…λ‹ˆλ‹€. …

[SSR] 4. UXκ΄€μ μ—μ„œμ˜ SSR

SSR을 μ΄μš©ν•΄μ„œ 두 가지 상황을 κ΅¬ν˜„ν•΄λ³΄μ•˜μŠ΅λ‹ˆλ‹€. 두 번째 글이 첫 λ²ˆμ§Έλ³΄λ‹€ 쑰금 μ–΄λ €μ› λ‹€κ³  μƒκ°λ˜λŠ”λ°μš”, κ³Όμ—° μ–΄λ €μš΄λ§ŒνΌ 쒋은 UXλ₯Ό κ΅¬ν˜„ν•œκ²ƒμΌκΉŒμš”? 제 λŒ€λ‹΅μ€ μž…λ‹ˆλ‹€. μ‚¬μš©μž 관점 Serverμ—μ„œ Data Fetch 3. SSR - Data Fetch의 λ°©λ²•μœΌλ‘œ μš”μ²­ν–ˆμ„ λ•Œ μ–΄λ–€ 일이 λ²Œμ–΄μ§€λŠ”μ§€ 그림으둜 μ‚΄νŽ΄λ΄…μ‹œλ‹€. μ‚¬μš©μžμ˜ μš”μ²­μ΄ express…

[SSR] 3. SSR - Data Fetch

이 νŠœν† λ¦¬μ–Όμ— λŒ€ν•œ 전체 μ½”λ“œλŠ” μ—¬κΈ°μ—μ„œ 보싀 수 μžˆμŠ΅λ‹ˆλ‹€. ν”„λ‘œμ νŠΈλ₯Ό λ§Œλ“€λ©΄μ„œ ν•΄κ²°ν•œ λ²„κ·ΈλŠ” 이 곳에 μ •λ¦¬λ˜μ–΄ μžˆμŠ΅λ‹ˆλ‹€. 라벨의 이슈λ₯Ό μ°Έκ³ ν•΄μ£Όμ„Έμš”. λ‹€λ£° λ‚΄μš© 이번 ν¬μŠ€νŠΈμ—μ„œ ν•  일은 λ‹€μŒκ³Ό κ°™μŠ΅λ‹ˆλ‹€. Clientμ—μ„œ ν•„μš”ν•œ λΉ„μ¦ˆλ‹ˆμŠ€ λ‘œμ§μ„ λͺ…μ‹œν•©λ‹ˆλ‹€. Serverμ—μ„œ 1λ²ˆμ— μ •μ˜λœ λ™μž‘μ„ μˆ˜ν–‰ν•©λ‹ˆλ‹€. 2번의 κ²°κ³Όλ₯Ό client에 μ „λ‹¬ν•΄μ€λ‹ˆλ‹€. Cl…