/Muser_Space

Muser Space -아마추어 뮤지션을 위한 음원 공유 플랫폼

Primary LanguageHTML

Project "Muser Space"

: 음악을 사랑하는 Muser들의 음악공간

* Muser란? Music + User, 음악을 이용(Play or Listen)하는 모든 사람들



1. 사용한 기술 스택

  • HTML / CSS
  • Javascript
  • Ruby on Rails
  • AWS S3, EC2

2. 기능 구현

  • 회원정보 및 음원, 영상, 댓글 등의 게시글 올리기 기능을 CRUD를 기반으로 구현
  • AWS S3 Storage에 연결시켜 프로필 사진, 앨범 사진, 음원, 공연 영상들을 업로드할 수 있게 구현
  • 오픈소스 오디오 라이브러리 Howler.js를 사용해, 음악 플레이어를 사용한 음원 감상 구현
  • HTML 환경에서 영상 시청 구현
  • 회원가입 및 로그인 기능 구현
  • 조회수, 좋아요(Like) 기능 구현 및 조회수, 좋아요 개수를 기반으로 한 뮤즈 차트(랭킹 차트) 구현
  • 음원 및 영상 상세페이지 댓글 구현 (감상평, 응원 등을 남길 수 있음)
  • AWS EC2 서버에 배포

3. 페이지 구현

  • index(홈페이지)에서는 최신 음악, 뮤즈 차트, 인기영상으로 UI 구성
  • 창작 / 커버(원곡 Cover 영상)/ 공연(공연 영상) 3가지 카테고리에서 음원 및 음악 영상을 올릴 수 있게 각각의 페이지 구현
  • My page에서 프로필(사진, 닉네임, 상세정보)등을 업로드 및 수정하고, 게시글을 올린 다른 유저의 프로필 페이지도 볼 수 있게 구현
  • 조회수, 좋아요 기반의 차트 페이지 구현
  • howler 플레이어를 통한 음원 스트리밍을 팝업으로 구현







4. 서비스 소개