Coder Social home page Coder Social logo

๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป Yohan Kim

  • ์—ฐ๋ฝ์ฒ˜: [email protected]
  • ๋ณ‘์—ญ์ƒํƒœ: ๋ฉด์ œ

์˜ค์ง ์ผ์—๋งŒ ์ง‘์ค‘ํ•  ์ˆ˜ ์žˆ๋Š” ํšŒ์‚ฌ๋ฅผ ์ฐพ๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

์Šคํ”„๋ฆฐํŠธ ๊ธฐ๊ฐ„์„ ์ตœ๋Œ€ํ•œ ์งง๊ฒŒ ํ•˜๋Š” ๊ฒƒ์„ ์ข‹์•„ํ•˜๋ฉฐ ๋ฐ์ดํ„ฐ ๊ธฐ๋ฐ˜์œผ๋กœ ์ผ์„ ํ•˜๋ ค ๋…ธ๋ ฅํ•ฉ๋‹ˆ๋‹ค.
ํšŒ๋ณต ํƒ„๋ ฅ์„ฑ์ด ๊ฐ•ํ•˜๊ณ  ๊ฐ€์„ค ๊ฒ€์ฆ ๊ธฐ๋ฐ˜์˜ ๋””๋ฒ„๊น… ๋Šฅ๋ ฅ์ด ์šฐ์ˆ˜ํ•ฉ๋‹ˆ๋‹ค.
์ด์ƒํ•œ ์ผ๋“ค์„ ๋งŽ์ด ํ•ด์„œ ๋ฒ„๊ทธ๋ฅผ ๋งŽ์ด ๋งŒ๋‚˜ ๋ชฝํ‚ค ํŒจ์นญ์„ ์ž˜ํ•ฉ๋‹ˆ๋‹ค.
๋ฐฐํฌ๋ฅผ ์ž์ฃผ ํ•˜๋Š” ๋ฌธํ™”๋ฅผ ๋งŒ๋“ค๊ธฐ ์œ„ํ•ด ๋…ธ๋ ฅํ•ฉ๋‹ˆ๋‹ค.

๐Ÿ“Œ Work Experience

๋‹น๊ทผ๋งˆ์ผ“ (2023.04 ~ ํ˜„์žฌ)

์†Œํ”„ํŠธ์›จ์–ด ์—”์ง€๋‹ˆ์–ด

๋คผ์ด๋“œ (2020.11 ~ 2022.11)

