GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → davidroyer → nuxt2-ssr-firebase

davidroyer / nuxt2-ssr-firebase

Licence: other
Nuxt2 Universal App with SSR via Firebase Functions and Firebase Hosting

Programming Languages

javascript
184084 projects - #8 most used programming language
Vue
7211 projects
HTML
75241 projects
CSS
56736 projects

Labels

firebasevuessrnuxtnuxtjsfirebase-functionsnuxt2nuxt-edge

Projects that are alternatives of or similar to nuxt2-ssr-firebase

nuxt-ssr-firebase
A example repo for using nuxt with firebase hosting and cloud functions
Stars: ✭ 58 (+16%)
Mutual labels:  nuxt, nuxtjs, firebase-functions
Nuxt Ssr Firebase
Nuxt.js Universal App with SSR via Firebase Functions and Firebase Hosting
Stars: ✭ 273 (+446%)
Mutual labels:  nuxt, nuxtjs, firebase-functions
Virapro.ru
[E-commerce] Plumbing Store
Stars: ✭ 45 (-10%)
Mutual labels:  nuxt, nuxtjs, firebase-functions
nuxtjsbrasil.github.io
Site da comunidade Nuxt Brasil (usando Nuxtjs) 😄
Stars: ✭ 21 (-58%)
Mutual labels:  nuxt, nuxtjs
nuxt-gsap-module
GSAP module for Nuxt.js
Stars: ✭ 183 (+266%)
Mutual labels:  nuxt, nuxtjs
fastify-vue
A nuxt.js fastify plugin
Stars: ✭ 27 (-46%)
Mutual labels:  nuxt, nuxtjs
now-nuxt
A Now v2 Nuxt builder
Stars: ✭ 25 (-50%)
Mutual labels:  nuxt, nuxtjs
create-nuxt-tailwind-app
[DEPRECATED] Use create-nuxt-app, they added full tailwindcss & purgecss support
Stars: ✭ 32 (-36%)
Mutual labels:  nuxt, nuxtjs
platform
Community platform for dancers
Stars: ✭ 30 (-40%)
Mutual labels:  nuxt, nuxtjs
vue-link
One component to link them all 🔗
Stars: ✭ 65 (+30%)
Mutual labels:  nuxt, nuxtjs
nuxt
Nuxt 3 and Vue 3 client for genealogy project. Family tree and genealogy data processing website software client.
Stars: ✭ 97 (+94%)
Mutual labels:  nuxt, nuxtjs
solidata frontend
first draft for solidata_frontend : vue+nuxt+vuetify+i18n+axios
Stars: ✭ 15 (-70%)
Mutual labels:  nuxt, nuxtjs
nuxtswagger
Nuxt-TS-Swagger
Stars: ✭ 17 (-66%)
Mutual labels:  nuxt, nuxtjs
nuxt-typo3
TYPO3 Frontend rendered in Vue.js and Nuxt (frontend for EXT:headless)
Stars: ✭ 66 (+32%)
Mutual labels:  nuxt, nuxtjs
zksync-dapp-checkout
zkCheckout — trustable permissionless DeFi payment gateway. Brand new zkSync dApp w/t all L2 perks: fast&cheap transfers / simple&quick withdrawal
Stars: ✭ 37 (-26%)
Mutual labels:  nuxt, nuxtjs
vue-plausible
Plausible Analytics Vue.js Plugin and NuxtJS Module
Stars: ✭ 107 (+114%)
Mutual labels:  nuxt, nuxtjs
LaraNuxt
Laravel framework with integrated NuxtJs support, preconfigured for eslint, jest and vuetify.
Stars: ✭ 53 (+6%)
Mutual labels:  nuxt, nuxtjs
unnue-nuxt
开媛笔记，基于nuxt ssr首屏服务器端渲染 ⚡。用于分享、记录、交流和学习，希望可以帮助到小伙伴们。同时网站在永久更新，备好鸡血，一起来战 Ooh aah!
Stars: ✭ 98 (+96%)
Mutual labels:  nuxt, nuxtjs
lumen-cms
GraphQL API-First CMS based on NodeJS and Vue 2, Nuxt and Vuetify
Stars: ✭ 77 (+54%)
Mutual labels:  nuxt, nuxtjs
Vuemmerce
👉 Responsive ecommerce template 🛒 built with Vue.js and Nuxt.js
Stars: ✭ 223 (+346%)
Mutual labels:  nuxt, nuxtjs
View All Similar Projects ➔

Nuxt.js Universal App with SSR via Firebase Functions and Firebase Hosting - Nuxt 2 Version

Host a Nuxt Universal app or site by combining Nuxt.js with Firebase Cloud Functions and Hosting.

Live Preview

Pre-Setup: Before Installing Any Dependencies

  1. Obtain a Firebase Project ID to use for this project. See Overiew Here

  2. Inside this directory, locate the file .firebaserc.sample, and do the following:

  • Rename this file to .firebaserc
  • Inside this file, replace your-project-id with your Firebase Project ID.

Setup

We will now get everything setup and deployed in 3 commands:

Note: All of these commands are ran from the root directory

  1. Install Dependencies in all necessary directories in 1 command
yarn setup
# OR
npm run setup
  1. Build The Project
yarn build
# OR
npm run build
  1. Deploy To Firebase
yarn deploy
# OR
npm run deploy

Your site should now be live!

Development

There are 2 development options.

1. Without Firebase Functions

This will be like a normal Nuxt development experienced.

yarn dev

2. With Firebase Functions

This uses Firebase's local development tools to test our project

yarn serve

Firebase Project Setup

  1. Create a Firebase Project using the Firebase Console.

  2. Obtain the Firebase Project ID

Features

  • Server-side rendering with Firebase Hosting combined with Firebase Functions
  • Firebase Hosting as our CDN for our publicPath (See nuxt.config.js)

Things to know...

  • You must have the Firebase CLI installed. If you don't have it install it with npm install -g firebase-tools and then configure it with firebase login.

  • If you have errors, make sure firebase-tools is up to date. I've experienced many problems that were resolved once I updated.

  • The root directory has a package.json file with several scripts that will be used to optimize and ease getting started and the workflow

  • ALL commands are ran from the root directory

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].