Skip to content

gmkim716/Ttocket

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🎪🎫 블록체인 NFT기반 티켓 서비스 똑똑한 티켓, 똑켓(TTocket)🎫🎪

메인페이지


🎬 소개 영상


📅 프로젝트 진행 기간

  • 2023/2/20 ~ 2023/4/7 (6주)
  • SSAFY 8기 특화 프로젝트 [블록체인]

✔️ TTocket - 배경

  • 누구나 한 번쯤 공연 티켓팅 경험 있으시죠?
  • 저희는 티켓팅에 실패하고 아쉬웠던 적이 많습니다.
  • 암표거래 관련 기사들을 찾아보며 화가 났습니다.
  • 그래서, 암표거래가 없는 깨끗한 티켓팅 서비스 똑켓을 개발했습니다!

✔️ TTocket - 개요

  • 블록체인 기술을 이용해 대체 불가능한 나만의 NFT 티켓을 구매해서 암표 거래를 방지해보세요.
  • 공평한 티켓팅을 위해 FIFO의 Queue를 활용한 티켓팅 대기열 기능을 제공합니다.
  • 추억을 담아, 영구적으로 소유할 수 있는 NFT 티켓 관리 서비스를 제공합니다.

✔️ 기대 효과

  • 암표 거래 예방 : 스마트컨트랙트와 NFT 기술을 활용, 암표 거래 방지
  • 클린한 티켓팅 : 암표상들이 참여하지 않는 환경에서 팬들 간 공정한 티켓팅 경쟁
  • NFT 티켓 활용 추억 : 영구적으로 보존되는 NFT 티켓을 통해 공연에서의 추억을 간직

📌 주요 기능

  • Metamask 계정을 이용한 로그인
  • 공연 관리
  • 티켓팅
    • Websocket, Redis Queue 활용한 티켓팅 트래픽 처리
    • NFT 티켓 민팅을 통한 티켓 소유권 보장
  • 티켓 관리
    • 공연 전 티켓 목록 제공
    • QR 코드를 통한 입장 관리 및 로그 관리
    • 티켓 취소 시 환불 수수료 발생
    • 취소한 티켓을 다른 사람이 구매할 경우 수수료 환불!
  • 티켓 보관함
    • 공연 후에도 티켓 구매 기록이 블록체인 네트워크에 영구적으로 보관
    • 공연에 대한 후기를 작성할 수 있는 다이어리 기능
    • 주최자 측에서 티켓 소유자들에게만 추가 컨텐츠 제공

🎨 주요 기술

  • BlockChain
    • Solidity
    • Truffle
    • Ganache

  • FrontEnd
    • React
    • TypeScript
    • Web3.js
    • HTML
    • CSS
    • JavaScript
    • Figma
    • SockJS

  • BackEnd
    • IPFS
    • Java 11
    • Spring Data JPA
    • Spring Boot
    • MySQL
    • Redis Sentinel
    • STOMP

  • Deployment
    • Nginx
    • Docker
    • Jenkins
    • AWS EC2
    • Gitlab

🎨 버전 정보

Ver 1.0 (~ 3/23)

  • Client
    • 로그인, 티켓 목록, 공연 예매 디자인 구현
    • MetaMask 연결 및 스마트 계약 연결
    • 구현된 페이지 API 연결
  • Server
    • 로그인, 티켓 목록, 공연 예매에 필요한 API 개발 완료
  • BlockChain
    • 공연 데이터 관리, 티켓 민팅, 티켓 취소 등 관리

    1.1

    • Client
      • 티켓 예매 디자인 관련 hotfix
    • Server
      • PUT method CORS 에러 해결

Ver 2.0 (~ 3/28)

  • Client
    • 티켓 상세보기, 보관함, 감상평, 공연 등록 페이지 구현
    • 티켓 목록 및 상세보기
  • Server
    • Swagger 설정
    • 좋아요 관련 기능 개발
    • 공연 목록 디테일
  • BlockChain
    • 블록체인 네트워크에 스마트 컨트랙트 배포
    • Web3 연동 : MetaMask, 스마트 컨트랙트
    • 티켓 취소 로직 변경

    2.1

    • Server
      • Metamask 지갑 로그인 기능
      • 닉네임 등록 여부 확인