์†Œํ”„ํŠธ์›จ์–ด ์—”์ง€๋‹ˆ์–ด

  • Schema based development
    • Protobuf ๊ธฐ๋ฐ˜์œผ๋กœ webview์™€ native, server ์ธํ„ฐํŽ˜์ด์Šค ์ž‘์„ฑ
    • ์ž‘์„ฑ๋œ schema๋ฅผ ํ†ตํ•ด ๋ฐ˜๋ณต์ ์ธ ์ฝ”๋“œ๋ฅผ ๊ธฐ๊ณ„์ ์œผ๋กœ ์ž๋™ ์ƒ์„ฑ
    • Open API Schema๋ฅผ ๊ธฐ๋ฐ˜์œผ๋กœ rest api๋“ค์˜ ๋ฐ˜๋ณต์ ์ธ ์ฝ”๋“œ๋ฅผ ๊ธฐ๊ณ„์ ์œผ๋กœ ์ž๋™ ์ƒ์„ฑ
    • ์Šคํ‚ค๋งˆ ์ €์žฅ์†Œ๋ฅผ ๋ถ„๋ฆฌํ•˜์—ฌ PR์„ ํ†ตํ•ด api tech spec ๋…ผ์˜
  • ์ปดํŒŒ์ผ / ๋ฒˆ๋“ค๋ง ๋ฐฉ์‹ ์—ฐ๊ตฌ ๋ฐ ๊ฐœ์„ 
    • css-in-js๋กœ ์ธํ•œ babel ์˜์กด์„ฑ์„ ์ œ๊ฑฐํ•˜๊ณ  swc๋กœ ์ปดํŒŒ์ผ๋Ÿฌ ๊ต์ฒด
    • esm, cjs ๋‘ ๋ชจ๋“ˆ๋ง์„ ์ง€์›ํ•˜๊ธฐ ์œ„ํ•œ ์ž‘์—… ์ง„ํ–‰
    • ๋ชจ๋…ธ๋ ˆํฌ์—์„œ ๊ฐ ํŒจํ‚ค์ง€๋“ค์˜ hmr์„ ์ง€์›
  • Trunk Based Development ๊ตฌํ˜„ํ•˜๊ธฐ ์œ„ํ•œ ์ผ๋“ค์„ ์ง„ํ–‰
    • yarn2 + ultra-runner๋ฅผ ์‚ฌ์šฉํ•œ ์ดˆ๊ธฐ ๋ชจ๋…ธ๋ ˆํฌ ์…‹์—…
    • pnpm + turbo๋ฅผ ํ†ตํ•œ ๋ชจ๋…ธ๋ ˆํฌ ๊ฐœ์„ 
    • PR ๊ฒ€์ฆ๊ณผ ํ”„๋กœ๋•ํŠธ ๋ฐฐํฌ๋ฅผ ์œ„ํ•œ CI&CD ์ž‘์„ฑ
    • ๋นŒ๋“œ ์บ์‹ฑ์„ ํ†ตํ•ด ๋ฐฐํฌ ์†๋„ ๋Œ€ํญ ๊ฐœ์„ 
    • ๋ชจ๋…ธ๋ ˆํฌ๋กœ ์ธํ•œ ๊ฐ์ข… ๋นŒ๋“œ ์ด์Šˆ ํ•ด๊ฒฐ
    • ๋ฐฐํฌ ํ”„๋กœ์„ธ์Šค ์ •์˜
  • ํ…Œ์ŠคํŠธ ์ฝ”๋“œ ์ž‘์„ฑ
    • ์ปค๋ฒ„๋ฆฌ์ง€ 80%๋ฅผ ๋ชฉํ‘œ๋กœ ์œ ๋‹›ํ…Œ์ŠคํŠธ ์ž‘์„ฑ
    • E2E ํ…Œ์ŠคํŠธ๋ฅผ ์œ„ํ•ด Cypress๋ฅผ ์…‹์—…ํ•˜๊ณ  QA Engineer ์˜จ๋ณด๋”ฉ ์ง„ํ–‰
    • ์Šคํ‚ค๋งˆ๋ฅผ ํ†ตํ•ด ๋ชฉ ๋ฐ์ดํ„ฐ ์ƒ์„ฑ๊ธฐ, msw ์ฝ”๋“œ๋ฅผ ์ž๋™์œผ๋กœ ์ƒ์„ฑํ•ด ์œ ๋‹› ํ…Œ์ŠคํŠธ, ์Šคํ† ๋ฆฌ๋ถ์— ํ™œ์šฉ
  • ์‚ฌ๋‚ด ๋ฐฑ์˜คํ”ผ์Šค ๊ตฌํ˜„
    • ๊ณต์šฉ ์ปดํฌ๋„ŒํŠธ, ๋กœ์ง, ์ปจ๋ฒ„ํ„ฐ ์ž‘์„ฑ ํ›„ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋กœ ๋ง์•„์„œ ๋ฐฐํฌ
    • ์–ด๋“œ๋ฏผ ๋ฐ์ดํ„ฐ๊ทธ๋ฆฌ๋“œ, ๊ณตํ†ต ํ•„ํ„ฐ ๊ตฌํ˜„ ์ŠคํŽ™ ๋…ผ์˜
  • ๊ธฐ์กด ์ฝ”๋“œ๋ฆฌ๋ทฐ ๋ฐฉ๋ฒ•์„ ๋ณด์™„ํ•˜๊ธฐ ์œ„ํ•ด Graphite๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ Stacked Changes ๋ฐฉ๋ฒ•์„ ํŒ€๋‚ด ์ „ํŒŒ
  • 3๊ฐœ์›” ์ •๋„ ๋ฏธ๊ตญ ์ง€์‚ฌ์—์„œ ์˜์–ด๊ถŒ ์—”์ง€๋‹ˆ์–ด๋“ค๊ณผ ํ˜‘์—…
  • ์†Œ์ˆ˜ ์˜คํ”ˆ์†Œ์Šค ํ”„๋กœ์ ํŠธ ๊ธฐ์—ฌ (Pbkit, Storybook ๋“ฑ)
  • ๋‹ค์ˆ˜ ์›น๋ทฐ ํ”„๋กœ๋•ํŠธ MVP ๊ตฌํ˜„ ๋ฐ ์œ ์ง€๋ณด์ˆ˜
  • CLI ํˆด๋ง ์ž‘์„ฑ (์ฝ”๋“œ ๋งˆ์ด๊ทธ๋ ˆ์ด์…˜, ์ปดํฌ๋„ŒํŠธ ์ฝ”๋“œ ์ƒ์„ฑ ๋“ฑ)

