Vue3 ๊ธฐ์ด๋ฅผ ๋ฐฐ์ฐ์
จ๋์?
์ด์ ์ ๋๋ก ํ์ฉํ ์ฐจ๋ก์
๋๋ค! โจ
์ธํ๋ฐ ์๊ฐํ๊ธฐ ์ด๋ฒคํธ ์งํ์ค ๐
์๋
ํ์ธ์ ๐ Vue3 & Firebase10 ์ปค๋ฎค๋ํฐ ๋ง๋ค๊ธฐ ๊ฐ์ ์๊ฐํ๊ธฐ ์ด๋ฒคํธ๋ฅผ ์งํํ๊ณ ์์ด์.
ํด๋น ๊ฐ์๋ฅผ ์๊ฐํ์ ํ ์ ์ฑ์ค๋ฝ๊ฒ ์๊ฐํ๊ธฐ๋ฅผ ์์ฑํด์ฃผ์๋ฉด ๊ฐ์ ๋ฌด๋ฃ์ฟ ํฐ 1๊ฐ๋ฅผ ๋๋ฆฝ๋๋ค.
(์ ์ฐฉ์ 30๋ช
)
์ต์ ๊ธฐ์ ์ ํ์ฉํ
Vue 3 & Firebase 10 ์ปค๋ฎค๋ํฐ ๋ง๋ค๊ธฐ ๐
์๋
ํ์ธ์! ์ด๋ฒ ๊ฐ์๋ Vue3์ Firebase๋ฅผ ํ์ฉํ์ฌ ์ปค๋ฎค๋ํฐ ์น์ ๋ง๋๋ ๊ฐ์๋ก, ์ด๋ฒ ๊ฐ์๋ฅผ ์๊ฐํ์ ๋ค๋ฉด Vue3 Composition API ์ค๋ฌด ํ์ฉ๋ฒ! ๊ทธ๋ฆฌ๊ณ Firebase ๊ธฐ์ด๋ถํฐ ์ค์ ๊น์ง ํ ๋ฒ์ ๋ด ๊ฒ์ผ๋ก ๋ง๋ค ์ ์๋ ๊ฐ์์
๋๋ค.
ํ๋ก ํธ์๋ ์น์ ๊ฐ๋ฐํ ๋ ์๋ํฐ, ๋ฌดํ ์คํฌ๋กค๋ง, ๊ฒ์ ๊ธฐ๋ฅ, ๋๋ฒ๊น
๋ฑ ๋ค์ํ ์ง์์ด ํ์ํ๋ฐ์. ํด๋น ๊ฐ์์์๋ ์ค๋ฌด ๊ฒฝํ์์ ์ ์ ์๋ ๋ค์ํ ์น ๊ธฐ์ ๊น์ง ์ต๋ํ์ฌ ๊ฐ๋ฐ์๋ก์ ํ ๋จ๊ณ ์ฑ์ฅํ ์ ์๋ ๊ฐ์์
๋๋ค.
์ค์ ์ ์ธ์ ๋ ์ค์ํ๋๊น ๐ป
์ฌ์ค ์ด๋ฒ ๊ฐ์๋ ์ ๊ฐ ์ด์ ์ ๋ก ์นญํ "Vue3 ์๋ฒฝ ๋ง์คํฐ (๊ธฐ๋ณธํธ/์ค์ ํธ)" ์ด์ ๋ถํฐ ๊ธฐํํ๋ ๊ฐ์์
๋๋ค. ์๋ํ๋ฉด ์ด๋ค ๊ธฐ์ ์ ์ตํ ๋ ๋ฐฐ์ฐ๋ ๊ฒ๋ ์ค์ํ์ง๋ง ๋ฐฐ์ด ๊ธฐ์ ์ ํ์ฉํด์ ๋ฌด์ธ๊ฐ ๋ง๋ค์ด ๋ณด๋ ๊ฒ ๋ํ ์ ๋ง ์ค์ํ๊ธฐ ๋๋ฌธ์ด์ฃ .
Vue 3 & Firebase 10 ์ปค๋ฎค๋ํฐ ๋ง๋ค๊ธฐ ํ์คํ - "ํ์ฉํธ" (with Pinia, Quasar, Tiptap, VueUse)
์ง์ฝ๋ฉ
์ค๊ธ์ด์ / Vue.js, Firebase, Quasar, Vue 3, algolia
๋ต๋ณ ํ๋ฐ
๋ต๋ณ ํ๋ฐ
Vue3 & Firebase(v10)๋ฅผ ํ์ฉํ์ฌ ์ปค๋ฎค๋ํฐ๋ฅผ ๋ง๋๋ ๊ฐ์๋ก Vue3 ์ค์ ํ์ฉ๋ฒ, Firebase ๊ธฐ์ด๋ถํฐ ์ค์ , ์ต์ ์น ๊ธฐ์ ํ์ฉ๋ฒ, ์ง์๊ณต์ ์ ๊ฒฝํ ๊ณต์ ๋ฑ ๋ค์ํ ๋ฐฉ๋ฉด์ผ๋ก ๊ฐ๋ฐ์๋ก์จ ํ ๋จ๊ณ ์ฑ์ฅํ ์ ์๋๋ก ๋์ต๋๋ค!

