나중에 정리

Airbnb JavaScript Style Guide
https://github.com/airbnb/javascript#functions–signature-invocation-indentation

Articles
프로그레시브 웹 앱스(Progressive Web Apps, PWA)를 이해하기 위한 신기술들
JTBC 2018년 상반기 결산
Kakao Dev 2018 100일간의 모션 디자인

NodeJS
A MEAN Blog 블로그 Heroku :: Mongodb 사용

Javascript
애니메이션 정지와 큐
Currying Hello World!
React ES6 Components
리액트와 뷰로 같은 앱을 만들어 보았다 Vanilla JavaScript Slider Javascript에서의 include Get url parameter jquery Or How to Get Query String Values In js How to get the value from the GET parameters?

Css
Using Flexbox: Mixing Old and New for the Best Browser Support
Pure CSS for multiline truncation with ellipsis
8 SIMPLE CSS3 TRANSITIONS THAT WILL WOW YOUR USERS
word-break 속성과 word-wrap 속성 알아보기
Battling BEM CSS

Tool Gitlab-CI 구성 & .gitlab-ci.yml 예제 How do I git pull -f learngitbranching

React Structure

https://reactjs.org/docs/faq-structure.html

https://medium.com/@FourwingsY/react-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8%EC%9D%98-%EB%94%94%EB%A0%89%ED%86%A0%EB%A6%AC-%EA%B5%AC%EC%A1%B0-bb183c0a426e

https://medium.com/@alexmngn/how-to-better-organize-your-react-applications-2fd3ea1920f1

https://hackernoon.com/the-100-correct-way-to-structure-a-react-app-or-why-theres-no-such-thing-3ede534ef1ed

https://daveceddia.com/react-project-structure/

https://blog.usejournal.com/folder-structure-in-react-apps-c2ae8974d21f

TEMP

2018년과 이후 JavaScript의 동향 – 브라우저 밖의 JavaScript
패키지 관리자 NPM
번들러와 빌드 도구 WEBPACK
https://d2.naver.com/helloworld/5644368

2018년과 이후 JavaScript의 동향 – 라이브러리와 프레임워크
React Vue Angular
https://d2.naver.com/helloworld/3259111

2018년과 이후 JavaScript의 동향 – JavaScript(ECMAScript)
브라우저의 ECMAScript 2015 지원율 증가
https://d2.naver.com/helloworld/7495331

React 적용 가이드 – 네이버 메일 모바일 웹 적용기
https://d2.naver.com/helloworld/4966453
기존의 네이버 메일 모바일 웹은 로딩 시간을 줄이기 위해 초기 페이지 렌더링은 서버에서 JSP로 진행하고 이후 동작은 AJAX 통신으로 동작하는 SPA(single page app)였다. 그렇기 때문에 페이지를 그리는 로직이 JSP 파일과 JavaScript 파일에 중복으로 존재하는 경우가 많았다. 결국 마크업이 변경되면 JSP 코드와 JavaScript 코드를 변경하는 이중 작업을 진행해야 했다.
더불어 JavaScript 코드는 DOM(document object model) 요소를 가져와 변경하는 작업이 대부분이었는데 뷰와 로직이 분리되지 못한 상황이었다. 그래서 마크업의 변경은 JavaScript 코드의 대부분을 수정해야 함을 의미했다.
결국 전체 마크업이 변경되는 상황에서는 프런트엔드를 새로 작성하는 편이 빠르겠다는 결론에 도달했다. 그리고 새로운 프레임워크와 라이브러리를 사용해 보고 싶다는 개발자로서의 욕구도 컸다.

WEBPACK
https://d2.naver.com/helloworld/0239818
편리한 모듈 의존성 관리
로더를 활용한 다양한 리소스의 효율적인 활용
빠른 컴파일 속도
잘 정리된 문서(http://webpack.github.io/docs/)

배민찬은 Vue를 어떻게 사용하나요?
http://woowabros.github.io/experience/2018/06/07/vue-story-of-baminchan.html
컴포넌트 재사용
레거시의 가장 큰 문제는 코드의 중복! 하나의 코드로 다양한 디바이스에 동작하는 반응형 웹과는 달리, 배민찬은 디바이스별로 파일을 작성해야 하는 일반적인 웹이다.

우린 Git-flow를 사용하고 있어요
http://woowabros.github.io/experience/2017/10/30/baemin-mobile-git-branch-strategy.html

카카오스토리 팀의 코드 리뷰 도입 사례 – 코드 리뷰, 어디까지 해봤니?
http://tech.kakao.com/2016/02/04/code-review/

GitHub, Bitbucket Pull Request 활용기

GitHub, Bitbucket Pull Request 활용기

재사용 UI 컴포넌트 설계

재사용 UI 컴포넌트 설계

ES6 기반 프론트엔드 개발 환경 알아보기

ES6 기반 프론트엔드 개발 환경 알아보기

Front-end 개발의 괜찮은 선택 ES6 & ReactJS

Front-end 개발의 괜찮은 선택 ES6 & ReactJS

ES6, Webpack으로 트렌디한 웹 개발환경 만들기
http://tmondev.blog.me/220778720651

Git, 가장 쉽게 사용하기 – (1) 심플함이 답이다
http://tmondev.blog.me/220759303637
git은 전 세계에서 가장 많이 사용되는 형상관리 tool이다

서서히 죽어가는 Internet Explorer와 점진적 향상의 미래
https://github.com/nhnent/fe.javascript/wiki/May-21—May-25,-2018

https://github.com/nhnent/fe.javascript/wiki/October-17—October-21,-2016
이때 몇몇 컴포넌트는 렌더링 되지 않아도 되거나 (A), 어떤 조건에서만 렌더링 되면 되는 경우(B)가 있다. 이 부분이 바로 최적화 포인트이다.
가장 간단한 예를 들어보면 (A)는 마크업만 포함하는 컴포넌트를 들 수 있다.
반복적인 목록을 렌더링하는 경우 (B) 최적화는 큰 도움이 될 수 있다.

Web Developer Roadmap
https://github.com/kamranahmedse/developer-roadmap