아이티윌 K-디지털 기초역량훈련 온라인 센터

메뉴

이지채널

  • 웹 개발자가 알아야 할 2021년 최신 트랜드
  • 마스터 / 2021.03.26

본문은 유튜버 드림코딩by엘리님의 영상을 정리하면서 추가한 글로써, 자세한 내용은 하단의 영상을 참조해주세요.
 

 

깃헙의 놀라운 성장세와 의미 있는 수치들

  • 지난해 6천만개가 넘는 repository가 새로 생성되었고 약 35%의 증가세를 보였습니다.
  • 소스기여자는 25% 증가했으며, 머지하는데 걸리는 시간은 약 7시간정도 빨라졌다고 합니다.
  • 대기업 기준 72%의 기업이 깃헙을 이용하고 있는 것으로 집계되었습니다.
  • 많은 개발자들이 평일에는 회사일을 하고, 주말에는 오픈소스에 기여하는 것으로 나타났습니다.

 


 

프로그램 언어별 성장세

  • 역시나 자바스크립트가 부동의 1위입니다.
  • 자바와 파이썬이 엎치락 뒤치락하는 상황에서 자바스크립트의 문제를 보완하기 위한 타입스크립트가 급속도로 성장하였습니다.
  • 특히 대규모 프로젝트에서 자바스크립트의 문제점을 보완하기 위해 타입스크립트가 사용되어 지고 있습니다.

 



웹 프레임웍스

  • jquery는 자바스크립트관련 프레임워스에서 가장 오래된 프레임언어 이기 때문에 사실상 React가 1위라 볼 수 있습니다.
  • 스테이트 관리를 위해 리엑트 훜이 가장 많이 사용됩니다.
  • 리액트훅 덕분에 리덕스처럼 복잡하고 코드도 많이 짤 필요 없이, 깔끔하게 스테이트를 관리가 가능합니다.
  • 리액트, 앵귤러, 뷰js 등을 중심으로 웹프레임웍스가 발전하고 있는 가운데, 최근 컨포넌트 프레임웍스 중에 하나인 Svelte가 뜨고 있습니다.
  • Svelte는 리액트, 앵귤러, 뷰js의 VDOM과 달리 필요한 DOM요소를 미리 만들어 놓아 성능을 끌어 올릴 수 있다라는 장점이 있어 눈여겨 볼 필요가 있습니다.

 



자바런타임환경

  • 브라우저 위에서 동적인 프로그래밍이 가능하도록 만들어진 자바스크립트는 자바런타임환경에서 구동됩니다.
  • 최근 자바런타임환경은 브라우저 밖에서도 사용되고 있는데 대표적으로 nodejs가 있습니다.
  • 그리고 그런 node.js의 단점을 보완하기 위해 나타난 Deno가 최근 이슈로 뜨고 있으니 이 부분도 확인이 필요합니다.

 



No Code & Less Code

  • No Code & Less Code 라는 개발페러다임이 최근 뜨고 있습니다.
  • 해당 페러다임은 원하는 UI 컴포넌트를 여기저기 가져와서 쉽게 만들수있는 개발 페러다임입니다.
  • 대표적으로 Bubble과 Airtable 등이 있고 점차 뜨고 있긴 하지만 아직 걸음마 단계 입니다.
  • 만약 이러한 개발패러다임이 고도화 될 경우, 개발자들은 어떻게 될까요? (강한자만이 살아 남겠죠..)

 



Serverless 개발

  • AWS, 구글 등 다양한 클라우드와 서버리스 업체들이 생겨나고 있는 가운데,  그중 Netlify, Vercel 등의 서버리스를 중점적으로 제공해주는 Serverless 프로바이더들이 성장하고 있습니다.
  • 특히 클라우드는 서버리스가 미래라고 까지 말하고 있는 상황을 고려 한다면 이런 환경에 대한 공부를 하는 것도 나쁘지 않을꺼 같습니다.

 



JAM 스택

  • JAMstack 이란..? (추가 자료 링크)
  • 잼스택은 서버가 없이 그리고 백앤드의 지식이 없어도 풀스택을 구현할 수 있게 도와주는 프레임웍스 입니다.
  • 잼스택은 자바스크립트, APIs, 마크업으로 구성되어 있으며 자바스크립트로는 서버사이드 랜더링이 가능한 NextJS, Gastby가 많이 이용되고 있습니다.
  • APIs는 Headless CMS를 이용하여 간편하게 컨텐츠를 관리할 수 있도록 데이터베이스도 생성해주고 다양한 것들을 지원해주는 시스템을 이용합니다.
  • 그리고 마크업을 이용하여 프론트엔드를 구현할 수 있습니다.
  • 요즘 가장 핫한 트렌드 아닐까 합니다.

 



SPA와 PWA

  • SPA(Single Page Application)와 함께 뜨고 있는 것이 바로 PWA (Progressive Web Apps)
  • PWA는 웹기술을 이용해서 만든 웹 어플리케이션을 모바일프로그래밍을 전혀 필요로 하지 않고 웹어플리케이션 자체를 모바일에 다운로드 받아서 모바일에 관련된 다양한 API를 이용할 수 있고 또 기기가 오프라인일 때도 끊임없이 어플리케이션을 사용할 수 있도록 지원해주는 솔루션을 말합니다.

 



웹어플리케이션 성능을 극한으로 끌어올릴 Web Assembly

  • Web Assembly가 있기 때문에 이제 C, C++, Rust와 같은 저 수준의 프로그램 언어로 웹어플리케이션을 만들 수 있게 되었습니다.
  • 이렇게 만들어진 웹어플리케이션은 폭발적인 성능을 보장하고 컴팩트한 바이너리 포맷을 제공해 주기 때문에 성능 좋은 웹어플리케이션을 만들수 있습니다.
  • 웹 어셈블리를 이용하는 어플리케이션중에는 고성능을 요하는 웹게임(MMORPG 같은)이 있을수 있고 대표적으로 웹디자이너들이 사용하고 있는 Figma를 꼽을 수 있습니다.
  • 사례를 보면 웹어셈블리를 이용하면 컨텐츠의 로딩속도를 3배 이상 향상시킬 수 있다고 합니다.

 



모션 디자인

  • 웹어플리케이션 성능을 극한으로 끌어올릴 Web Assembly 입니다.

 

출처: 드림코딩by엘리_ 2021 웹개발 트렌드






첨부파일