Firebase full password authentication (register, login, forget password, reset password), google/twitter/facebook authentication
nuxt generate
is really sucks!!! We lost nuxtServerInit
, dynamic routing stuff etc. We need a good alternative to deploy our applications to the cloud without VPS and SSL configuration.
This repository is created as a sample of using nuxt on firebase-functions+firebase-hosting and still SSR and has the nuxtServerInit
functionality as active.
Firebase full password authentication (register, login, forget password, reset password), google authentication, twitter authentication, facebook authentication in nuxt
.
DEMO: https://nuxt-ts-firebase-auth-ssr.firebaseapp.com/
See the Features for more functionalities
src
: the source of the functions|-- functions
| |-- modules
| | |-- handlers-module
| | | `-- src
| | `-- types-module
| | `-- src
| `-- src
`-- src
|-- assets
|-- components
|-- i18n
|-- layouts
|-- middleware
|-- mixin
|-- pages
|-- plugins
|-- server
|-- service
|-- static
|-- store
|-- types
Coming soon
lang
build
Have a look Trello Board for more coming functionality
create a firebase project on https://console.firebase.google.com/
.firebaserc
update .firebaserc
with the project created/owned by you
If you already have a project you can use it too.
This configuration is necessary for nuxt
serverSiddle
, If you use firebase-functions skip this step.
server/config/firebase-admin-credentials.json
TBD
create a development
branch and use that branch for development. Create a new project on firebase and setup development
branch with the new firebase project
don't confuse yourself to work on multi-environment in one repository/branch
create .env
file with below content or rename .env.template
file
WEBSITE_URL=https://nuxt-ts-firebase-auth-ssr.firebaseapp.com
# axios config
#API_URL=http://localhost:3000/api
#API_URL=http://localhost:5000/api
API_URL=https://nuxt-ts-firebase-auth-ssr.firebaseapp.com/api
# firebase config
FIREBASE_API_KEY= ***
FIREBASE_AUTH_DOMAIN= ***
FIREBASE_DATABASE_URL= ***
FIREBASE_PROJECT_ID= ***
FIREBASE_STORAGE_BUCKET= ***
FIREBASE_MESSAGING_SENDER_ID= ***
FIREBASE_APP_ID= ***
FIREBASE_MEASUREMENT_ID= ***
the root package.json
has been created to manage build and deployment easily.
npm install
or npm i
)$ npm run install
This command builds and deploys firebase-functions from functions and firebase-hosting from src
$ firebase deploy
The following command prepares what are necessary to run the application locally. It builds src
and function
and generates the public
folder.
$ npm run build
and then
$ firebase serve
you will see the links as output of the command
local
developmentFirstly, deploy functions to firebase
$firebase deploy --only functions:apiApp
and then
be sure the API_URL configured as
firebase-functions
likeAPI_URL=https://nuxt-ts-firebase-auth-ssr.firebaseapp.com/api
cd src
npm run dev
It is possible to run the project as just a nuxt
application. With the following instructions, firebase-function
is never be in use
Ignore
functions
, just work onsrc
serverMiddleware
in src/nuxt.config.ts
serverMiddleware: [
'~/server/api',
'~/server/sitemap'
],
.env
API_URL=https://localhost:3000/api
cd src
npm run dev
Please feel free to send a pull request. Welcome :)
strategy: 'no_prefix',
changeLocale() {
this.$i18n.setLocale(this.$i18n.locale === 'en' ? 'tr' : 'en')
}
for the other strategy
<nuxt-link :to="switchLocalePath('en')">English</nuxt-link>
<nuxt-link :to="switchLocalePath('tr')">Turkish</nuxt-link>
add client-only
tag
<client-only>
...
</client-only>
To list outdated libraries
npm install -g npm-check-updates
to update the outdated libraries
ncu -u
npm install