React typescript / Firebase Auth

typescript React App sample with Firebase Authentication.

supported Firebase login/register methods:

• Email and Password
• Facebook

firebase module version

9.0.1

usage

setup Firebase Authentication and Facebook App at first.

ref.(JP):

• 【完全版】React の Firebase Authentication(認証)を基礎からマスターする
• 【React/TypeScript】Firebase でメール認証と Google 認証を実装する
• [Firebase] Authentication で Facebook 認証 (Web 編) etc.

install package

$ cd app
$ npm i

edit .env

setup Firebase config parameters on .env file. copy .env.sample and fill parameters.

start app

$ yarn start

localhost to https with Docker

Facebook login requires secure connection. It fails when redirect URI is not https.

For example, by using SteveLTN/https-portal image, container can forward request: https://localhost:3443 to http://localhost:3000. If not work, add following lines to docker-compose.yml.

    extra_hosts:
      - "host.docker.internal:172.17.0.1"

$ docker-compose up -d

Ignore security warning on Chrome Browser.

chrome://flags/#allow-insecure-localhost

via. Docker でローカル開発環境の https 化

access

https://locahost:3443