|
| 1 | +<!-- START doctoc generated TOC please keep comment here to allow auto update --> |
| 2 | +<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE --> |
| 3 | +**Table of Contents** *generated with [DocToc](https://github.com/thlorenz/doctoc)* |
| 4 | + |
| 5 | +- [nuxt-typescript-ssr-firebase-auth](#nuxt-typescript-ssr-firebase-auth) |
| 6 | + - [DETAILED DOCUMENTATION](#detailed-documentation) |
| 7 | + - [Build Setup](#build-setup) |
| 8 | + - [Features](#features) |
| 9 | + - [Prepare for build](#prepare-for-build) |
| 10 | + - [firebase](#firebase) |
| 11 | + - [create project(s)](#create-projects) |
| 12 | + - [firebase credentials files](#firebase-credentials-files) |
| 13 | + - [firebase credentials file for `development` env](#firebase-credentials-file-for-development-env) |
| 14 | + - [firebase credentials file for `production` env](#firebase-credentials-file-for-production-env) |
| 15 | + - [dotenv](#dotenv) |
| 16 | + - [development](#development) |
| 17 | + - [production](#production) |
| 18 | + - [Build Setup](#build-setup-1) |
| 19 | + - [localization](#localization) |
| 20 | + - [change language](#change-language) |
| 21 | + - [Contribution](#contribution) |
| 22 | + - [hints](#hints) |
| 23 | + - [nuxt Failed to execute 'appendChild' on 'Node': This node type does not support this method.](#nuxt-failed-to-execute-appendchild-on-node-this-node-type-does-not-support-this-method) |
| 24 | + |
| 25 | +<!-- END doctoc generated TOC please keep comment here to allow auto update --> |
| 26 | + |
| 27 | +# nuxt-typescript-ssr-firebase-auth |
| 28 | + |
| 29 | +## DETAILED DOCUMENTATION |
| 30 | +> Coming soon |
| 31 | +
|
| 32 | +## Build Setup |
| 33 | + |
| 34 | +```bash |
| 35 | +# install dependencies |
| 36 | +$ npm install |
| 37 | + |
| 38 | +# serve with hot reload at localhost:3000 |
| 39 | +$ npm run dev |
| 40 | + |
| 41 | +# build for production and launch server |
| 42 | +$ npm run build |
| 43 | +$ npm run start |
| 44 | + |
| 45 | +# generate static project |
| 46 | +$ npm run generate |
| 47 | +``` |
| 48 | + |
| 49 | +For detailed explanation on how things work, check out [Nuxt.js docs](https://nuxtjs.org). |
| 50 | + |
| 51 | +## Features |
| 52 | +- [x] nuxtjs - universal mode |
| 53 | +- [x] typescript |
| 54 | +- [x] firebase |
| 55 | + - [x] firebase-hosting |
| 56 | + - [x] firebase-functions |
| 57 | + - [x] the url same as hosting |
| 58 | + - [x] firebase-auth |
| 59 | + - [x] firebase-auth password |
| 60 | + - [x] register |
| 61 | + - [x] login |
| 62 | + - [x] forget-password |
| 63 | + - [x] reset-password |
| 64 | + - [x] send verification code |
| 65 | + - [x] processing display when the button clicked |
| 66 | + - [x] verify action with mail verification code |
| 67 | + - [x] firebase-auth google |
| 68 | + - [x] firebase-auth twitter |
| 69 | + - [x] firebase-auth facebook |
| 70 | + - [x] link/unlink password authenticator |
| 71 | + - [x] link/unlink google authenticator |
| 72 | + - [x] link/unlink twitter authenticator |
| 73 | + - [x] link/unlink facebook authenticator |
| 74 | +- [x] buefy |
| 75 | +- [x] nuxt-i18n |
| 76 | + - [x] English |
| 77 | + - [x] Turkish |
| 78 | +- [x] vee-validate |
| 79 | + - [x] integration with nuxt-i18n |
| 80 | +- [x] dotenv - development and production config for local usage. |
| 81 | +- [ ] better formatting |
| 82 | +- [ ] backend-frontend types in a npm package |
| 83 | +- [x] custom error page - simple |
| 84 | +- [x] global notification |
| 85 | +- [x] toaster notification |
| 86 | +- [x] tooltips |
| 87 | + |
| 88 | +Have a look [Trello Board](https://trello.com/b/6JN23G7A/boiler-plate) for more coming functionality |
| 89 | + |
| 90 | + |
| 91 | +## Prepare for build |
| 92 | + |
| 93 | +### firebase |
| 94 | + |
| 95 | +#### create project(s) |
| 96 | +needs 2 projects on firebase; one of them for `development` and the other one for `production`. |
| 97 | +> you can create/use one project for both as well. But still, you need to create firebase credentials files for `development` and `production`. |
| 98 | +
|
| 99 | + |
| 100 | +more: TBD |
| 101 | + |
| 102 | +> If you already have a project you can use it too. |
| 103 | +
|
| 104 | +#### firebase credentials files |
| 105 | + |
| 106 | +##### firebase credentials file for `development` env |
| 107 | +- export the credentials files from you `development` firebase project. |
| 108 | +- copy the file to |
| 109 | + - `server/service/firebase-admin-credentials-development.json` |
| 110 | + - `functions/src/service/firebase-admin-credentials-production.json` |
| 111 | + |
| 112 | +> if you don't have a development env, you can export the credential files from your `production` and copy the files as `server/service/firebase-admin-credentials-development.json` |
| 113 | +
|
| 114 | +##### firebase credentials file for `production` env |
| 115 | +- export the credentials files from you `production` firebase project. |
| 116 | +- copy the file to `server/service/firebase-admin-credentials-production.json` |
| 117 | + |
| 118 | +> if you don't have a development env, you can export the credential files from your `development` and copy the files as `server/service/firebase-admin-credentials-production.json` |
| 119 | +
|
| 120 | +### dotenv |
| 121 | + |
| 122 | +>!!! dotenv is just for local or `yarn build & yarn start` usage. `firebase-function` is just supported for `production` env |
| 123 | +
|
| 124 | +#### development |
| 125 | + |
| 126 | +create `.env.development` file with below content |
| 127 | + |
| 128 | +```.env |
| 129 | +# axios config |
| 130 | +API_URL=http://localhost:3000/api |
| 131 | +
|
| 132 | +# firebase config |
| 133 | +FIREBASE_API_KEY= *** |
| 134 | +FIREBASE_AUTH_DOMAIN= *** |
| 135 | +FIREBASE_DATABASE_URL= *** |
| 136 | +FIREBASE_PROJECT_ID= *** |
| 137 | +FIREBASE_STORAGE_BUCKET= *** |
| 138 | +FIREBASE_MESSAGING_SENDER_ID= *** |
| 139 | +FIREBASE_APP_ID= *** |
| 140 | +FIREBASE_MEASUREMENT_ID= *** |
| 141 | +``` |
| 142 | + |
| 143 | +#### production |
| 144 | + |
| 145 | +create `.env` file with below content |
| 146 | + |
| 147 | +```.env |
| 148 | +# axios config |
| 149 | +API_URL=https://<your_host_or_project_name>/api |
| 150 | +
|
| 151 | +# firebase config |
| 152 | +FIREBASE_API_KEY= *** |
| 153 | +FIREBASE_AUTH_DOMAIN= *** |
| 154 | +FIREBASE_DATABASE_URL= *** |
| 155 | +FIREBASE_PROJECT_ID= *** |
| 156 | +FIREBASE_STORAGE_BUCKET= *** |
| 157 | +FIREBASE_MESSAGING_SENDER_ID= *** |
| 158 | +FIREBASE_APP_ID= *** |
| 159 | +FIREBASE_MEASUREMENT_ID= *** |
| 160 | +``` |
| 161 | + |
| 162 | +## Build Setup |
| 163 | + |
| 164 | +```bash |
| 165 | +# install dependencies |
| 166 | +$ yarn install |
| 167 | + |
| 168 | +# serve with hot reload at localhost:3000 |
| 169 | +$ yarn dev |
| 170 | + |
| 171 | +# build for production and launch server |
| 172 | +$ yarn build |
| 173 | +$ yarn start |
| 174 | + |
| 175 | +# generate static project |
| 176 | +$ yarn generate |
| 177 | +``` |
| 178 | + |
| 179 | +For detailed explanation on how things work, check out [Nuxt.js docs](https://nuxtjs.org). |
| 180 | + |
| 181 | +## localization |
| 182 | + |
| 183 | +### change language |
| 184 | + |
| 185 | +> strategy: 'no_prefix', |
| 186 | +
|
| 187 | +```typescript |
| 188 | +changeLocale() { |
| 189 | + this.$i18n.setLocale(this.$i18n.locale === 'en' ? 'tr' : 'en') |
| 190 | +} |
| 191 | +``` |
| 192 | +--- |
| 193 | +> for the other strategy |
| 194 | +```html |
| 195 | +<nuxt-link :to="switchLocalePath('en')">English</nuxt-link> |
| 196 | +<nuxt-link :to="switchLocalePath('tr')">Turkish</nuxt-link> |
| 197 | +``` |
| 198 | + |
| 199 | +## Contribution |
| 200 | + |
| 201 | +Please feel free to send a pull request. Welcome :) |
| 202 | +- you see a mistake ( excepted, totally my mistake :) ) |
| 203 | +- you know a better/best practice |
| 204 | +- you can add more functionality |
| 205 | +- you found a bug |
| 206 | +- you think you have time to fix/implement a card from [Trello Board](https://trello.com/b/6JN23G7A/boiler-plate) |
| 207 | + |
| 208 | + |
| 209 | + |
| 210 | +## hints |
| 211 | +### nuxt Failed to execute 'appendChild' on 'Node': This node type does not support this method. |
| 212 | +add `no-ssr` tag |
| 213 | + |
| 214 | + <no-ssr> |
| 215 | + ... |
| 216 | + </no-ssr> |
| 217 | + |
0 commit comments