byeonggyuCho / TIL

Today I Leaned

Today I Leaned, TIL

one day one commit.

Intro

프로그래머로서 성장의 기록을 이곳에 남긴다.
어느 개발자 블로그에서 봤던 이 말이 참 와닿는다.

배운 것을 기록할 것!
기록하는 과정은 기록의 가치 이상으로 의미있다.

내가 편하게 사용하는 단어와 표현으로 바꾸어 정리하는 작업은 '내 지식이다.'라는 느낌들게 한다.

SI프로젝트를 경험하면서 조금만 수정해도 실타래처럼 얽혀버리는 스파게티 소스를 수정하며
보기쉽고 견고한 프로그래밍에 대해 관심을 갖게되어 정리하기 시작했다.
기술을 탐독하며 이런 것들을 고민했다.

• 어떤 코드가 가독성이 좋은코드인지?
• 프로덕트 설계시 무엇을 고민해야 하는가?
• 쉬운 코드는 어떤 코드인지?
• 재사용성이 높은 코드는?
• 커뮤니케이션 비용이 적은 코드는?
• 이 기술의 탄생배경과 비교기술은?
• 디버깅 비용을 최소화하기 위해선?

이런 질문들은 새로운 기술과 API, 프레임워크의 사용과 탄생을 공감할 수 있게 했고 내가 어떤것에 관심이 많은지 뭘하고 싶은 개발자인지 구체화하는데 도움이 되었다.

주요 컨텐츠 소개

1. 도구 소개
2. 개념 정리 및 예제 정리.
3. 개발 관련 에세이(개발 일지)
4. 도서 리뷰

📌 목차

1.JavaScript

• arrow Function
• animation
• array
• ajax
• async await
• class
• closure
• currying
• event Loop
• evnet Bubbling
• excution Context
• function
• Generator
• Iterater
• json
• ptototype
• object
• promise
• scope
• server send evnet
• spead
• set map
• strictMode
• statement
• this
• Temporal Dead Zone
• runtime Evironment
• requestAnimationFrame
• new
• Prototype Ingerit
• DesignPattern-Adpter
• DesignPattern-Bilder
• DesignPattern-Module
• DesignPattern-Observer
• DesignPattern-sigletone
• DesignPattern-Factory

2.TypeScript

• basic type
• classes
• Functions
• interface
• generics
• Mix In
• Mapped Type
• type Inference
• type compatibility

3.React

• component
• css in js
• event binding
• Higher Order Component
• Key Property
• JSX
• flux
• functionalComponent
• middleware
• rendering
• redux
• redux with Hooks
• redux-thunk
• redux-saga
• Styled Component
• SetState
• Life Cycle
• Typescript with redux
• Hooks
• useEffect
• Optimization
• Pure Component
• Server side rendering
• 8Thing to Lean in ReactJS before using redux
• Virtual Dom
• why Redux?
• why Hooks?
• why redux-thunk?
• redux-saga test

4.Node.js

• intro
• express
• koa
• gulp
• module

5.HTML/CSS

• web Storage
• Flex

6.Linux

• Why Lisux is Better for Developer

7.NetWork

• Web Application Server
• CORS
• same origin policy
• REST API
• Clustering

8.Java

• ClassPart1
• ClassPart2
• ClassPart3
• MVC
• servlet
• JSP
• garbageCollection
• Maven
• Thread

9.Spring

• Annotaion
• Dispatcher Servlet
• Spring MVC
• DI
• AOP
• Bean

---

DataBase

1.Oracle

• dataBasePlanning
• dataIntegrity
• errorCode
• function
• jdbc
• join
• pagination
• procedure
• query_DCL
• query_DLL
• query_DML
• query_QL
• queryOptimization
• transaction
• trigger
• view

2.Mysql

• install

3.MongoDB

• intro

---

Tools

Webapck

• webpack

Jenkins

• What is Jenkins?
• How to link Project in Jenkins
• How to write Build Process in Jenkins

ETC

• Front-end Test Strategy
• Reactive Programming

설계

1. 어떤 도구를 사용할 것인가?
   • 유사 라이브러리중 선택한 이유
   • 명확한 도입 목적
2. 패턴과 구조의 장단점에 대한 이해
   • 맹목적으로 사용중인 패턴이나 구조가 있지는 않은지?
   • 장단점에 대해 이해하고 있는지?
3. 최적화.
   • 최적화를 위해 어떤 부분을 고민했는지?
   • 어떻게 해야 더 컴팩트한 앱을 만들 수 있는지?
   • 번들링 최적화를 위해 번들을 어떻게 나눌 것인지?
4. 대안
   • 다른 선택을 고민해본 적 있는지?(plane B)
   • 이런 방식의 접근방법은 어떻게 생각하는가?

관심분야

1. Javascript
   • Requestidlecallback
   • Web worker
   • Symbol
   • Atomics (ES7)
   • Proxy
   • Shared Array Buffer (ES7)
2. Typescript
   • pattern
3. React
   • next.js (SSR)
   • Material-UI
   • 아토믹 디자인
   • redux-observable
4. Mobile App
   • React-native
   • Web View
5. Style
   • Scss
6. 데이터 시각화
   • cavas, svg
   • d3
   • Threejs
7. Webpack
   • SSR
   • code spliting
8. Test
   • Jest/Enzyme 기반 TDD
   • Cypress를 통한 E2E 테스트
9. open source
   • library development
10. node.js
    • socket.io
11. Clean Code
12. Optimizing
    • PWA
    • 빌드 최적화
    • 렌더링
      • web workers
      • service workders
13. Soft Skill
    • UX를 고려한 설계
    • 프로그래머 소통(코드)
    • 서비스 품질 개선
14. Functional Programming
    • fungter
    • 모나드
    • Ramda.js
15. 협업 Tools
    • (이슈관리, JIRA, Confluence, 프로젝트 보드)
16. Web Assembly
17. GraphQL, Apollo
18. Kubernetes
19. Doker
20. StoryBook