์ค๊ธ์ด์
Vue 3 & Firebase 10 ์ปค๋ฎค๋ํฐ ๋ง๋ค๊ธฐ ํ์คํ - "ํ์ฉํธ" (with Pinia, Quasar, Tiptap, VueUse)
์ง์ฝ๋ฉ
์ค๊ธ์ด์ / Vue.js, Firebase, Quasar, Vue 3, algolia
๋ต๋ณ ํ๋ฐ
๋ต๋ณ ํ๋ฐ
์ฐ๋ฆฌ๊ฐ ์ด์ ๋ฉดํ๋ฅผ ์ทจ๋ํ๊ณ ์๋์ฐจ๋ฅผ ๋ชฐ์๋ณด๋ฉด ์๊ฐ๋ณด๋ค ์ฝ์ง ์์ ๊ฑฐ์์. ์ค์ ๋ก ์ด์ ํ ๋๋ ์ด์ ์ ๋ฐฐ์ธ ๋ ์์๋ ๋ค์ํ ์ด๋ ค์์ด ์๊ธฐ ๋๋ฌธ์ธ๋ฐ์.
์น ๊ฐ๋ฐ๋ ๋ง์ฐฌ๊ฐ์ง์
๋๋ค. Vue.js๋ผ๋ ๊ธฐ์ ์ ๋ฐฐ์ฐ๊ณ ๋ฌด์ธ๊ฐ๋ฅผ ๋ง๋ค์ด ๋ณด์ง ์๋๋ค๋ฉด ์ฑ์ฅ์ ๋๋ ๊ฑฐ์์. ๊ทธ๋ฆฌ๊ณ Vue3๋ฅผ ๋ฐฐ์ฐ๊ณ ์ค์ ๋ฌด์ธ๊ฐ๋ฅผ ๋ง๋ค๋ ค๊ณ ํด๋ ์ฝ์ง ์์ ๊ฒ๋๋ค. ์ค์ ๋ก ์น์ ๊ฐ๋ฐํ ๋๋ ํต์ฌ์ด ๋๋ ๊ธฐ์ ๋ ์ค์ํ์ง๋ง, ๊ทธ ์ฃผ๋ณ ํ๋ก ํธ์๋ ์ํ๊ณ ๊ธฐ์ ์ด๋ ๊ฒฝํ์์ ์ ์ ์๋ ์คํฌ ๊ฐ์ ๊ฒ๋ค๋ ๊ต์ฅํ ์ค์ํ๊ฑฐ๋ ์. ์ค์ ์น ์ ํ๋ฆฌ์ผ์ด์
์ ๋ง๋ค๋ ค๊ณ ํด๋ณด์ ๋ถ๋ค์ ๋ง์ด ๊ณต๊ฐํ์ค ๊ฑฐ์์.
"๋ง์ ์ฌ์ดํธ๋ฅผ ์ ์ํ๋ ค๊ณ ํ๋ฉด ์ด๋ ค์์ด ์๋๋ผ๊ณ ์..."
๊ทธ๋์ Vue3 & Firebase๋ฅผ ํ์ฉํ ์ปค๋ฎค๋ํฐ ๋ง๋ค๊ธฐ ๊ฐ์๋ฅผ ๋ก ์นญํ๊ฒ ๋์๋๋ฐ์. ์ด๋ฒ ๊ฐ์๋ ์์์ ๋ง์๋๋ ธ๋ ๊ฒ์ฒ๋ผ Vue3 ์ค๋ฌด ํ์ฉ๋ฒ, Firebase ๊ธฐ์ด๋ถํฐ ์ค์ ๊น์ง! ๊ทธ๋ฆฌ๊ณ ์ค์ ์น ์ ํ๋ฆฌ์ผ์ด์
์ ๋ง๋ค ๋ ๋ฐ์ํ ์ ์๋ ๋ค์ํ ์ด๋ ค์์ ํด์ํ ์ ์๋ ๊ฐ์์
๋๋ค.
์ด ๊ฐ์๋ง์ ํน์ฅ์ โจ
๐ Firebase๋ ๋ชจ๋ฅด์
๋ ๋ผ์! ์์ ๊ธฐ์ด๋ถํฐ ์ค์ ๊ทธ๋ฆฌ๊ณ ๋ฐฐํฌ๊น์ง ํ ๋ฒ์ ๋ฐฐ์ธ ์ ์์ด์.
ํ๋ก ํธ์๋ ๊ฐ๋ฐ์์๊ฒ Firebase๋ ์ ๋ง ๋งค๋ ฅ์ ์ธ ๊ธฐ์ ์
๋๋ค.
์ฐ๋ฆฌ๊ฐ ์น ๊ธฐ์ ์ ๊ณต๋ถํ๊ฑฐ๋ ์ค์ ๋ก ์น ์ฑ์ ๋ง๋ค ๋ ๋ฐฑ์๋๊ฐ ํ์ํ ๊ฒฝ์ฐ๊ฐ ์๋๋ฐ์. ์ด๋ด ๋ Firebase๋ฅผ ํ์ฉํ๋ฉด ํ์๊ฐ์
, ๋ฐ์ดํฐ๋ฒ ์ด์ค ๊ด๋ฆฌ, ํ์ผ ์
๋ก๋, ํธ์ ์๋ฆผ ๋ฑ๊ณผ ๊ฐ์ ์๋น์ค๋ฅผ ์ฝ๊ฒ ๊ตฌํํ ์ ์๊ฑฐ๋ ์.
๐ Fallthrough ์์ฑ, ๋์ & ๋น๋๊ธฐ ์ปดํฌ๋ํธ, ์ปดํฌ์ ๋ธ ํจ์ ๋ฑ ์ค์ ์ผ๋ก ํ์คํ ์ดํดํด์!
๊ฐ์๋ฅผ ํตํด Pinia(with Setup Stores ๋ฌธ๋ฒ), Quasar, VueUse, Tiptap Editor, Algolia Search ๋ฑ ์ค์ ์น ์ ํ๋ฆฌ์ผ์ด์
์ ๋ง๋ค๊ธฐ ์ํด ํ์ํ ๋ค์ํ ๊ธฐ์ ์ ์ตํ ์ ์๊ณ ์. Dynamic Component(๋์ ์ปดํฌ๋ํธ), Async Component (๋น๋๊ธฐ ์ปดํฌ๋ํธ for ์ง์ฐ๋ก๋ฉ) ๊ทธ๋ฆฌ๊ณ Composables ํจ์ ๊ตฌํ ๋ฑ Vue3 ์ค๋ฌด ํ์ฉ๋ฒ์ ์ ๋๋ก ํ์ตํ ์ ์์ต๋๋ค.
๐ ์๊ฐ์ ์ฌ๋ฌ๋ถ๋ค์ด ์ค์ค๋ก ํด๋ด๋ ํ์ ๊ธธ๋ฌ๋๋ฆฝ๋๋ค. ์ ๋ ํํ ์์ ๊ฑฐ์์!
์ด๋ฒ ๊ฐ์๋ ๋จ์ํ ์ด๋ค ๊ธฐ์ ์ ์๋ ค๋๋ฆฌ๋ ๊ฐ์๊ฐ ์๋์์.
- ๋ฒ๊ทธ๊ฐ ๋ฐ์ํ์ ๋ ์ ๋ ์ด๋ป๊ฒ Breakpoint๋ฅผ ์ฌ์ฉํ๊ณ ๋๋ฒ๊น
์ ํ๋์ง
- ๋ ์ ๊ฐ ์ด๋ ํ ๊ธฐ์ ์ ์ตํ ๋ ๊ณต๋ถ๋ฒ์ ์ด๋ป๊ฒ ๋๋์ง
- ๊ทธ๋ฆฌ๊ณ Firebase๋ฅผ ํ์ตํ ๋ ๊ณต์ ๋ฌธ์๋ฅผ ์ด๋ป๊ฒ ๋ณด๋์ง
๊ฐ์์์ ์ ๊ฒฝํ๊ณผ ์๊ฐ์ ๊ณต์ ํด ๋๋ฆฌ๋๋ฐ์. ์๊ฐ์๋ถ๋ค์๊ฒ ์ค์ค๋ก ํด๋ด๋ ํ์ ๋๋ฆฌ๊ธฐ ์ํจ์
๋๋ค. ์ด๋ฒ ๊ฐ์๋ฅผ ๋ณด์๋ฉด ๋๋ผ์ค ๊ฑฐ์์! ๊ณต์ ๋ฌธ์๋ฅผ ์ด๋ป๊ฒ ๋ณด๋์ง, ๊ฐ์๊ฐ ์์ด๋ ์๊ฐ์ ๋ถ๋ค์ด ์ค์ค๋ก ํ ์ ์๋๋ก ์์ธํ ๊ทธ๋ฆฌ๊ณ ๋ฐ๋ณต์ ์ผ๋ก ์๋ ค๋๋ฆฝ๋๋ค. ์ต์ํด์ง ์ ์๋๋ก ์ด์!
ํ์ต ๋ด์ฉ ๐
์น์
0. ์์ํ๊ธฐ
- ํจ๊ป ๊ฐ๋ฐ ํ๊ฒฝ์ ๊ตฌ์ฑํ๊ณ ํ๋ก์ ํธ๋ฅผ ์์ฑ
์น์
1. Auto Page&Layout ์ค์
- ์๋์ผ๋ก Page&Layout ๋ผ์ฐํ
์ด ์ค์ ํ ์ ์๋๋ก ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ์ค์
- ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ์ค์ ํ๋ฉฐ ์ง์๊ณต์ ์์ ์ธ์ฌ์ดํธ๋ฅผ ๊ณต์
์น์
2. Quasar ํ์ฉ UI ๋ง๋ค๊ธฐ
- Quasar๋ฅผ ํ์ฉํ์ฌ ์ฝ๊ณ ๋น ๋ฅด๊ฒ ์น ๋ ์ด์์, ์ปค๋ฎค๋ํฐ UI ๋งํฌ์
- router-link vs router.push() ์ฐจ์ด
- ๋์ ์ปดํฌ๋ํธ, ๋น๋๊ธฐ ์ปดํฌ๋ํธ๋ฅผ ํ์ฉํ ์ฑ๋ฅ ๊ฐ์
- $attrs, $slots Vue ๋ด์ฅ ๊ฐ์ฒด ํ์ฉ
- Fallthrough ์์ฑ๊ณผ inheritAttrs ์ต์
์ดํด
- ๋ค์ค v-model, VueRouter ์ค์ฒฉ ๋ ์ด์์
์น์
3. Firebase ์์ํ๊ธฐ
- ํ๋ก์ ํธ์์ ์ฌ์ฉํ Firebase ์๋น์ค์ ๊ณต์ ๋ฌธ์ ๋ณด๋ ๋ฒ ์ค๋ช
- Firebase ํ๋ก์ ํธ ์์ฑ ๋ฐ ์ค์น
์น์
4. Firebase Authentication
- Firebase๋ฅผ ํ์ฉํ ์ด๋ฉ์ผ ํ์๊ฐ์
, ๊ตฌ๊ธ ๋ก๊ทธ์ธ, ์ฌ์ฉ์ ์ ๋ณด ๊ด๋ฆฌ
- Pinia Setup Stores ๋ฌธ๋ฒ์ ํ์ฉํ ์ฌ์ฉ์ ์ํ ๊ด๋ฆฌ
- ์ง์๊ณต์ ์์ ๊ณต๋ถ๋ฒ ๊ณต์
์น์
5. VueUse & ๊ณตํต ๊ธฐ๋ฅ
- VueUse ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ํ์ฉํ ๋น๋๊ธฐ ์ํ ๊ด๋ฆฌ ๋ฐ Pinia ์ํ ์ ์ง
- Local & Global Error Handling
- Tiptap Editor ๋ง๋ค๊ธฐ (๋ค์ํ Tiptap Extensions ํ์ฉ)
์น์
6. Firebase Cloud Firestore
- ์ปค๋ฎค๋ํฐ์ ๋๊ธ ๊ธฐ๋ฅ CRUD ๊ตฌํ
- setDoc vs addDoc ์ฐจ์ด ๋ฑ Firebase ์ฌ์ฉ ๊ฒฝํ์์ ์ ์ ์๋ ํ ๊ณต์
- ์ฟผ๋ฆฌ, ์ ๋ ฌ, ๊ฒ์๊ธ ๋๋ณด๊ธฐ ๋ฑ ์กฐ๊ธ ๋ ๋ณต์กํ ๊ธฐ๋ฅ ๊ตฌํ
์น์
7. Web API & ๊ณ ๋ํ
- IntersectionObserver ํ์ฉ ๋ฌดํ ์คํฌ๋กค ๊ธฐ๋ฅ
- Intl.RelativeTimeFormat ํ์ฉ ์๋์๊ฐ ํ์
- ํ๋ผ๋ฏธํฐ URL ์ฐ๋
- ๋ด๋น๊ฒ์ด์
๊ฐ๋ & ํด๋ผ์ด์ธํธ ๋ณด์
- ์ข์์, ๋ถ๋งํฌ, ์กฐํ์ ์ฆ๊ฐ ๊ธฐ๋ฅ ๊ตฌํ
์น์
8. Firebase Storage
- Tiptap Editor์์ Firebase Storage ์ด๋ฏธ์ง ์
๋ก๋
- ์ด๋ฏธ์ง ์
๋ก๋์ UUID, Image Resizer ํ์ฉ
์น์
9. Firebase Cloud Functions
- Cloud Functions & Emulator ์ค์น
- Functions๋ฅผ ํ์ฉํ ๊ณ ๋ํ๋ ๊ธฐ๋ฅ ๊ตฌํ
- Firebase Emulator๋ฅผ ํ์ฉํ ๋ก์ปฌ ํ
์คํธ
- ๊ฒ์๊ธ ๋ฐ ๋๊ธ ์์ฑ์ ํ์ํ๊ธฐ
์น์
10. Algolia Search
- Algolia Search Extension ์ค์น
- Algolia ๊ฒ์ ๊ธฐ๋ฅ ํ๋ก์ ํธ ์ ์ฉ
์น์
11. Firebase ๋ณด์ ๊ท์น & ๋ฐฐํฌ(Hosting)
- Firebase ๋ณด์๊ท์น ์ค์
- Firebase Hosting ๋ฐฐํฌ
์ด๋ฐ ๋ถ๋ค๊ป ์ถ์ฒํด์ ๐
- Vue3 ํ์ฉ๋ฒ์ ํ์ตํ์ฌ ๊ฐ๋ฐ์๋ก์ ํ ๋จ๊ณ ์ฑ์ฅํ๊ณ ์ถ์ผ์ ๋ถ!
- Firebase๋ฅผ ํ์ฉํด์ ์ค์ ์น ์ ํ๋ฆฌ์ผ์ด์
์ ๋ง๋ค๊ณ ์ ํ์๋ ๋ถ!
- ์ต์ ์น ๊ธฐ์ , ๋ผ์ด๋ธ๋ฌ๋ฆฌ ๋ฑ ์น ์ฑ์ ๋ง๋ค ๋ ํ์ํ ๊ธฐ์ ์ ๋ฐฐ์ฐ๊ณ ์ถ์ผ์ ๋ถ!
๊ฐ์๋ฅผ ๋ค์ ํ ์ฌ๋ฌ๋ถ์ ๐
- ์ปดํฌ์ ๋ธ ํจ์๋ฅผ ์ฝ๊ฒ ๋ถ๋ฆฌํ๋ ๋ฑ Vue3๋ฅผ ์์ ์๊ฒ ํ์ฉํ ์ ์์ต๋๋ค.
- Firebase๋ฅผ ํ์ฉํด์ ๋๋ง์ ์น ์๋น์ค๋ฅผ ๋ง๋ค๊ณ ๋ฐฐํฌ๊น์ง ํ ์ ์์ต๋๋ค.
- ์ด๋ค ๊ธฐ์ ์ ๋ฐฐ์ฐ๋ ๊ณต์๋ฌธ์๋ฅผ ๋ณด๊ณ ์ค์ค๋ก ํ์ต๋ ํ์ ๊ฐ๊ฒ ๋ฉ๋๋ค.
์์ ์ง๋ฌธ Q&A ๐ฌ
Q. Quasar Framework๋ฅผ ์๊ณ ์์ด์ผ ์๊ฐํ ์ ์๋์?
์๋๋๋ค :)
Quasar Framework๋ฅผ ๋ชจ๋ฅด์
๋ ์๊ฐํ๋ ๋ฐ ์ง์ฅ ์์ต๋๋ค. Quasar๋ ์ปค๋ฎค๋ํฐ UI๋ฅผ ๋ง๋ค๊ธฐ ์ํ ๋๊ตฌ๋ก ์ฌ์ฉ๋๋ฉฐ ๊ฐ์๋ฅผ ๋ณด์๋ฉฐ ์ฒ์ฒํ ๋ฐ๋ผ์ค์๋ฉด ๋ผ์! ๊ทธ๋ฆฌ๊ณ ๊ฐ์ ์ค๊ฐ์ค๊ฐ ํ์ด์ฌ๋ฅผ ๋ชจ๋ฅด์๋ ๋ถ๋ค์ ์ํด ๊ธฐ๋ณธ ์ง์์ ์ค๋ช
ํ๋ฉด์ ์งํํฉ๋๋ค. ๐
์์ธ๋ฌ Quasar๋ฅผ ๋ชจ๋ฅด์
๋ ์๊ฐํ๋ ๋ฐ ์ง์ฅ์ ์์ง๋ง ์๋ ๋งํผ ๋ณด์ธ๋ค๊ณ ํ์์์? ๋ฌผ๋ก ํ์ด์ฌ๋ฅผ ์๊ณ ์๋ค๋ฉด ์์ผ๊ฐ ๋ ๋์ด์ง์ค ๊ฑฐ์์!
์ง์ฝ๋ฉ ์ ํ๋ธ ์ฑ๋์ ์๋ ํ์ด์ฌ ๋ฌด๋ฃ ๊ฐ์๋ผ๋ ๋ณด์๋ฉด ๋์์ด ๋์ค ๊ฑฐ์์ :)
ํ์ด์ฌ ๋ฌด๋ฃ ๊ฐ์ ์ ํ๋ธ ๋งํฌ
Q. Firebase๋ฅผ ์๊ณ ์์ด์ผ ์๊ฐํ ์ ์๋์?
์๋๋๋ค :)
๋ณธ ๊ฐ์๋ Firebase๋ฅผ ๋ฐฐ์ฐ๋ฉฐ ์ปค๋ฎค๋ํฐ๋ฅผ ๋ง๋๋ ๊ฐ์๋ก Firebase๋ฅผ ์์ ๋ชจ๋ฅด์
๋ ์๊ฐํ๋ ๋ฐ ์ง์ฅ ์์ต๋๋ค. ๋ณธ ๊ฐ์์์๋ Firebase ๊ธฐ์ด๋ถํฐ ์ค์ ๋ฟ๋ง ์๋๋ผ ๊ณต์ ๋ฌธ์๋ฅผ ๋ณด๊ณ ์ค์ค๋ก ๊ณต๋ถํ๋ ๋ฒ ๋ฑ ๊ฐ๋ฐ์๋ก์ ํ ๋จ๊ณ ์ฑ์ฅํ ์ ์๋๋ก ํ์ด ๊ฐ์์
๋๋ค.
Q. Vue3๋ฅผ ์๊ณ ์์ด์ผ ์๊ฐํ ์ ์๋์?
๋ค ๋ง์ต๋๋ค :)
๋ณธ ๊ฐ์๋ Vue3๋ฅผ ์๊ณ ์์ด์ผ ์๊ฐํ ์ ์์ต๋๋ค. ์๋ ๋งํฌ๋ ์ ๊ฐ ๋ก ์นญํ Vue3 ๊ฐ์์
๋๋ค. ์๊ฐํ ๋ฐ ์ปค๋ฆฌํ๋ผ ๊ทธ๋ฆฌ๊ณ ๋ง๋ณด๊ธฐ ๊ฐ์๋ฅผ ๋ณด์๊ณ ๊ด์ฐฎ๋ค ์ถ์ผ์๋ฉด ์๊ฐํด ์ฃผ์๋ฉด ๊ฐ์ฌ๋๋ฆฌ๊ฒ ์ต๋๋ค.
๊ฐ์ ๋ก๋๋งต ๐ข
์๋ ์์๋๋ก์ ํ์ต์ ์ถ์ฒ๋๋ ค์!
Vue 3 & Firebase 10 ์ปค๋ฎค๋ํฐ ๋ง๋ค๊ธฐ ํ์คํ - "ํ์ฉํธ" (with Pinia, Quasar, Tiptap, VueUse)
์ง์ฝ๋ฉ
์ค๊ธ์ด์ / Vue.js, Firebase, Quasar, Vue 3, algolia
๋ต๋ณ ํ๋ฐ
๋ต๋ณ ํ๋ฐ
Vue3 & Firebase(v10)๋ฅผ ํ์ฉํ์ฌ ์ปค๋ฎค๋ํฐ๋ฅผ ๋ง๋๋ ๊ฐ์๋ก Vue3 ์ค์ ํ์ฉ๋ฒ, Firebase ๊ธฐ์ด๋ถํฐ ์ค์ , ์ต์ ์น ๊ธฐ์ ํ์ฉ๋ฒ, ์ง์๊ณต์ ์ ๊ฒฝํ ๊ณต์ ๋ฑ ๋ค์ํ ๋ฐฉ๋ฉด์ผ๋ก ๊ฐ๋ฐ์๋ก์จ ํ ๋จ๊ณ ์ฑ์ฅํ ์ ์๋๋ก ๋์ต๋๋ค!