ํด๋ž˜์Šค101 (2019.03 ~ 2020.06)

์†Œํ”„ํŠธ์›จ์–ด ์—”์ง€๋‹ˆ์–ด

  • ์ปค๋จธ์Šค ์…€

    • ํผ๋„ ์ค„์ด๊ธฐ A/B ํ…Œ์ŠคํŠธ๋ฅผ ํ†ตํ•œ ๊ฒฐ์ œ ์ปจ๋ฒ„์ „ 400% ๊ฐœ์„ 
    • ์ฟ ํฐ ๋ฐ ๊ตฌ์„ฑํ’ˆ ์„ ํƒ UX ๊ฐœ์„ 
    • ๋ฐฐ์†ก ์ถ”์  UX ๊ฐœ์„ 
    • ์ปค๋จธ์Šค ๋„๋ฉ”์ธ ๋ ˆ๊ฑฐ์‹œ ๋Œ€์‘
    • ๊ฐ์ข… ๊ฒฐ์ œ, ๋ฐฐ์†ก ์—๋Ÿฌ ํŠธ๋Ÿฌ๋ธ” ์ŠˆํŒ…
  • ํ”„๋ก ํŠธ์—”๋“œ ์ฑ•ํ„ฐ DRI

    • Class101 CSR ํ”„๋กœ์ ํŠธ๋ฅผ SSR์„ ์ง€์›ํ•˜๋„๋ก ๋ณ€๊ฒฝ
    • SEO ์ตœ์ ํ™”๋ฅผ ์œ„ํ•ด ๋ฉ”ํƒ€ํƒœ๊ทธ, ์‚ฌ์ดํŠธ๋งต, ์Šคํ‚ค๋งˆ ๋“ฑ์„ ์„ธํŒ…
    • ์„œ๋ฒ„๋ฆฌ์Šค ์ด๋ฏธ์ง€ ์••์ถ• ์„œ๋น„์Šค์—์„œ ๋‹ค์–‘ํ•œ ํฌ๋ฉง(webp, png, jpg)์„ ์ง€์›ํ•˜๋„๋ก ๋ณ€๊ฒฝ
    • ์Šคํฌ๋ฆฐ ํฌ๊ธฐ์— ๋”ฐ๋ฅธ ๋ฐ˜์‘ํ˜• ์ด๋ฏธ์ง€ ์ตœ์ ํ™”๋กœ ์ด๋ฏธ์ง€ ๋ฆฌ์†Œ์Šค ์šฉ๋Ÿ‰์„ 82% ์ ˆ๊ฐ
    • 50mb ~ 100mb ๋‹จ์œ„๋กœ JS ์ฒญํฌ ์Šคํ”Œ๋ฆฌํŒ… ์ ์šฉ
    • ์‚ฌ์ดํŠธ ์ด ๋ฆฌ์†Œ์Šค๋ฅผ 25.8mb์—์„œ 11.4mb๋กœ 55% ์ ˆ๊ฐ
    • ๋ธŒ๋ผ์šฐ์ €, ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋ Œ๋”๋ง ์ตœ์ ํ™”๋กœ ๋…ธํŠธ8 ๊ธฐ์ค€ TTI๋ฅผ 158์ดˆ -> 21์ดˆ๋กœ ์ ˆ๊ฐ
    • ์ธํ”ผ๋‹ˆํ‹ฐ ์Šคํฌ๋กค ๊ฐœ์„  ๋ฐ ๊ด€์„ฑ ์Šคํฌ๋กค ์ ์šฉํ•ด ์Šคํฌ๋กค UX ์ตœ์ ํ™”
    • ์„ผํŠธ๋ฆฌ, ์Šฌ๋ž™์„ ํ†ตํ•œ ์—๋Ÿฌ ๋ชจ๋‹ˆํ„ฐ๋ง ์…‹์—…
    • ์–ด๋“œ๋ฏผ ๊ณตํ†ต ํ•„ํ„ฐ, ํ…Œ์ด๋ธ” ์ถ”์ƒํ™”
    • ์•Œ๋ฆผ ์„œ๋ฒ„ ๊ฐœ์„  (๋ถ„๋‹น ์ตœ๋Œ€ ์ „์†ก ํšŸ์ˆ˜ 40๊ฐœ -> 20,000๊ฐœ)
    • ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์ž ์ฑ„์šฉ ๊ฐ€์ด๋“œ ๋ฌธ์„œ ์ œ์ž‘
    • ๊ธฐ์ˆ  ๋ธ”๋กœ๊ทธ ๊ฐœ๋ฐœ ๋ฐ ๊ณต์œ  ๋ฌธํ™” ์ „ํŒŒ
    • ๋ฆฌ์•กํŠธ ๋ชจ๋…ธ๋ ˆํฌ ํ”„๋กœ์ ํŠธ ์—๋Ÿฌ ํ•ธ๋“ค๋ง
    • Graphql Apollo ๊ตฌ์กฐ ์„ค๊ณ„ ๋ฐ ํŠธ๋Ÿฌ๋ธ” ์ŠˆํŒ…

