[테크 콘서트] TECH CONCERT: FRONT END 2019 - 빠르게 훑어보는 웹 개발 트렌드를 보고

웹 개발 환경은 하루가 다르게 바뀌고 있고, 공부만 할게 아니라 트렌드에 대해 알아보는 점도 필요하다고 생각했다.

현재 코드스쿼드에서 사람들과 함께 어울리며, 바닐라 자바스크립트에만 집중하고 있다는 생각이 들었다.

물론 기본 기술이 중요하긴 하지만 이전 직장에서의 환경도 그렇고 일명 삼대장이라고 불리는 프론트엔드 프레임워크 또는 라이브러리를 튜토리얼 수준으로 밖에 경험해보지 못했기에 차후 학습을 위해 이러한 기술이 등장하게 된 상황을 이해하고 싶었다.

 

2년 전의 영상이었지만 기본적인 흐름을 파악하는데 도움이 됐다.

해당 세션의 발표자는 카카오페이의 개발자이며, 앵귤러 kr의 운영자인 한장현님이라고 한다.

 

유튜브 링크

https://www.youtube.com/watch?v=BXOH9b177ho&list=PLNg-YPBOtNLq3O2rW5kB2Q-bCg18uYOsL&index=1

 

발표자료 링크

www.slideshare.net/NaverEngineering/naver-tech-concertfe2019

주제

프론트엔드의 트렌드가 어떻게 변화하고 있는가

---

웹 개발 트렌드

서버 중심으로 개발 -> 클라이언트 중심으로 개발 -> 고도화

 

1. 서버 중심으로 개발 ~1998년
사용자가 요청한 화면을 서버에서 페이지 단위로 생성해서 제공, 자바스크립트의 역할이 낮음

 

2. 클라이언트 중심으로 개발
1999년 ~ 2009년이미 화면에 떠있는 페이지를 수정한다.
1999년에 Ajax가 공개
2006년에 DOM 조작에 혁신적인 편의성을 가져다 준 jQuery가 등장!
서버는 API 역할에 집중하게 됨.
클라이언트를 준비하고 추가로 필요한 데이터를 클라이언트가 서버에 요청,

 

3. 고도화 2010년 ~
비즈니스 로직을 작성하거나 웹으로 네이티브 앱을 만드는 시도 등 갈수록 프론트엔드 로직이 복잡해지면서 여러 라이브러리가 나오게 됨.

---

컴포넌트 기반 프레임워크, 라이브러리의 시대

앵귤러, 리액트, 뷰 등 컴포넌트 기반의 개발이 트렌드가 되었다.
분화되어 있지만 프레임워크 또는 라이브러리들의 대략적인 흐름은 같다.

---
| HTML
| 템플릿
|
| CSS
| 스타일       ------ >    js, css  -----> 브라우저 실행
|              빌드
| TS, JS       (바벨, 웹팩, 파셀...)
| 로직
---
|
---> 컴포넌트 (앵귤러, 리액트, 뷰)

빌드 과정에서 뷰처럼 css, js가 분리되거나 앵귤러처럼 하나로 빌드되는 경우가 있지만 결과적으로는 같은 흐름!

---

태스크 러너, CLI 사용

코드 관리, 빌드, 테스트, 배포 등 고민해야되는 사항이 갈수록 늘어남!
npm, webpack, mocha, node.js, lite-server, git 등..
angular-cli, create-react-app, vue cli 등 스프링 프로젝트처럼 프로젝트 환경 구성에 신경쓰지 않도록 도와주는 역할을 하는 cli가 등장하게 됨

---

공부하면 좋은 것들

1. 레이아웃 구성

HTML, HTML5

 

2. 스타일

CSS, CSS3, flex, grid, 스타일 라이브러리, 전처리기

 

3. 로직

자바스크립트, ES6, TS, 프레임워크

 

4. 디자인

UI, UX, 디자인 시스템, 데이터 시각화도!

---

요점 또는 조언?

1. 기술변화

프론트엔드의 트렌드는 지금도 변하고 있고, 많은 기술이 쏟아져 나오고 있다.
그러니까 신 기술이 나왔을 때 그걸 일찍 배우면 전문가가 될 수 있다!
물론 일년도 안돼서 사라지는 기술들이 많다.

 

2. 선택과 집중

스타트업이라면 여러 기술을 다 골고루하는게 좋겠지만 물리적인 시간의 한계가 있기 때문에 전문적인 분야를 선택해서 나아가는게 좋지 않을까?

 

3. 트렌드 파악

페이스북 커뮤니티나 컨퍼런스 등에 참여하거나 관련 뉴스 구독 등

---