자동 재생
자동 완성
이전 강의
완료하고 계속하기
Vue3 & Firebase 커뮤니티 풀스택
시작하기
강의소개 (4:59)
오리엔테이션 & 동기부여 (11:21)
개발환경 구성 (5:07)
프로젝트 생성 (8:37)
Auth Page&Layout 설정
Auth Page 설정 : unplugin-vue-router (22:09)
Auto Layout 설정 : vite-plugin-vue-layouts (29:04)
Quasar 활용 UI 만들기
웹 레이아웃 구성 : router-link vs router.push (25:46)
로그인/회원가입 UI : "실무에서 유용한 로그인 팝업" (24:32)
로그인 팝업 성능개선 : Dynamic&Lazy Load 컴포넌트 (8:30)
커뮤니티 목록 UI : "컴포넌트 배치 및 정렬 친해지기!" (24:56)
커뮤니티 목록 필터 & 정렬 UI : "레이아웃 3단 분리" (27:53)
커뮤니티 상세 UI : "컴포넌트 배치 & 정렬 자신감 얻기!" (26:08)
컴포넌트 분리 : "$attrs, $slots Vue 내장 객체 활용" (8:41)
커뮤니티 글쓰기 UI : "Fallthrough 속성과 inheritAttrs 옵션 이해" (27:21)
커뮤니티 수정 UI : "Multiple v-model 기반 Form 컴포넌트" (14:51)
마이페이지 UI : VueRouter 중첩 레이아웃 구성 (10:39)
Firebase 시작하기
파이어베이스 둘러보기 : 공식문서 보는 법 (8:04)
파이어베이스 프로젝트 생성 및 설치 (8:08)
Firebase Authentication
Google 로그인 : Pinia Setup Stores User 상태관리 (21:55)
Email 회원가입&로그인 : "재밌는 사용자 썸네일 생성" (23:19)
비밀번호 초기화 : "제 공부법도 공유 드려요" (9:26)
비밀번호 변경하기 (6:22)
Email 인증하기 (11:54)
[추가영상] 추가영상 관련 설명
사용자 프로필 & 이메일 수정 (14:22)
[추가영상] 이메일 열거 보호 비활성화 (5:53)
공통 기능
LocalStorage로 Pinia 상태유지 : VueUse 활용하기! (7:09)
Form 유효성 체크 : Quasar Validation 활용 (13:06)
Local Error Handling (16:27)
Global Error Handling (8:54)
비동기 상태(loading, error) 관리 : VueUse 활용하기! (33:28)
Tiptap Editor 만들기 : 다양한 Tiptap Extensions 활용 (27:43)
Firebase Cloud Firestore
Firestore 용어 및 데이터 구조 (9:23)
커뮤니티 글 저장 : setDoc vs addDoc "화이팅!" (39:30)
커뮤니티 목록 조회 (11:13)
커뮤니티 목록 필터 : 복합 쿼리 및 쿼리 연산자 활용 (32:10)
커뮤니티 정렬 구현 : "모두 함께 화이팅해요!!" (19:11)
커뮤니티 상세페이지 구현 (12:18)
커뮤니티 수정 (9:35)
커뮤니티 삭제 (4:41)
댓글 등록, 조회 그리고 삭제 (21:18)
커뮤니티 더보기 기능 구현 : Firestore 쿼리 커서 활용 (16:46)
Web API & 고도화
상대시간 표시 : Intl.RelativeTimeFormat (13:15)
무한 스크롤링 구현 : Web API IntersectionObserver (9:17)
파라미터 URL 연동 : "계속해서 반복하다 보면 익숙해 지는 거 같아요 :)" (13:56)
VueRouter 네비게이션 가드 (8:28)
클라이언트 보안 (8:51)
좋아요 기능 : useLike Composables (35:25)
북마크 기능 : useBookmark Composables (23:43)
조회수 증가 : increment (5:45)
Firebase Storage
TiptapEditor 이미지 업로드 : UUID, Image Resizer 활용 (22:09)
Firebase Cloud Functions
Cloud Functions이란? : 다양한 활용 리뷰! (5:32)
Cloud Functions 시작하기 (14:23)
좋아요 수, 북마크 수, 댓글 수 카운팅 (26:54)
사용자 데이터 users 컬렉션에 쌓기 (27:35)
태그 데이터 tags 컬렉션에 쌓기 (23:57)
게시글, 댓글 작성자 표시하기 (10:00)
게시글 목록 태그 조회 하기 (4:30)
Algolia Search
Algolia 시작하기 : "텍스트 검색을 위한" (13:59)
Algolia Search 적용 : "검색 기능 추가" (32:00)
Firebase 보안규칙 & 배포 (Hosting)
Firebase 보안규칙 설정 (13:32)
Firebase Hosting 배포 (4:25)
마치며
소스수정 (3:42)
마무리 🎉 (3:41)
Teach online with
커뮤니티 삭제
강의가 잠겨 있어요 🥲
이미 수강신청을 하셨다면,
로그인을 해주세요
.
수강 신청하고 강의보기