[이벤트] 1만 구독자 달성(예정) 이벤트!인척 하는 이벤트 페이지 만들기 강의 영상

마감업로드 2026. 3. 12.

상세 설명

1만 구독자 이벤트를 어떻게 운영할지, 직접 웹앱으로 설계하고 구현하는 과정을 담았습니다. Pencil로 디자인 가이드를 잡고, Next.js와 Firebase로 참가 신청, 이미지 업로드, 추첨 구조까지 연결해봅니다. 이벤트 안내와 실전 빌드 과정을 한 번에 보고 싶은 분들께 추천드립니다. 이벤트 신청 페이지 : https://gdrb-book-event.web.app 타임라인 0:00 1만 구독자 이벤트 소개 0:36 도서 구매자 한정 이벤트 진행 방식 설명 1:28 구매 이력 캡처 제출과 랜덤 추첨 안내 2:53 리뷰 캡처도 함께 제출해야 하는 이유 5:08 구매 인증/리뷰 인증을 받는 웹앱 제작 방향 설명 6:12 Pencil로 디자인 가이드 문서 작업 시작 8:00 디자인 시스템 구조와 변수 활용 방향 정리 10:19 레퍼런스를 참고해 디자인 컨셉 수정 12:00 입력 폼, 상태 메시지, 추첨 화면 등 화면 요소 보강 14:52 Next.js 기반으로 이벤트 페이지 개발 시작 15:25 로그인, 스크린샷 업로드, 주소 입력 등 핵심 기능 정리 17:44 Firebase 기반 인증/저장 구조 결정 19:39 로컬 실행 후 동작 점검 20:27 Firebase 콘솔 설정과 Google 로그인 테스트 46:59 오류 수정 후 참가 완료 플로우 확인 48:33 마무리 및 이벤트 참여 안내 오늘 다룬 내용 - 1만 구독자 기념 도서 이벤트 운영 방식 - 구매 인증과 리뷰 인증을 받는 제출 프로세스 - Pencil로 디자인 시스템과 UI 초안 잡는 방법 - Next.js로 이벤트 페이지 구조를 빠르게 만드는 흐름 - Firebase Auth, Storage, Firestore를 활용한 구현 방향 - Google 로그인과 이미지 업로드 테스트 과정 - 실제 배포와 테스트에서 겪는 시행착오와 수정 포인트 - 참가 완료 후 관리자 측에서 추첨까지 이어지는 구조 #유튜브설명란 #1만구독자이벤트 #도서이벤트 #웹앱제작 #Pencil #Nextjs #Firebase #GoogleLogin #Firestore #FirebaseStorage #UI디자인 #디자인시스템 #개발브이로그 #AI활용 [고정댓글] 1만 구독자 이벤트를 어떻게 운영할지, 직접 웹앱으로 설계하고 구현하는 과정을 담았습니다. Pencil로 디자인 가이드를 잡고, Next.js와 Firebase로 참가 신청, 이미지 업로드, 추첨 구조까지 연결해봅니다. 이벤트 안내와 실전 빌드 과정을 한 번에 보고 싶은 분들께 추천드립니다. 이벤트 신청 페이지 : https://gdrb-book-event.web.app 타임라인 0:00 1만 구독자 이벤트 소개 0:36 도서 구매자 한정 이벤트 진행 방식 설명 1:28 구매 이력 캡처 제출과 랜덤 추첨 안내 2:53 리뷰 캡처도 함께 제출해야 하는 이유 5:08 구매 인증/리뷰 인증을 받는 웹앱 제작 방향 설명 6:12 Pencil로 디자인 가이드 문서 작업 시작 8:00 디자인 시스템 구조와 변수 활용 방향 정리 10:19 레퍼런스를 참고해 디자인 컨셉 수정 12:00 입력 폼, 상태 메시지, 추첨 화면 등 화면 요소 보강 14:52 Next.js 기반으로 이벤트 페이지 개발 시작 15:25 로그인, 스크린샷 업로드, 주소 입력 등 핵심 기능 정리 17:44 Firebase 기반 인증/저장 구조 결정 19:39 로컬 실행 후 동작 점검 20:27 Firebase 콘솔 설정과 Google 로그인 테스트 46:59 오류 수정 후 참가 완료 플로우 확인 48:33 마무리 및 이벤트 참여 안내

* 본 이벤트는 원본 채널에서 직접 주관하며, 유벤트는 정보 제공만을 목적으로 합니다.