Ver 3.0 (~ 4/5)

  • Client
    • 보관함 다이어리 작성 구현
    • 결제 및 결제 취소 기능 연결
  • Server
    • QR 코드 처리, 공연 입장 로그 관리

    3.1

    • Client
      • 다이어리 기능 연결
      • 비하인드 등록 기능 연결
    • Server
      • 티켓팅 대기열 기능 추가

    3.2

    • Client
      • 보관함 디자인 수정 및 비하인드 목록 구현
      • QR 코드 생성 구현

📂 시스템 아키텍처

똑켓아키텍쳐

📂 프로젝트 파일 구조

BlockChain

└─blockchain
    ├─contracts
    │   ├─Ticket.sol
    │   └─TicketDTO.sol
    ├─migrations
    │   └─1_initial_migration
    └─test
        └─Ticket_Test

FrontEnd

└frontend
    ├─nginx
    ├─public
    └─src
        ├─app
        │  └─redux-modules
        ├─assets
        │  └─fonts
        ├─components
        │  ├─date
        │  └─modal
        ├─css
        ├─pages
        │  ├─box
        │  ├─error
        │  ├─login
        │  ├─perform
        │  ├─qr
        │  ├─reserve
        │  │  └─seat
        │  ├─sponsor
        │  └─ticket
        └─services
            └─web3

BackEnd 1: 티켓팅

└backend
    └─src
        ├─main
        │  ├─java
        │  │  └─com
        │  │      └─ssafy
        │  │          └─ttocket
        │  │              ├─config
        │  │              ├─controller
        │  │              ├─domain
        │  │              ├─dto
        │  │              ├─exception
        │  │              ├─filter
        │  │              ├─interceptor
        │  │              ├─repository
        │  │              │  └─querydsl
        │  │              └─service
        │  └─resources
        └─test
            └─java
                └─com
                    └─ssafy
                        └─ttocket

BackEnd 2: 좌석 예매 대기열

└─tttocket
    └─src
        └─main
          ├─java
          │  └─com
          │      └─ssafy
          │          └─tttocket
          │              ├─config
          │              ├─controller
          │              ├─dto
          │              └─service
          └─resources

🤝 협업 툴

  • Git
  • Notion
  • JIRA
  • MatterMost
  • Webex
  • Discord
  • Kakaotalk

📋 프로젝트 산출물


✨ 서비스 화면

1️⃣ 입장 화면

  • 서비스 기능 요약소개
  • MetaMask 로그인 버튼
  • 첫 로그인 시 닉네임 등록
  • 로그인닉네임
  • Matamask 로그인

2️⃣ 공연 목록

  • 티켓팅 오픈예정, 공연 예정, 관심목록 세 가지 구분
  • 공연 예정, 관심목록 각각 모두보기 기능
  • 공연목록

3️⃣ 티켓팅 대기열

  • 티켓팅 오픈시간에 예상되는 트래픽 처리를 위한 대기열 화면
  • 총 대기자 수, 사용자 몇 번째인지 확인 가능
  • 대기열큐100

4️⃣ 티켓 구매

  • 좌석 선택 및 규정 동의 후 결제 진행
  • MetaMask 연동 결제 완료 시 티켓 예매 성공
  • 티켓민팅 - 2 좌석선택

5️⃣ 티켓 관리

  • 공연 전 티켓 목록
  • 티켓 목록 상세보기 통해 QR코드, 티켓 취소 가능
  • 티켓 관리

6️⃣ 티켓 취소

  • 티켓 취소 환불 예정 금액 제공
  • 취소 티켓 타 사용자가 구매 시 수수료까지 환불
  • 티켓 취소
  • 티켓 취소 이전 금액
  • 취소이전금액
  • 티켓 취소 이후 금액
  • 취소이후금액

7️⃣ 티켓 보관

  • 공연 후 티켓 목록
  • 상세보기, 다이어리 작성, 비하인드 관람 기능
  • 티켓보관 - 1