Insight

웹에서 프레임워크가 필요한 이유

투비대원 2019. 11. 20. 15:07

최근 웹 UI 개발 환경에서 프레임워크라는 용어가 많이 등장한다. 이는 기존 개발환경에서도 많이 사용되던 용어로써 웹 UI 개발 환경에서도 프레임워크을 필요하게 되었다고 생각하는 게 맞다. 필자는 프레임워크란 무엇이고 왜 웹 UI 개발환경에서도 필요하게 되었는지에 대한 이야기를 하고자 한다.

프레임워크란?

개발자의 개발 경험이나 스타일에 따라 결과물(소스)의 형태가 다르다. 개인이 운영하는 시스템일 경우에는 큰 문제가 되지는 않지만 여러 사람이 공동작업을 진행할 경우 문제가 발생한다. 서로의 결과물을 공유하는 데 있어서 상대방의 스타일을 이해하는데 시간이 필요하며 개발 스킬의 차이가 클 경우 이해하기 힘든 경우도 발생한다. 이러한 문제를 해결하기 위해 개발 표준 가이드(명명 규칙, 스크립트 작성규칙, 디렉토리 구조 등)를 정의하고 표준에 맞춰 개발될 수 있도록 한다. 그리고 자주 사용되는 기능이나 사이트 전체와 관련된 기능(로그인, 세션관리, 권한관리 등)을 공통으로 관리하여 재사용성을 높일 수 있도록 한다.
프레임워크란 어플리케이션을 개발에 필요한 스크립트를 위에서 이야긴 것과 같은 관점에서 정리한 스크립트 모음이라고 할 수 있다. (로그인, 세션관리, 권한관리는 관리방법의 예시일 뿐 프레임워크에서 제공하는 기능을 이야기하는 것은 아니다.)
프레임워크는 구조화된 스크립트를 통해 개발자의 스크립트 패턴을 정형화 할 수 있도록 되어있으며 개발자가 반복적으로 해야 하는 공통부분을 최소화 할 수 있도록 설계되어있다. 이를 통해 개발자는 자신이 맡은 세부 업무개발에 집중할 수 있으며 개발표준 준수 및 개발품질 향상에 도움을 준다. 프레임워크가 가진 특징을 정리하면 다음과 같다.

프레임워크의 장점
체계적인 코드관리로 유지보수가 용이하다.
기본설계 및 기능 라이브러리를 제공하여 개발 생산성이 높다
코드에 대한 재사용성이 높다
추상화된 코드 제공을 통해 확장성이 좋다


프레임워크의 단점
학습난이도가 높다.
기본 설계된 구조에 의해 자유로운 개발에 한계가 있다.
사용하지 않는 기능에 대한 라이브러리가 포함될 수 있다.
제공되는 기능만큼 프로젝트의 용량이 증가한다.


자바스크립트 프레임워크

웹의 경우 텍스트와 이미지를 구조에 맞춰 표현하는 수준의 화면구성이 많았지만 기업업무 시스템을 웹으로 구성하기 시작하면서 많은 변화가 있었다. 예를 들어 웹에서 그리드형태의 화면을 표현할 경우 Table/Div 태그를 활용하여 화면을 구성하면 끝이다. 하지만 기업업무에서 사용되는 그리드는 정렬, 컬럼 위치/사이즈변경 등의 기능을 많이 사용한다. 이를 순수하게 스크립트로 작업할 경우 복잡한 처리와 성능의 한계가 발생한다. 그리고 위에서 이야기한 것과 같이 스크립트 표준 준수 및 개발품질 문제가 발생할 수 있으며 유지보수를 어렵게 한다. 이와 같은 문제를 자바스크립트 프레임워크를 통해 해소할 수 있다. 웹에서 기업업무에 필요한 기능들을 활용할 수 있도록 기반을 제공하는 것이다.

또한 급변하는 UI 트랜드에 대해 발 빠른 대응이 가능하도록 도와준다. 대중적으로 사용되는 자바스크립트 프레임워크의 경우 높은 수준의 개발자 커뮤니티를 이루고 있다. 페이스북이 지원하고 있는 리액트의 경우 가장 큰 개발자 커뮤니티를 보유하고 있으며 많은 개발자가 참여하고 있는 만큼 빠른 속도로 성장하고 있다. 빠르게 성장하는 만큼 UI 트랜드 변화에 민첩한 대응을 하고 있으며 대규모의 개발자가 함께 만들어 가는 결과물을 한 명의 개발자 또는 소규모 개발그룹이 따라가기에는 한계가 있다. 그만큼 자바스크립트 프레임워크를 사용하는 것은 높은 수준의 결과물을 쉽게 사용할 수 있고 트랜드 변화에 민첩한 대응이 가능하다고 하겠다. 

좋은 이야기만 하는 것은 오히려 독이 될 수 있으므로 자바스크립트 프레임워크가 가진 어두운 부분에 대한 이야기도 집고 넘어가도록 하겠다. 현재 활성화 되어있는 자바스크립트 프레임워크 숫자는 헤아리기 힘들 정도다. 다양한 자바스크립트 프레임워크가 존재하는 만큼 장단점, 특징들 또한 다양하다. 물론 잘 정리되고 쉽게 활용이 가능한 것도 있지만 프로젝트 진행에 도움보다 피해를 주는 프레임워크도 존재한다. 프레임워크 적용을 검토하고자 한다면 다양한 각도로 검토가 필요하며 몇 가지 체크리스트를 정리해 보면 다음과 같다. 

Check List
제공기능 완성도 제공기능의 완성도(버그, 브라우저호환성)는 높은 편인가? 
자유도 사용자의 요구에 맞게 기능 추가 및 변경이 용이한가? 
호환성 브라우저 파편화, 버전 파편화 현상은 없는가? 
성능 사용자환경에서 만족 할 수 있는 성능을 보장할 수 있는가? (렌더링 성능, 데이터 처리 성능 등) 
유지보수 버전관리 하위버전에 대한 호환은 가능한가? 
표준화 주기적인 업데이트가 되고 있는가? 
디버깅 표준화된 스크립트 구조인가? (독자적인 스크립트 구조는 지양할것!) 
라이선스 교육 및 자료 교육 난이도가 지나치게 높은 편은 아닌가? 
정책 라이선스 정책의 세부사항까지 완벽하게 확인했는가? 
전환 용이 라이선스 전환 시 대체 기술 전환 및 전환이 용이한가? 

웹에서 기업 업무시스템을 구축한다면 자바스크립트 프레임워크를 사용하는 것은 필수사항이라고 생각한다. 그만큼 개발을 진행하는데 많은 도움을 받을 수 있으며 이후 발생할 유지보수를 용이하게 해준다. 하지만 중요한 역할을 하는 만큼 자신의 시스템에 적합한지 면밀한 검토를 거쳐 선정의 과정이 필요하다. 자바스크립트 프레임워크를 활용한 프로젝트 진행에 도움이 되길 바라며 글을 마치도록 하겠다.