huuquyet / todo-react-redux

Todo app with React • Redux • Firebase • OAuth • Webpack

Todo app with Create React App, React Redux, and Firebase

A simple Todo app example with undelete capability — built with Create React App, React Redux, and Firebase.

Try the demo at https://todo-react-redux.firebaseapp.com

A version of this app built with redux-saga middleware is available here.

Stack

• Create React App
• React Redux
• React Router
• Connected React Router
• Redux Toolkit
• Redux Thunk
• Firebase SDK with OAuth authentication
• Immutable
• Reselect
• Eslint Prettier

Quick Start

$ git clone https://github.com/r-park/todo-react-redux.git
$ cd todo-react-redux
$ npm install
$ npm start

Deploying to Firebase

Prerequisites:

• Create a free Firebase account at https://firebase.google.com
• Create a project from your Firebase account console
• Configure the authentication providers for your Firebase project from your Firebase account console

Configure this app with your project-specific details:

// .firebaserc

{
  "projects": {
    "default": "your-project-id"
  }
}

// src/firebase/config.js

export const firebaseConfig = {
  apiKey: 'your api key',
  authDomain: 'your-project-id.firebaseapp.com',
  databaseURL: 'https://your-project-id.firebaseio.com',
  storageBucket: 'your-project-id.appspot.com',
};

Install firebase-tools:

$ npm install -g firebase-tools

Build and deploy the app:

$ npm run build
$ firebase login
$ firebase use default
$ firebase deploy

NPM Commands

NPM Commands

Script	Description
npm start	Start development server @ localhost:3000
npm run build	Build the application to ./build directory
npm test	Test the application; watch for changes and retest