์๋ ์ฌ์
์๋ ์์ฑ
์ด์ ๊ฐ์
์๋ฃํ๊ณ ๊ณ์ํ๊ธฐ
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
๋ง๋ฌด๋ฆฌ ๐
๊ฐ์๊ฐ ์ ๊ฒจ ์์ด์ ๐ฅฒ
์ด๋ฏธ ์๊ฐ์ ์ฒญ์ ํ์ จ๋ค๋ฉด,
๋ก๊ทธ์ธ์ ํด์ฃผ์ธ์
.
์๊ฐ ์ ์ฒญํ๊ณ ๊ฐ์๋ณด๊ธฐ