์ค๊ธ์ด์
Vue 3 & Firebase 10 ์ปค๋ฎค๋ํฐ ๋ง๋ค๊ธฐ ํ์คํ - "ํ์ฉํธ" (with Pinia, Quasar, Tiptap, VueUse)
์ง์ฝ๋ฉ
์ค๊ธ์ด์ / Vue.js, Firebase, Quasar, Vue 3, algolia
๋ต๋ณ ํ๋ฐ
๋ต๋ณ ํ๋ฐ
์ง์ฝ๋ฉ๊ณผ ํจ๊ปํ๋
์ค์ฉ์ ์ธ ์ฝ๋ฉ ํ์ต ๐ช
์๋
ํ์ธ์, ์ฝ๋ฉ ๊ต์ก ํฌ๋ฆฌ์์ดํฐ ์ง์ฝ๋ฉ์
๋๋ค.
์ ํ๋ธ "์ง์ฝ๋ฉ GYM CODING" ์ฑ๋์ ์ด์ํ๊ณ ์์ด์!
๋ง์ ๋ถ๋ค์ด ์ด์ ์ ๋ก ์นญํ Vue3 ์๋ฒฝ ๋ง์คํฐ ๊ฐ์๋ฅผ ์ฌ๋ํด ์ฃผ์
์ Vue3 ํ์ฉํธ์ธ Vue3 & Firebase ์ปค๋ฎค๋ํฐ ๊ฐ์๋ฅผ ๋ก ์นญํ๊ฒ ๋์์ด์!
์ ๊ฐ์์ ๊ด์ฌ๊ฐ์ ธ ์ฃผ์
์ ๊ฐ์ฌ๋๋ฆฌ๋ฉฐ ์์ผ๋ก ๋ ์ข์ ์ฝํ
์ธ ๋ก ๋ณด๋ตํ๊ฒ ์ต๋๋ค ๐ช