Nuxt 3 Template
Using:
- TailwindCSS
- I18n
- NuxtImage
- ColorMode
- NuxtApollo
- Pinia
- Zod
- VueFire
i18n:
Nuxt Color mode: system
NuxtColorMode LinkNuxt Apollo: if data display below then it is work!
{ "posts": { "data": [ { "id": "1", "title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit", "__typename": "Post" }, { "id": "2", "title": "qui est esse", "__typename": "Post" }, { "id": "3", "title": "ea molestias quasi exercitationem repellat qui ipsa sit aut", "__typename": "Post" }, { "id": "4", "title": "eum et est occaecati", "__typename": "Post" }, { "id": "5", "title": "nesciunt quas odio", "__typename": "Post" } ], "meta": { "totalCount": 100, "__typename": "PageMetadata" }, "__typename": "PostsPage" } }
NuxtApollo LinkPinia for Store management
Counter Store
Counter: 2. Double: 4
Increment the Store:
Other actions:
Complete store state via store.$state:
{
"n": 2,
"incrementedTimes": 0,
"decrementedTimes": 0,
"numbers": []
}Zod: TypeScript-first schema validation
Zod Documentation LinkVueFire CurrentUser: Sign In First! User will display here
Firebase Client for vue3, Nuxt 3 Module is still in development.
To create vuefire client, You need to create vuefire plugins. see file /plugins/vuefire_client.ts for more info.