MMC Ticketing Service

A collaborative project of the team UNIT with club MMC.

• 참여자: 김동주 <hepheir@gmail.com>, 박종운<dfc7936@naver.com>, 이현오, 김법기
• 단체명: 자율동아리 UNIT - (연극영화부동아리 MMC¹와 콜라보)
• 소속: 보정고등학교
• 기간: 2016-03-29² ~ 2016-12-18³

Summary

이 서비스는 보정고등학교 연극영화부 동아리 MMC의 연말 정기공연 티켓 예매를 웹 상에서도 가능하게 하는 것을 목표로 개발되었습니다.

Web 개발 스터디 및 디자이너와 개발자간의 협업을 주제로 모인 4인조 자율동아리 UNIT에 의해 기획·주도된 이 프로젝트는 학교 선생님들의 아낌없는 지원⁴과 MMC와의 긴밀한 협업⁵을 통해 실제로 서비스 되어진 바가 있습니다.

오직 Apache와 PHP 프레임워크만을 사용하여 구동되는 이 서비스는, 필요한 데이터 /data 디렉토리 아래 평문의 형태로 저장하기에 보안성은 굉장히 취약한 면이 있지만, 굉장히 단순하고 직관적인 구조로 설계되어 있다는 장점이 있습니다.

Service

서버는 일반 사용자(학생)과 관리자를 구분하여 각자에게 필요한 서비스를 알맞게 제공합니다.

• 일반 사용자:

  • 랜딩 페이지에서 동아리 소개 보기⁶
  • 학번/이름을 사용한 로그인하기
  • 예매 가능한 좌석보기
  • 좌석 선택하기
  • 선택한 좌석 예매하기 (저장)
  • 자신이 예매한 좌석보기

• 관리자:

  • 공연 회수 조절
  • 좌석 배치도 조절
  • 예매 불가석 지정⁷
  • 좌석별 예매자 조회⁸

일반 사용자

사용자는 학번과 이름을 통해 로그인을 할 수 있으며, 원하는 좌석을 선택하여 저장할 수 있습니다.

로그인 화면

좌석 선택 화면

관리자

예매 불가석을 지정하거나, 티켓팅이 종료 된 후 예매된 좌석들을 정리하기 위해서는 관리자

관리자 페이지 진입

관리자는 로그인 시 이름에 'admin'을 입력하여 제출하면 특수한 암호를 통해 관리자 페이지로 진입을 시도 할 수 있습니다.

관리자 페이지

관리자 페이지에는 4가지 기능이 있습니다.

Architecture

root/
│
├── admin/              # 관리자 페이지
│   ├── _apply.php          # 관리자 페이지 Controller
│   ├── index.php           # 관리자 페이지 View
│   └── style.css
│
├── css/
│   ├── color.css
│   ├── layout.css
│   └── xml.css
│
├── data/               # 데이터 베이스
│   ├── empty_cell/         # 빈 좌석 정보
│   │   └── {seat_id}           # {seat_id} 파일이 존재하면 해당 좌석은 빈 칸인 것
│   │
│   ├── part{pard_id}/      # 공연 회차 별 좌석 정보
│   │   └── {seat_id}           # {part_id}회차의 {seat_id}좌석의 <좌석 상태 (0: 예매불가 / 1: 예매가능 / 2: 예매 됨) / [예매한 학생의 학번]>
│   │
│   ├── user/               # 사용자 정보
│   │   └── {user_id}           # {user_id}학번을 사용하는 학생의 <이름 / [예매한 회차 / 예매한 좌석]>
│   │
│   ├── part_available      # 공연 정보 <공연 회차 수>
│   └── table_setting       # 좌석 정보 <좌석 칸(가로) 개수 / 좌석 열(세로) 개수>
│
├── index.html          # 랜딩 페이지 (로그인 & 좌석 선택)
├── _login.php              # 로그인 Controller (회원 가입 or 로그인 승인)
├── _part_selector.php      # 좌석 선택 - 회차 View (회차를 표시하기 위한 html 일부를 생성)
├── _table_drawer.php       # 좌석 선택 - 좌석 View (좌석을 표시하기 위한 html 일부를 생성)
├── _save.php               # 좌석 선택 Controller (선택한 좌석을 데이터베이스에 적용)
│
├── login_log.txt       # 사용자 접속 기록
├── bgImg.jpg
│
└── UPDATE.txt

실행 방법

Apache와 PHP를 설치하고, 본 레포지토리의 모든 파일을 Apache 서비스의 루트 디렉터리로 옮겨 사용할 수 있습니다.

Using GitHub Codespace (or Visual Studio Code)

개발 편의를 위해 .devcontainer 설정을 추가해두었습니다.

Visual Studio Code 혹은 GitHub Codespace 상에서 Microsoft - Dev Containers 확장을 설치하여 Apache2와 PHP가 설치된 컨테이너를 손쉽게 생성할 수 있습니다. Dev Containers: Open Folder Container 명령을 통해 컨테이너를 생성한 후, 다음의 명령을 터미널에 입력하여 Apache 서비스를 활성화 시킵니다:

sudo service apache2 start

이후 80번 포트가 활성화 되어있는지 확인하고, 포트포워딩을 통해 접속 후 결과물을 확인하면 됩니다.

Acknowledgements

콜라보 작업을 흔쾌히 수락해주시고 디자인에 대한 다양한 의견 및 영상자료를 제공해주신 MMC 부원들께 진심으로 감사드립니다. 또한 이 프로젝트를 묵묵히 지켜봐주시고 아낌없이 지원해주신 선생님들께 진심으로 감사드립니다.

Footnotes

1. Movie Manufacturing Club ↩

2. UNIT 4월 중 활동 내용 보고서에서 파악됨. ↩

3. 정확한 날짜 미상. 페이스북 개시글을 통해 추정됨. ↩

4. 교사용 노트북 1대와 학교 서브도메인 https://unit.bojeong.hs.kr/을 제공받아 사용함. ↩

5. 사용자 테스트에 도움을 받았고, 디자인에 대한 다양한 피드백을 받았으며, 홈페이지에 첨부할 영상자료를 제공받음. ↩

6. 개발 과정에서 삭제됨. ↩

7. 교사용 지정석 혹은 배우들의 지인을 위해 제공되는 좌석 등. ↩

8. 시간 부족으로 기능이 구현되지 못하여 서비스 종료 후 예매자를 수동으로 파악하였음. ↩