https://github.com/hg-pyun/articles
The easy-to-understand articles
https://github.com/hg-pyun/articles
articles documents guide
Last synced: 2 months ago
JSON representation
The easy-to-understand articles
- Host: GitHub
- URL: https://github.com/hg-pyun/articles
- Owner: hg-pyun
- Created: 2018-10-06T14:49:48.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2024-06-18T02:35:30.000Z (about 1 year ago)
- Last Synced: 2025-03-29T22:41:20.215Z (3 months ago)
- Topics: articles, documents, guide
- Homepage:
- Size: 212 KB
- Stars: 58
- Watchers: 4
- Forks: 3
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-list - articles - to-understand articles | hg-pyun | 32 | (Others)
README
# articles
The easy-to-understand articles.
## Javascript
#### ES5
- [자바스크립트는 왜 프로토타입을 선택했을까](https://medium.com/@limsungmook/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8%EB%8A%94-%EC%99%9C-%ED%94%84%EB%A1%9C%ED%86%A0%ED%83%80%EC%9E%85%EC%9D%84-%EC%84%A0%ED%83%9D%ED%96%88%EC%9D%84%EA%B9%8C-997f985adb42)
- [JavaScript 표준을 위한 움직임: CommonJS와 AMD](https://d2.naver.com/helloworld/12864)
- [RequireJS - AMD의 이해와 개발](https://d2.naver.com/helloworld/591319)
- [Scope의 이해](http://www.nextree.co.kr/p7363/)
- [쉽게 이해하는 자바스크립트 프로토타입 체인](https://meetup.toast.com/posts/104)
- [자바스크립트 함수 (1) - 함수 객체, 함수 객체 생성](https://meetup.toast.com/posts/118)
- [자바스크립트 함수 (2) - 함수 호출](https://meetup.toast.com/posts/123)
#### ES6+
- [Proxy](https://medium.com/@la.place/javascript-es6-proxy-da8ae2946dff)
- [Async-await](https://developers.google.com/web/fundamentals/primers/async-functions?hl=ko)
- [Optional Chaining](http://dev-momo.tistory.com/entry/Javascript-Optional-Chaining)
- [Javascript Iterator](http://dev-momo.tistory.com/entry/Javascript-Iterator?category=536788)
- [Async-wait는 어떻게 구현하는가](http://dev-momo.tistory.com/entry/Asyncawait%EB%8A%94-%EC%96%B4%EB%96%BB%EA%B2%8C-%EA%B5%AC%ED%98%84%ED%95%98%EB%8A%94%EA%B0%80-1)
- [ES6의 제너레이터를 사용한 비동기 프로그래밍](https://meetup.toast.com/posts/73)
- [Generator in Practice](https://meetup.toast.com/posts/93)
- [자바스크립트 프라미스: 소개](https://developers.google.com/web/fundamentals/primers/promises?hl=ko)
- [let과 const는 호이스팅 될까?](https://wonism.github.io/is-let-hoisted/)
#### React
- [Making Sense of React Hooks](https://medium.com/@dan_abramov/making-sense-of-react-hooks-fdbde8803889)
- [Redux Middleware, 비동기 작업](https://velopert.com/3401)
- [Redux-Saga: 사이드 이펙트 관리](https://meetup.toast.com/posts/136)
- [Redux-Saga: 제네레이터와 이펙트](https://meetup.toast.com/posts/140)
- [Redux-Saga: Channel](https://meetup.toast.com/posts/145)
- [Presentational and Container Components](https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0)
- [Mixins Considered Harmful](https://reactjs.org/blog/2016/07/13/mixins-considered-harmful.html)
- [React 렌더링과 성능 알아보기](https://meetup.toast.com/posts/110)
- [리액트의 Hooks 완벽 정복하기](https://velog.io/@velopert/react-hooks)
- [함수형 컴포넌트와 클래스, 어떤 차이가 존재할까?](https://overreacted.io/ko/how-are-function-components-different-from-classes/)
- [You Probably Don't Need Derived State](https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html)
- [Flux로의 카툰 안내서](https://bestalign.github.io/translation/cartoon-guide-to-flux/)
- [단단한 컴포넌트 부수기(feat. 조합, IoC)](https://brunch.co.kr/@finda/556)
- [Getting Closure on React Hooks by Shawn Wang | JSConf.Asia 2019](https://youtu.be/KJP1E-Y-xyo)
- [React Testing Library 사용법](https://www.daleseo.com/react-testing-library/)
- [Making setInterval Declarative with React Hooks](https://overreacted.io/making-setinterval-declarative-with-react-hooks/)
- [다른 사람들이 안 알려주는 리액트에서 Context API 잘 쓰는 방법](https://velog.io/@velopert/react-context-tutoria)
#### Engine
- [자바스크립트와 이벤트 루프](https://meetup.toast.com/posts/89)
- [최신 브라우저의 내부 살펴보기 1 - CPU, GPU, 메모리 그리고 다중 프로세스 아키텍처](https://d2.naver.com/helloworld/2922312)
- [최신 브라우저의 내부 살펴보기 2 - 내비게이션 과정에서 일어나는 일](https://d2.naver.com/helloworld/9274593)
- [최신 브라우저의 내부 살펴보기 3 - 렌더러 프로세스의 내부 동작](https://d2.naver.com/helloworld/5237120)
- [JavaScript 엔진 동작을 알아야 하는 이유](https://devtimothy.tistory.com/94)
- [Hidden Class](https://engineering.linecorp.com/ko/blog/v8-hidden-class/)
#### TypeScript
- [타입스크립트 조건부 타입 완벽 이해하기](https://inpa.tistory.com/entry/TS-%F0%9F%93%98-%ED%83%80%EC%9E%85%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%A1%B0%EA%B1%B4%EB%B6%80-%ED%83%80%EC%9E%85-%EC%99%84%EB%B2%BD-%EC%9D%B4%ED%95%B4%ED%95%98%EA%B8%B0)
#### Useful
- [100,000개의 아이템도 거뜬한 셀렉트박스 만들기](https://meetup.toast.com/posts/160)
- [Proxy와 가상 돔을 사용하여 나만의 프레임워크 만들기](https://meetup.toast.com/posts/158)
- [TDD와 Mocha](http://dev-momo.tistory.com/entry/TDD-Mocha-Javascript-Test-Framework)
- [이미지 필터 만들기](http://dev-momo.tistory.com/entry/Javascript-Image-Filter-%EB%A7%8C%EB%93%A4%EA%B8%B0?category=536788)
- [알아두면 쓸만한 크롬 콘솔 기능](http://dev-momo.tistory.com/entry/%EC%95%8C%EB%A7%88%EB%91%90%EB%A9%B4-%EC%93%B8%EB%A7%8C%ED%95%9C-Chrome-Console-%EA%B8%B0%EB%8A%A5?category=536788)
- [성능 좋은 웹 애니메이션과 인터렉션: 60 FPS 달성](https://github.com/codepink/codepink.github.com/wiki/%EC%84%B1%EB%8A%A5-%EC%A2%8B%EC%9D%80-%EC%9B%B9-%EC%95%A0%EB%8B%88%EB%A9%94%EC%9D%B4%EC%85%98%EA%B3%BC-%EC%9D%B8%ED%84%B0%EB%A0%89%EC%85%98:-60-FPS-%EB%8B%AC%EC%84%B1)
- [javascript-algorithms](https://github.com/trekhleb/javascript-algorithms/blob/master/README.ko-KR.md)
- [design-patterns-JS](https://github.com/fbeline/Design-Patterns-JS)
- [크롬 개발자 도구를 이용한 자바스크립트 디버깅](https://subicura.com/2018/02/14/javascript-debugging.html)
- [실용적인 프론트엔드 테스트 전략 (1)](https://meetup.toast.com/posts/174)
- [must-watch-javascript](https://github.com/AllThingsSmitty/must-watch-javascript)
- [Middleware Parttern TDD](http://blog.jeonghwan.net/series/2018/12/08/node-web-8_middleware.html)
- [프런트엔드 엔지니어를 위한 베지에 곡선(Bézier Curves)](https://blog.coderifleman.com/2017/01/02/bezier-curves-for-frontend-engineer-1/)
- [벨로퍼트와 함께하는 리액트 테스팅](https://velog.io/@velopert/series/react-testing)
- [트리 쉐이킹으로 자바스크립트 페이로드 줄이기](https://ui.toast.com/weekly-pick/ko_20180716)
- [Vanilla Javascript로 가상돔(VirtualDOM) 만들기](https://junilhwang.github.io/TIL/Javascript/Design/Vanilla-JS-Virtual-DOM/)
- [토스ㅣSLASH 21 - JavaScript Bundle Diet](https://www.youtube.com/watch?v=EP7g5R-7zwM)
- [type-challenges](https://github.com/type-challenges/type-challenges)
## HTML
- [tabindex 사용](https://developers.google.com/web/fundamentals/accessibility/focus/using-tabindex?hl=ko)
## CSS
- [CSS 애니메이션 성능 개선 방법](http://wit.nts-corp.com/2017/06/05/4571)
- [하드웨어 가속에 대한 이해와 적용](https://d2.naver.com/helloworld/2061385)
- [flexbox로 만들 수 있는 10가지 레이아웃](https://d2.naver.com/helloworld/8540176)
- [효율적인 다크 모드 구현을 위한 배경/전경 컨텍스트 기반의 컬러 팔레트 만들기 (feat. CSS variable)](https://xenosium.com/entry/8679/)
## Functional Programming
- [함수형 프로그래밍이란 무엇인가](https://medium.com/@jooyunghan/%ED%95%A8%EC%88%98%ED%98%95-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%B0%8D%EC%9D%B4%EB%9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80-fab4e960d263)
- [Currying Hello world](https://medium.com/@la.place/currying-hello-world-ce452b988f2b)
- [고차 함수](http://blog.jeonghwan.net/js/2017/04/03/high-order-function-in-javascript.html)
- [HOF란 무엇인가](http://dev-momo.tistory.com/entry/HigherOrder-Function-%EC%9D%B4%EB%9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80?category=536788)
- [FP in JS(자바스크립트로 접해보는 함수형 프로그래밍)](https://velog.io/@nakta/series/FP-in-JS)
- [소프트웨어 합성](https://tpgns.github.io/2018/04/28/composing-software-translation-epilogue/)
- [JS개발자는 아직도 모나드를 모르겠어요](https://overthecode.io/i-am-js-developer-and-still-dont-know-monad/)
## Server
- [서버리스 아키텍쳐(Serverless)란?](https://velopert.com/3543)
## Nodejs
- [Express Error Handling](http://dev-momo.tistory.com/entry/nodejs-error-handling?category=536788)
- [GraphQL 개념잡기](http://tech.kakao.com/2019/08/01/graphql-basic/)
## Docker
- [초보를 위한 도커 안내서 - 도커란 무엇인가](https://subicura.com/2017/01/19/docker-guide-for-beginners-1.html)
- [Docker Swarm을 이용한 쉽고 빠른 분산 서버 관리](https://subicura.com/2017/02/25/container-orchestration-with-docker-swarm.html)
- [쿠버네티스 안내서](https://subicura.com/k8s/guide/#%E1%84%80%E1%85%A1%E1%84%8B%E1%85%B5%E1%84%83%E1%85%B3)
## Design
- [Designing Websites for iPhone X](https://webkit.org/blog/7929/designing-websites-for-iphone-x/)
## iOS
- [공식문서 만으로 iOS 개발 배우기](https://sungdoo.dev/programming/start-ios-development-with-offical-docs/)
## Tools
#### Git
- [Write yourself a Git!](https://wyag.thb.lt/)
- [GitHub의 Merge, Squash and Merge, Rebase and Merge 정확히 이해하기](https://meetup.toast.com/posts/122)
- [좋은 git commit 메시지를 위한 영어 사전](https://blog.ull.im/engineering/2019/03/10/logs-on-git.html)
#### Terminal
- [초보자를 위한 Vim 입문서](https://www.joinc.co.kr/w/Site/Vim/Documents/UsedVim?fbclid=IwAR2IetQJRJHrslHuWtsU2Ga8sekYspZ_yssjcOEJte94QingTD-nM5QMUNA#AEN18)
- [macOS 초심자를 위한 터미널 공부 가이드](https://johngrib.github.io/wiki/my-mac-os-terminal/)
- [알아두면 도움되는 iTerm2 고급기능](https://medium.com/harrythegreat/%EC%95%8C%EC%95%84%EB%91%90%EB%A9%B4-%EB%8F%84%EC%9B%80%EB%90%98%EB%8A%94-iterm2-%EA%B3%A0%EA%B8%89%EA%B8%B0%EB%8A%A5-81a4cd81bab7)
## Network
- [HTTPS와 SSL 인증서](https://opentutorials.org/course/228/4894)
- [HTTP Cache](https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/http-caching?hl=ko)
- [캐시가 동작하는 아주 구체적인 원리](https://parksb.github.io/article/29.html?fbclid=IwAR26jjGWzxOeYhdUapBWMmZXOYhH-4kvIAcT1y8iIGKSv8WINbCaIZh2oxs_)
- [만화로 보는 DNS over HTTPS](http://hacks.mozilla.or.kr/2019/10/a-cartoon-intro-to-dns-over-https/)
## Security
- [Node.js에서의 프로토타입 오염 공격이란 무엇인가](https://blog.coderifleman.com/2019/07/19/prototype-pollution-attacks-in-nodejs/?fbclid=IwAR1-fvZGaG57zCeW53dK8IF3AAQA1tDfc6ZAQb4zS19BZGxkJ-AgbHr4Dco)
- [OAuth 2.0 대표 취약점과 보안 고려 사항 알아보기](https://meetup.toast.com/posts/105)
- [안전한 패스워드 저장](https://d2.naver.com/helloworld/318732)
## Compiler
- [Writing An Interpreter In Go](https://interpreterbook.com/)
- [the-super-tiny-compiler](https://git.io/compiler)
## Algorithm
- [geeksforgeeks](https://www.geeksforgeeks.org/)
- [Halting Problem](https://johngrib.github.io/wiki/halting-problem/)
## ETC
- [차이를 만드는 커리어 굴리기](https://speakerdeck.com/unbing/caireul-mandeuneun-keorieo-gulrigi)
- [첫 프리랜서 도전기](https://brunch.co.kr/@chickenmoim/5?fbclid=IwAR0fNzAa13FnHjjAIXaT13ezHhFlLLZLND3NDEa1O0NBck1tOYD4SuBpiyo)
- [Announcing the curl cookbook](https://catonmat.net/announcing-curl-cookbook)
- [사용자 중심적인 성능 측정항목](https://developers.google.com/web/fundamentals/performance/user-centric-performance-metrics?hl=ko)
- [How to Read Paper](https://web.stanford.edu/class/ee384m/Handouts/HowtoReadPaper.pdf)
- [Atlassian JIRA를 이용한 애자일 Scrum 프로젝트 관리](http://bcho.tistory.com/826)
- [VS CODE extension for FE](https://amati.io/2019/04/25/vs-code-extension-for-fe/?fbclid=IwAR0P-JnrQ7QKeQDK-TBo4IQFfu3i-VyfVOWLbTrT67ROVLZQd8VpTnePEfI)
- [구글의 디자인 윤리학자](https://brunch.co.kr/@cliche-cliche/61?fbclid=IwAR2m9WCwMaDz5NZ28RoXHBZ7h0vXB3d-ZICIRn1P1Dx74LaDW9N2kiD2K1g)
- [라이트하우스 6.0에서 바뀐 성능 지표변화](https://ui.toast.com/weekly-pick/ko_20200528/)
- [mobbin](https://mobbin.design)
- [wwit](https://wwit.design)
- [지원자도 회사를 평가합니다. 이렇게요.](https://brunch.co.kr/@goodgdg/142)
- [Learn Haskell by building a blog generator](https://lhbg-book.link/)
- [간단한 유틸 함수 NPM 라이브러리 배포해보기 (feat. TypeScript 지원, ESM 지원)](https://junghyeonsu.com/posts/deploy-simple-util-npm-library/)
- [Google Engineering Practices Documentation](https://google.github.io/eng-practices/)
- [발표의 정석](https://drive.google.com/file/d/1uQ5VOXBNk_Nf6V5JUXhKl2pHZY5N1wA4/view?pli=1)