[CHALLENGE] NFTPARK

⭐️ 2023년 1월 25일 ELLIE TOUR WORLD에 작성되었습니다 ⭐️

2023년 11월 18일 ELLIE PROGRAMMING WORLD 로 옮김

---

[Challenge] WEB2와 WEB3가 결합된 NFT 티켓팅 B2C 플랫폼

2023년 1월 10일 - 2023년 1월 25일 

---

기획 의도

B2C 티켓팅 사이트 인터파크(INTERPARK)에 NFT 기술을 결합하여

사회적으로 대두되는 "암표거래" 문제를 해결하는 것이 이 프로젝트의 핵심 목표이다.

Use Stack

주요 기능

• 커뮤니티 유저가 티켓 구매 응모에 참여
• 티켓 구매 당첨자 추첨
• 티켓 취소(환불) 및 소각
• 마켓플레이스에서 원가보다 낮은 가격으로만 거래(OnSale)
• 화이트리스트 판매

페이지별 기능

• SignUp / Login 
  - 카카오톡 간편 회원가입 / 로그인
• MainPage
  - 콘서트 Carousel
  - 응모가능한 콘서트 10개 모아보기
• DetailPage
  - 콘서트 정보
  - 응모하기 (응모 후, 응모완료 버튼으로 변경 / 취소 불가능)
• MarketplacePage
  - 응모가능한 콘서트 모아보기
  - 타인이 업로드한 (원가보다 저렴하게) 세일 콘서트 티켓 모아보기
  - (OnSale) 세일 티켓 구매하기 
• Mypage
  - 구매내역 확인 및 취소
  - 콘서트 응모 내역
  - (상세) 예매 티켓 정보 확인 및 취소하기
  - (판매) 내 티켓 판매하기 & 화이트리스트 판매하기
  - (입장) 입장QR
  - (당첨여부) 클릭 시 당첨여부 확인 가능
  - (구매) 응모해서 당첨된 티켓 구매하기

Wireframe

Flow Chart

.env Setting

## client en
REACT_APP_PARKt_ERC20 = 
REACT_APP_PARK_ERC721 = 
REACT_APP_Ticketing = 
REACT_APP_Market = 

REACT_APP_INFURA_API_KEY = 

REACT_APP_PROJECTID = 
REACT_APP_PROJECTSECRET = 

REACT_APP_NMEMONIC = 
PRIVATEKEY = 

##basic_server env
DB_NAME = 
USER_NAME = 
USER_PASSWD = 
DB_HOST = 
DB_PORT = 
client_id = 
redirect_uri = 
SECRET_KEY = 

PARKt_ERC20 = 
PARK_ERC721 = 
Ticketing = 
Market = 

NMEMONIC = 
INFURA_API_KEY = 

## NFTPARK_SERVER
DB_NAME = 
USER_NAME = 
USER_PASSWD = 
DB_HOST = 
DB_PORT = 
client_id = 
redirect_uri = 
SECRET_KEY = 

INFURA_KEY = 
REDIS_HOST=
REDIS_PORT=
REDIS_USERNAME=
REDIS_PASSWORD=

SENS_SERVICE_ID = 
SENS_SECRET_KEY = 
SENS_ACCESS_KEY = 

발표 자료 영상

Advance (앞으로 더 추가하고 싶은 기능)

좌석 등급선택
A석, S석, R석, VIP석 좌석 등급 선택 기능

 

2차 추첨
응모 완료 후 에어드롭시 충분한 토큰이 없는 경우의 2차 추첨

회고

처음 파트(프론트, 백, 스마트컨트랙트)에 대한 이야기를 나누었을 때, '주어진 시간안에 맡은 부분을 다 할 수 있을까?'라는 생각이 가장 먼저 들었다. 발표하는 날 바로 직전까지가 설날이기도 했고, 멘토링 이후 플랫폼 기능을 조금 더 확장시켰기 때문이다.

그래서 이번 프로젝트에서는 단시간에 퀄리티 뿐만아니라 사용성이 편리한 UI를 만드는 것이 나의 목표였다.

Mui-Material을 활용한 것도 리액트와 호환성도 높고, 충분한 개발자 자료와 원하는 컴포넌트들이 충분했기 때문이다. 

 

팀원 모두가 맡은 부분을 열심히 해준 덕분에 기한 안에 프로젝트가 잘 마무리 되기는 했으나,

진행했던 프로젝트 중 기획시간이 가장 짧아 너무 아쉬웠다.

다음에 조금 더 긴 시간이 주어지고, 기회가 온다면

기획하는 시간에 팀원들과 프로젝트의 세부사항들에대해서도 더 많이 이야기를 나누어보고싶다. 

 

내가 아는 방법이외에도 많은 다른 방법들이 있고 내가 아는 방법이라 할지라도 업데이트된 정보들도 많다.

이번 프로젝트로 인해 react 상태관리 , 성능, 로딩 시간 등에 대해 더 공부해야겠다는 생각이 들었다.

---

TODO LIST

블로깅

기술 블로깅 작성하기!!

(회고 중요!! 내가 사용한 기술 완전히 나의 것으로 만들기!!)

코드

코드 리팩토링 하기

* 가독성 ↑, 유지보수 *

코드 뜯어보기
(내가 작성한 코드뿐만 아니라 팀원들이 작성한 코드도 이해하자!!)

---