🗓️ 2022. 03. 08.
프로미서의 개발을 위해 이전의 프로젝트에서 사용하지 않던 기술을 채택했다. 남들이 다 쓰니까
말고, 내가 이 기술을 왜 채택했는지 알아야 이 기술을 더욱 효율적으로 사용하고, 공부할 수 있을 것이라고 생각한다.
Category | Stack |
---|---|
Language | Typescript |
Framework(Library) | React |
CSS | Styled Components |
타입스크립트는 자바스크립트의 슈퍼셋인 오픈소스 프로그래밍 언어이다. 코드 작성 단계에서 타입을 체크해 오류를 확인할 수 있어서 버그를 사전에 예방할 수 있다. 또한 미리 타입을 결정하기 때문에 메모리 낭비를 줄일 수 있고 실행 속도가 빠르다.
좋은 코드의 중요한 조건 중 하나는 읽기 좋은 코드를 짜는 것이다. 내가 쓴 코드를 언제나 내가 유지보수 한다는 보장은 없다. 타입스크립트는 어떤 데이터 형식이 넘어오는지 코드를 보고 바로 알 수 있고, 바꾼 코드로 인해 생길 수 있는 side effect를 알 수 있다. 따라서 새로운 담당자가 코드를 마주해도 수월하게 기능 개발과 유지보수를 할 수 있다. 현재 프론트엔드 개발자는 한명이지만, 프로젝트를 실제로 운영하며 확장해갈 계획이 있기 때문에 기술 선택에 있어서 유지보수 측면을 가장 중요하게 고려했다.
리액트는 자바스크립트 라이브러리의 하나로, 동적인 웹 페이지 개발을 위해 사용된다. 컴포넌트 단위로 코드를 작성하고, 하나의 컴포넌트를 여러 부분에서 사용할 수 있다.
애플리케이션 개발이라는 문제가 주어졌을 때, 이를 한번에 해결할 수는 없다. 페이지, 조직, 컴포넌트 등 단계에 걸쳐 작게 쪼개어 문제를 해결하고 다시 합치는 과정을 반복했을 때 이 거대하고 복잡한 문제를 해결할 수 있게 된다. 거대하고 복잡한 UI를 컴포넌트를 통해 기능별로 캡슐화하면 유지보수 측면에서 유리하게 작용할 수 있다.
또한 리액트는 매우 널리 사용되는 라이브러리이기 때문에 에러가 발생했을 때 도서, 국내외 사이트 등 도움을 얻을 만한 소스가 다양하다는 장점이 있다.
스타일 컴포넌트는 CSS가 지정된 HTML 요소를 생성하는 라이브러리이다. 요소의 이름을 사용자가 설정할 수 있기 때문에 다른 사람이 봤을 때도 이 컴포넌트가 어떤 기능을 하는지 한눈에 알 수 있다. 이는 HTML 요소만으로 코드를 구성하는 것보다 유지보수 측면에서 훨씬 유리하게 작용할 수 있다.
또한 스타일 컴포넌트는 상속을 통해 스타일을 재사용할 수 있다. 본격적으로 애플리케이션을 개발하기 전 필요한 컴포넌트를 설계하고 자주 사용될 것으로 예상되는 컴포넌트 스타일을 일반화해 만들어둔다면, 일반화한 컴포넌트를 재사용함으로써 개발 속도가 굉장히 빨라지고 메모리도 절약할 수 있다.
Category | Stack |
---|---|
Framework | - Spring Boot 2.6.3 |
Test | - JUnit 5 |
Infra | - Nginx 1.14.0 - AWS EC2 18.04.1 - Jenkins 2.305 - Sonarqube 9.0.1 |
Database | - MySql - 공공데이터 |
팀원 | 역할 | Github |
---|---|---|
고산하 | Project Leader / Back End | @headF1rst |
김채은 | Project Manager / Front End | @chchaeun |
이준석 | Infra / Back End | @juy4556 |
황승환 | DBA / Back End | @xx0hn |