저작권 무료 음악 사이트
Written by Sangmin on February 25, 2024
서비스 소개
한줄소개: Royalty-free music site
원래 음악을 좋아해서 작업해둔 비트들이 많이 있었는데 노래를 붙이기 애매하거나 연주곡으로 만들어진 곡들을 그냥 두기에는 아까워서 배경음악으로 사용하면 어떨까하는 생각을 했다. 유튜브든 영화나 드라마든 혹은 제품 홍보영상이든 영상을 제작하는 사람들에게 도움이 되지않을까해서 음악을 공유하기로 결정했다.
우선 내 음악을 믹싱 하고 카테고리별로 정리하는게 첫번째 단계였다. 개발보다 이 부분이 더 힘들었다. 아직도 틈틈이 만들어놓은 음악을 믹싱하고 편곡하는 중. 차차 더 많은 음악이 올라갈 예정이다.
그 후에 정리해놓은 걸 디비에 옮겨두고 데이터를 fetch해서 리스트업하는 것이 개발의 포인트. Form은 자체적으로 만들기보다는 예전에 만들어놨던 서버가 있어서 tally form을 이용해서 폼을 전송하면 webhook으로 서버에 post 요청을 보내 데이터베이스에 등록하는 식으로 플로우를 짰다.
개발 과정
사용기술/툴: Next.js, Javascript, MongoDB, Tailwind, aws s3,next-auth
처음으로 next.js를 이용해서 개발한 프로젝트. 이 프로젝트는 처음 써보는 것들이 많았다. 사실 새로운 프레임워크를 배우는게 조금 고민되긴했지만 예전에 리액트를 조금 이용해본적이 있어서 그래도 배우기 크게 어렵지는 않았다. 리액트보다 훨씬 큰 장점은 서버사이드 코드를 짤수있다는 점.써보니까 왜 하입이 있는지 알 것 같다. 여기에 더해 vercel에 배포하는게 아주 간단하다는 점도 플러스 포인트.
원래 처음에는 next js 가 아니라 express 서버와 쌩 javascript 프론트로 만들었으나 거의 완성을 앞둔 후 Next.js로 다 옮겼다. 어느정도 로직은 다 짜둔터라 그걸 조금 수정하기만하면 돼서 그나마 빠른 기간내에 개발할 수 있었다.
처음으로 Next.js를 이용한 프로젝트라서 뿌듯하기도 하고 배운 점도 많이 있다. 처음에 시작할때는 막막한게 많았는데 하다보니 조금씩 익숙해졌다. 또한 두가지 버전으로 모두 짜보니 각자의 특성을 조금 더 비교분석할 수 있었고 프레임워크의 장점을 더 느낄 수 있었다.
또 tailwind도 처음 써보는데 편하긴하다. 아직까지 css가 좀 더 익숙하긴하지만 확실히 스타일링 때문에 왔다리갔다리하는게 좀 줄기도했고 배우기 그렇게 어렵지도 않아서 component단위로 짜는 코드에서는 확실한 장점이 있는 것 같다.
content mangement는 aws s3 bucket. 이것도 처음 써보는데 오디오파일이 많고 크다보니까 꼭 필요한 툴이라서 써보게됐다.
Next-auth도 처음 써봤는데 굉장히 편하게 적용이 된다. 심지어 네이버, 카카오 등의 소셜로그인도 지원하는거같아서 나중에 적용해봐도 괜찮겠다.