Remark

Features

  • uses:
    • only React (create-react-app)
    • firebase
    • react-router
    • redux
  • features:
    • Sign In
    • Sign Up
    • Sign Out
    • Password Forget
    • Password Change
    • Verification Email
    • Protected Routes with Authorization
    • Roles-based Authorization
    • Social Logins with Google, Facebook and Twitter
    • Linking of Social Logins on Account dashboard
    • Auth Persistence with Local Storage
    • Database with Users and Lists

Installation

  • git clone git@github.com:ylankgz/remark.git
  • cd remark
  • npm install
  • npm start
  • visit http://localhost:3000

Get an overview of Firebase, how to create a project, what kind of features Firebase offers, and how to navigate through the Firebase project dashboard in this visual tutorial for Firebase.

Firebase Configuration

  • copy/paste your configuration from your Firebase project's dashboard into one of these files
    • src/components/Firebase/firebase.js file
    • .env file
    • .env.development and .env.production files

The .env or .env.development and .env.production files could look like the following then:

REACT_APP_API_KEY=AIzaSyBtxZ3phPeXcsZsRTySIXa7n33NtQ
REACT_APP_AUTH_DOMAIN=react-firebase-s2233d64f8.firebaseapp.com
REACT_APP_DATABASE_URL=https://react-firebase-s2233d64f8.firebaseio.com
REACT_APP_PROJECT_ID=react-firebase-s2233d64f8
REACT_APP_STORAGE_BUCKET=react-firebase-s2233d64f8.appspot.com
REACT_APP_MESSAGING_SENDER_ID=701928454501

Activate Verification E-Mail

  • add a redirect URL for redirecting a user after an email verification into one of these files
    • src/components/Firebase/firebase.js file
    • .env file
    • .env.development and .env.production files

The .env or .env.development and .env.production files could look like the following then (excl. the Firebase configuration).

Development:

REACT_APP_CONFIRMATION_EMAIL_REDIRECT=http://localhost:3000

Production:

REACT_APP_CONFIRMATION_EMAIL_REDIRECT=https://mydomain.com

Fields: 1.User created 2.Name of client 3.Contact 3.Resource 4.Subject 5.Hotness - filter 6.Next step 7.Next step datetime - filter 8. Last time edited 9.archived