개발자 1명이 만드는 SaaS 기술 스택

이번에 세일즈올레디 (https://salesallready.com)를 리뉴얼하면서 사용한 기술스택을 정리해봅니다.

팀으로 일하는 것과 혼자서 서비스를 만들때 선택의 기준이 좀 달라지는 것 같습니다.

가장 중요한 자원인 내 시간을 가장 아낄 수 있는 선택을 하게 되는 것 같습니다.

Frontend

• TailwindCSS

• daisyUI

• NextJS

• Heroicons

이전에 MaterialUI를 메인으로 사용했었는데 Theme관련된 typing하다가 시간이 다 가버렸다. 기능도 아니고 typing으로 시간이 다 가니 너무 아깝다는 생각이들고, 이렇게 시간을 허비할 수 없다는 판단. 리뉴얼 진행시에 tailwindcss와 daisyUI로 싹 갈아 엎었다.

tailwindcss는 vscode의 extension과 같이 사용하는 것이 생산성이 높았고, daisyUI는 대부분 원하는 UI가 미리 구현되어 있어서 markup시간을 많이 아껴줬다. 기본적인 아이콘들은 Heroicons에서 찾아 사용했고, tally, notion, gmail등의 UI를 많이 참고했다.

NextJS는 vercel을 통해 배포가 너무 쉽기 때문에 선택했다.

Backend

• NestJS

너무 자유도가 높은 NodeJS 보다 NestJS를 선택했다. NestJS는 잘 만들어진 구조를 따라갈 수 있기에 용이했다. Clean architecture까지 적용했다가 코드양이 너무 늘어나고서 다시 걷어내고 CQRS패턴을 적용하는선에서 마무리 지었다. NestJS는 NodeJS를 쓸 때 보다 구조화가 잘 되고, CQRS패턴을 적용하기 편했다.

ETC

• Email : Sendgrid

• Host : AWS

• CS : Channeltalk

• Payment : Payple

Sendgrid의 dynamic template은 backend에서 이메일 UI를 따로 고민하지 않아도 되게 해준다. 초반엔 free plan으로 사용할 수 있다. CS채널은 Channeltalk으로, Payment는 Payple을 사용했고, 아직 api는 연결되어있지 않고 링크결제를 통해서 결제를 진행하고 있다.

백엔드 서버는 AWS를 사용했고, build된 번들 자체를 repo에 올려서 최대한 비용이 낮은 서버를 사용할 수 있도록 했다.

최대한 빠르게 생산성을 높이려다 보니 최신기술보다는 손에 잘 익은 기술을 선택하는게

좋은것 같습니다. 유지보수가 쉬운지도 중요한 점이구요.

다음 글에서는 세일즈올레디 기획 비하인드 스토리를 글로 적어보겠습니다.

감사합니다. :)