๋…ธ๋ฃจ (2018.03 ~ 2019.03)

ํ”„๋ก ํŠธ์—”๋“œ ํ”„๋กœ๊ทธ๋ž˜๋จธ

  • ๋‹ค์–‘ํ•œ ์ฐจํŠธ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ํ™œ์šฉํ•ด ๋ฐ์ดํ„ฐ ์‹œ๊ฐํ™” ์ž‘์—… (์˜คํ”ˆ์†Œ์Šค ์ปจํŠธ๋ฆฌ๋ทฐ์…˜)
  • ์‹ฌํ”Œํ•œ ์†Œ์Šค์ฝ”๋“œ ๊ด€๋ฆฌ์ž ์„ค๊ณ„ (Diff, Versioning ๋“ฑ)
  • RxJS์˜ ์‚ฌ์šฉํ•˜์—ฌ ์ŠคํŠธ๋ฆผ ๊ธฐ๋ฐ˜์˜ ๋ฐ˜์‘ํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ์— ๋Œ€ํ•ด ๊ณ ๋ฏผํ•˜์˜€์Œ.
  • WebRTC๋ฅผ ์ด์šฉํ•œ ์–‘๋ฐฉํ–ฅ ์˜์ƒ ํ†ต์‹  ๊ตฌํ˜„
  • Gatsby + Bulma ๋ฅผ ํ†ตํ•ด ํšŒ์‚ฌ ์†Œ๊ฐœ ์‚ฌ์ดํŠธ ๊ตฌ์ถ•

ํ”„๋ก ํŠธ์—”๋“œ ํ”„๋กœ๊ทธ๋ž˜๋จธ

  • ํ˜ธํ…”, ์•กํ‹ฐ๋น„ํ‹ฐ ์„œ๋น„์Šค ์•„ํ‚คํ…์ณ ์„ค๊ณ„
  • ์—ฌํ–‰ ์˜ฌ์ธ์› ์ปค๋จธ์Šค ๊ฐœ๋ฐœ

๐ŸŽจ Contributions

  • Pbkit, Storybook, Toolbelt, Tui Chart, Hexo Minos

๐Ÿš€ Projects

๐Ÿ”— Links

Site Link
Blog https://ddalpange.github.io
Email [email protected]
Github https://github.com/ddalpange

Yohan Kim's Projects

circuit-ui icon circuit-ui

Design system & component library for SumUp web apps

deploy-to-vercel-action icon deploy-to-vercel-action

๐ŸŽฌโ–ฒ Deploy your project to Vercel using GitHub Actions. Supports PR previews and GitHub deployments.

emotion icon emotion

๐Ÿ‘ฉโ€๐ŸŽค CSS-in-JS library designed for high performance style composition

grow-loader icon grow-loader

A webpack loader to split class methods by decorators

kkutu icon kkutu

๊ธ€์ž๋กœ ๋†€์ž! ๋„ํˆฌ ์˜จ๋ผ์ธ

material-ui icon material-ui

Material-UI is a simple and customizable component library to build faster, beautiful, and more accessible React applications. Follow your own design system, or start with Material Design.

ngx-admin icon ngx-admin

Admin dashboard template based on Angular 5+, Bootstrap 4 (previously known as ng2-admin)

pbkit icon pbkit

protobuf toolkit for typescript and others

razzle icon razzle

โœจ Create server-rendered universal JavaScript applications with no configuration

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.