과거의 웹 개발과 프론트엔드 개발자의 등장

과거 웹 개발의 경우 주로 서버에서 HTML을 생성해 클라이언트(브라우저)에 전달하고, 렌더링하는 방식이 주를 이루었다. 당시에는 단순한 정보전달의 문서형식의 웹 사이트가 많았고 이는 j-Query나 JavaScript로도 충분히 구현 가능했기에 프론트엔드 개발자라는 개념이 없이 백엔드 개발자가 모든 것을 처리하고는 했다.

하지만 시간이 지나면서 스마트폰, 태블릿PC 등 다양한 디바이스가 등장했고 웹의 역할이 단순히 정적인 정보를 전달하는 것을 넘어서 사용자와의 상호작용으로 확대되었다. 이를 이전 웹의 역할과 구분하기위해 웹사이트가 아닌 웹앱이라고 표현하기 시작했다.

이러한 웹앱은 대표적으로 G-mail이나 Facebook를 떠올릴 수 있다. 닉네임 변경이나 댓글 수정 등의 이벤트가 발생할 경우 화면 또한 실시간으로 반영되어야 할 뿐 아니라 반응형 웹과 크로스 브라우저 호환성 또한 필수적이라 할 수 있어 이를 담당하는 프론트엔드 개발자의 개념이 생기기 시작했다.

웹앱의 특징으로 다루는 데이터가 매우 방대하다는 것, 그리고 데이터가 실시간으로 업데이트되는 되는데 이를 화면에 실시간으로 반영해야 한다는 것. 하지만 기존의 j-Query나 Javascript 만으로 구현에 한계가 있기 때문에 클라이언트에서 따로 데이터를 받아 관리하고, 데이터가 바뀔때 이를 화면에 빠르고 직관적이게 표현할 수 있는 SPA 방식이 등장했다.

SPA (Single Page Application)

SPA는 웹앱(Web Application)의 중요한 구현 방식 중 하나로, 더 빠르고 매끄러운 사용자 경험을 제공한다. 사용자는 전체 페이지를 새로 고치지 않고, 필요한 데이터만 동적으로 로딩하여 페이지를 전환하는 경험을 할 수 있으며, 이로 인해 반응 속도가 빨라지고, 사용자는 앱처럼 부드럽게 웹을 사용할 수 있다. SPA를 구현하는 주요 기술로는 React, Vue, Angular, Svelte 등이 있으며, 이들은 클라이언트 측에서 데이터를 처리하고 화면을 갱신하는 역할을 담당한다.

프론트엔드 대세 React, 백엔드 대세 Java?

React의 장점과 단점

위 언급한 주요 기술들 중 현재 한국에서 대세인 것은 React라고 할 수 있을 것이다. 컴포넌트 기반의 구조, 가상 DOM, 상태관리 등에서 뛰어난 성능을 제공한다고 볼 수 있고, 유지보수성과 확장성을 높여주기에 많은 프론트엔드 개발자들이 사용하는 추세이다. 또한 또한, 페이스북, Instagram, WhatsApp과 같은 대형 플랫폼에서도 사용되고 있기 때문에, 생태계가 매우 활발하고 이로인한 신뢰성과 지속적이 발전 가능성이 있다고 볼 수 있다.

특히 React Native를 통해 모바일 애플리케이션 개발에도 강력한 입지를 다졌고, 웹과 모바일 애플리케이션을 모두 관리할 수 있는 통합적인 기술 스택을 제공한다.

물론 React는 JavaScript이고 기존의 화면을 구성하고 동작을 추가해왔던 개발 방식과 달리 데이터를 중심으로 움직이기 때문에 즉, 데이터가 바뀌면 화면이 바뀌는 방식으로 개발하기 때문에

검책노출문제나 SEO 최적화 등의 단점도 있지만 이는 SSR 기술을 활용해 해결할 수 있고 React는 Next.js와 같은 도구를 통해 SSR을 지원하기에 SEO최적화 및 초기 로딩 성능을 개선할 수 있다.

이외에도 React는 러닝커브가 높은 편이고 복잡한 상태 관리와 같은 문제들도 일부 단점으로 작용할 수 있으나 React의 강력한 커뮤니티와 다양한 라이브러리 덕분에 이러한 문제들은 점차 개선되고 있으며, 사용자 경험과 개발 효율성을 높이는 방향으로 발전하고 있다.