Skip to content

ashtonisher/lucky-me

Repository files navigation

Lucky Me! (추첨기)

제작: ashtonisher2@gmail.com

**Lucky Me!**는 당첨자를 추첨하는 추첨기입니다. 팀 내에서 당첨자를 정할 때 사용할 수 있습니다.


실행 방법 (로컬)

사전 요구사항: Node.js 20.18.2

  1. 패키지 설치
    npm install
  2. 프로젝트 루트에 .env 파일 생성 후 포트 설정
    PORT=7777
  3. 서버 실행(로컬)
    npm run dev
  4. 브라우저에서 http://localhost:7777 접속

사용 방법


  1. 뽑기에 참여할 사용자는 제공받은 URL에 접속합니다.
  2. 모든 참여자가 접속하면, 자동으로 당첨자를 추첨합니다. 2-1. 재추첨을 하고 싶다면, 모든 참여자가 접속해있는 상태에서 '추첨하기' 버튼을 누르면 됩니다.
  3. 화면에 표시되는 당첨 결과를 확인합니다.
  4. 접속 후 발생한 모든 당첨 결과는 '추첨하기' 버튼 아래의 로그 영역에 기록됩니다. 이 로그 내용은 사용자가 접속을 해제하면 초기화됩니다. 따라서 기록을 원한다면 별도의 방법으로 기록해야 합니다.

메뉴 추천 기능(오늘 뭐 먹지?) 사용 방법


  1. 우측 상단의 '<' 버튼을 눌러 메뉴 추천 사이드 바를 열어줍니다.
  2. 사이드 바의 상단에 추천 메뉴와 함께 가격이 표시됩니다.
  3. 추천 메뉴가 마음에 들지 않으면, 아래의 재추첨 버튼🔄을 눌러 새 메뉴를 추천받습니다.

기능


  • 저장된 명단에서 랜덤으로 당첨자 뽑기
  • 접속자 수 기록 (현재 5명의 참여자가 모두 접속했을 때만 뽑기 기능이 작동합니다)
  • 추첨 내용 로그 확인
  • 오늘의 한솥 메뉴 추천(메뉴명+가격) (*메뉴명과 가격의 변동사항은 실시간으로 반영되지 않으므로, 홈페이지를 참고해주세요.)

기능 수정 방법


참여 인원에 변동이 생겨 수정이 필요하다면, 몇 가지 변수를 수정해서 커스터마이징/수정할 수 있습니다.

  • 참여자 수 변동: server.js의 result 변수 값 수정
  • 참여 명단 변동: index.html의 lunchMate 배열 수정

수정 내역

  • 22.09.01 멤버리스트, 메뉴리스트, css 마이너 수정
  • 22.05.26 메뉴 추천 기능 추가, html, css, js 분리
  • 22.05.06 자동 추첨 기능 추가
  • 22.04.06 배포

적용 기술


  • HTML + CSS
  • Javascript (Vanilla)
  • Node.js
  • Express.js
  • Socket.io

About

랜덤으로 당첨자를 뽑는 추첨기입니다.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors