2024년, FE 개발자들은 어떤 일들을 할까?

내가 나눠본 FE 개발의 분야들

a month ago

19 min read

원문 : https://ghoon99-dev.tistory.com/7

웹 서비스 개발 과정에서 프론트엔드 개발이라는 역할이 생긴 지 그리 오래되지 않았다.

초기에는 간단한 웹 문서를 보여주는 수준에서 시작하여,

이제는 거대한 애플리케이션을 개발하는 단계까지 많은 발전을 거쳤다.

프론트엔드의 발전과정에 대한 좋은 글이 있어 남겨둔다.

시니어 개발자가 말하는, 프론트엔드 역사와 미래 | 요즘IT

위 글에서도 언급하듯이 이렇게 최근에는 간단한 문서를 넘어 다양한 웹 서비스가 등장했고,

React, Node 등의 프론트엔드 생태계도 크게 성장하고 있다.

이에 따라 프론트엔드 개발 분야도 복잡해지고 세분화되고 있다.

2024년 글을 작성하는 지금,

기업에서 필요로 하는 프론트엔드 개발자들의 역할을

명확히 이해하는 것이 필요하다고 생각하게 되었다.

그래서 나의 경험과 여러 채용 공고를 통해

프론트엔드 개발의 세부 역할을 나름대로 분류하였다.

이 글은 주관적인 분류로, 공신력을 띄는 것은 아니다.

"이런 것들이 있구나" 하고 참고용으로 재미있게 봐주었으면 좋겠다.

주로 IT 서비스 회사 내 백엔드(서버 개발)와 프론트엔드 역할이 명확히 분리된 조직을 기준으로 작성하였다.

또한 회사마다 세부 조직 구조와 팀 구성이 다를 수 있다.

어떤 회사에서는 언급할 팀들이 모두 존재할 수 있고,

다른 회사에서는 한 명의 프론트엔드 개발자가 여러 역할을 동시에 수행할 수도 있다.

소개하는 팀의 이름이 같아도 조금씩 다른 방향성을 띨 수도 있다는 점도 알아두길 바란다.

: 주의 :
이 글에서 소개된 채용공고나 팀의 소개 글 중
이미 마감/비공개된 채용공고, 현재는 사내에서 변경된 조직이 있을 수 있으나,
해당 역할에 대한 부가 설명을 위해 첨부한 것을 알림

External vs Internal Product

처음 개발을 배우거나 취업 준비 중일 때는, 개발자가 직접 사용자가 볼 수 있는 서비스만 다루는 줄 알았다.

그러나 실제로 업무를 해보니,

회사의 서비스를 관리하거나 내부 직원들이 사용하는 프로그램을 개발하는 일도

중요한 부분임을 알게 되었다.

그래서 프론트엔드 개발의 역할을 크게, External Product와 Internal Product로 구분해 보았다.

External Product

일반 사용자(B2C)나 기업 고객(B2B)을 위한, 우리가 일반적으로 흔히 접하는 SW 서비스의 형태이다.

웹 사이트, 모바일 애플리케이션, 웹뷰, SDK 개발, 데스크톱 애플리케이션 등 이 포함된다.

또한 그로스(Growth) 팀을 통해 데이터를 기반으로 한

사용자 경험 개선과 전환율 최적화, A/B 테스트 같은 작업을 담당하는 역할도

External Product의 범주에 두었다.

Internal Product

회사 내부 직원들이 업무를 효율적으로 수행할 수 있도록 돕는 프로그램들로,

어드민 페이지, 사내 관리 도구, 프론트엔드 인프라 관리 및 사내 패키지 개발 등 이 포함된다.

여기에는 디자인 시스템과 유틸리티 패키지 등을 포함한 더 나은 개발 환경을 지원하는 작업도 포함된다.

이처럼 프론트엔드 개발자의 작업 범위를

외부 사용자를 위한 제품과 내부 사용자를 위한 제품이라는 두 가지 큰 분류로 나누었다.

External Product - Product Team

External Product에서 Product Team은 우리가 흔히 떠올리는 사용자 중심의 서비스 개발을 담당한다.

이 팀은 회사의 주요 기능들을 사용자에게 제공하기 위한 개발을 책임지며,

웹, 웹뷰, 모바일 애플리케이션에 걸쳐 서비스의 핵심 기능을 제작한다.

Web

주로 SaaS 서비스(B2B, B2C), 커머스, 커뮤니티, 에디터 등 다양한 웹 서비스를 개발한다.
일반 사용자에게는 보이지 않지만 기업 고객(주문 정산 시스템 등)을 위한 웹 서비스도 개발한다.

Webview

취준생 시절 앱 중심 회사인데 웹 프론트엔드 개발자를 채용하는 이유를 몰랐다.
알고 보니 앱 내부에 웹 페이지를 띄우고 있어 웹 프론트엔드 기술이 필요했던 것이다.
웹뷰는 네이티브 앱(AOS, IOS) 안에 웹 페이지를 띄우는 기술로, 네이티브와 웹의 장점을 혼합한 환경을 제공한다.
네이티브 브릿지 통신이나 스택 관리, 탭 간 동기화와 같은 기술을 활용해 앱과 웹 간의 상호작용을 다룬다.
단순 웹 개발과는 또 다른 독특한 개발 경험을 제공한다.

https://devblog.kakaostyle.com/ko/2022-10-12-1-sync-data-between-activities/

FEConf 2023 [A4] 이벤트 기반 웹뷰 프레임워크 설계와 플러그인 생태계 만들기

Mobile (React Native)

모바일 앱 개발 또한 프론트엔드 개발자들이 참여하는 경우가 많다.
React와 일부 네이티브 지식을 결합하여 하이브리드 앱을 개발할 수 있는 React Native를 활용한다.
웹과 모바일 앱 간의 코드 재사용성을 높이고, 빠르게 모바일 환경에 대응할 수 있는 장점이 있다.

- 관련 자료

토스가 꿈꾸는 React Native 기술의 미래

배민도 React Native 해요?: 웹개발자들이 만들어 나가는 배민커넥트앱 이야기 #우아콘2023 #우아한형제들

External Product - Growth Team

https://www.wanted.co.kr/wd/223683

https://www.wanted.co.kr/wd/222278

Growth Team은 서비스를 지속적으로 성장시키기 위해 데이터 기반의 개발과 분석을 담당하는 팀으로,

프론트엔드 개발자도 이를 위한 다양한 기술을 활용하게 된다.

고객 데이터와 피드백을 기반으로 빠른 가설 검증을 통해 제품 성장을 가속화하며,

이를 통해 사용자 경험을 개선하고 제품의 전환율과 참여율을 높이는 것이 핵심 목표다.

애널리틱스 지표 수집

사용자 행동 패턴을 분석하기 위해 Google Analytics, Mixpanel 같은 분석 도구를 사용하여 다양한 지표를 수집하고 해석한다.
사용자 이벤트를 추적하고 데이터를 수집하는 코드를 작성해, 사용자 경험을 개선할 수 있는 방향성을 도출한다.

A/B 테스트