Awesome Open Source
Awesome Open Source

React Firebase Admin βš›οΈ πŸš€

ci license: MIT

Boilerplate with React βš›οΈ and Firebase πŸ”₯designed to quickly spin up a fully functional admin dashboard with authentication, authorization, Realtime Database / Firestore, built-in CI/CD, file upload and more. We're using up to date industry standards and next-gen technologies like React (with hooks), redux, bulma, sass, webpack, routing and a serverless architecture.

Boilerplate - Users page


Table of Contents


This project is using a customized version ported into React of the Admin Dashboard Template made by Viktor Kuzhelny.

What is this?

React Firebase Admin is our in-house admin dashboard boilerplate, used in many of our software projects here at CreateThrive. After months of hard work, we decided to make it public and support the open source community.

Why should I use it?

  • This project was bootstrapped with CRA (Create React App), this means it comes with all the good features we all know and love such as built-in scripts, to make our app a PWA (Progressive Web App) and much more!.
  • It is customizable.
  • It uses Firebase.
  • It has all the basic features you want in your app.
  • It is easy to use.

Features

  • Bulma CSS framework (Mobile friendly πŸ”₯)
  • Redux implementation
  • Firebase/Redux implementation
  • Authentication & authorization
  • Pick between Realtime Database and Firestore
  • Create/modify/delete users
  • Automatic email invitation to new users
  • Image uploading
  • Change/Reset Password built into the dasbhoard.
  • User filtering and search
  • Built-in CI (Continous integration)
  • Built-in CD (Continous deployment)
  • PWA ready thanks to CRA and Firebase
  • Multi-tenancy
  • Internationalization (English/Spanish)
  • Ability to choose between Firebase Realtime Database or Firestore

Tech Stack

Core

  • Create React App (β˜… 76.5k) this project was bootstrapped with create react app (see user guide).
  • Bulma (β˜… 38.7k) CSS framework to reduce development time and have a nice UI.
  • Redux (β˜… 52.4k) for in-app state management (see docs).
  • React-redux (β˜… 19k) official react bindings for redux (see docs).
  • Redux-act (β˜… 1.4k) opinionated library to create actions and reducers.
  • Redux-thunk (β˜… 14.1k) redux middleware for asynchronous actions.
  • Redux-persist (β˜… 9.8k) persists store state between sessions.
  • React-redux-toastr (β˜… 703) a toastr message implemented with Redux.
  • React-router (β˜… 39.6k) declarative routing for React.
  • Prop-Types (β˜… 3.4k) typechecking for react component props.
  • Classnames (β˜… 11.9k) a simple javascript utility for conditionally joining classNames together.
  • React-datepicker (β˜… 4.5k) a simple and reusable datepicker component for React.
  • React-table (β˜… 9.6k) hooks for building fast and extendable tables and datagrids for React.
  • React-spinners (β˜… 1.2k) a collection of loading spinner components for React.
  • Firebase for serverless architecture - CDN Hosting, Realtime Database, Authentication, Storage and Cloud Functions (see docs).
  • FirebaseUI-web-react (β˜… 732) social media authentication library.
  • Format.js (β˜… 11.7k) libraries for internationalization (see docs).
  • date-fns (β˜… 22.3k) date utility library (see docs).
  • cross-env (β˜… 4.9k) run scripts that set and use environment variables across platforms (see docs).
  • React Hook Form (β˜… 14.6k) Performant, flexible and extensible forms with easy to use validation.
  • yup (β˜… 11k) schema builder for value parsing and validation.
  • Inquirer (β˜… 12.2k) A collection of common interactive command line user interfaces (see docs).

Unit Testing

Linting

  • ESLint (β˜… 15.9k) configured to follow the coding style of Airbnb.
  • Prettier (β˜… 35.5k) as code formatter.
  • Lint-staged (β˜… 6.5k) run linters on git staged files.

Cloud functions

  • Firebase-admin (β˜… 790) Firebase Admin Node.js SDK.
  • Firebase-functions (β˜… 658) Firebase SDK for Cloud Functions.
  • Typescript (β˜… 61.1k) TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
  • TSlint (β˜… 5.8k) An extensible linter for the TypeScript language.
  • Firebase-function-tools (β˜… 780) a tool for naming and loading our Cloud Functions.
  • Glob (β˜… 6.2k) glob functionality for Node.js.
  • Camelcase (β˜… 423) convert a dash/dot/underscore/space separated string to camelCase.
  • Resize Image (β˜… 372) Firebase Extension to create resized versions of images uploaded to Cloud Storage.

Unit Testing

  • Firebase-functions-test (β˜… 117) unit testing library for Cloud Functions for Firebase.
  • Mocha (β˜… 19.4k) simple, flexible, fun javascript test framework for node.js & the browser.
  • Chai (β˜… 6.8k) BDD / TDD assertion framework for node.js and the browser that can be paired with any testing framework.
  • Chai-as-promised (β˜… 1.4k) Extends Chai with assertions about promises.
  • Ts-node (β˜… 7k) TypeScript execution and REPL for node.js, with source map support.

Prerequisites

You also need to be familiar with HTML, CSS, SASS, JavaScript (ES2015) and React with React Hooks.

Documentation

Demo

For requesting access to the demo site please contact us.

Contributors

We'd like to thank these awesome people who made this whole thing happen:

License

This project is licensed under the MIT license, Copyright (c) 2020 CreateThrive. For more information see LICENSE.md.


Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
Javascript (1,510,014)Β 
Typescript (250,954)Β 
Reactjs (72,472)Β 
Redux (13,038)Β 
Firebase (9,321)Β 
Template (7,716)Β 
Boilerplate (5,515)Β 
Serverless (4,750)Β 
Pwa (3,250)Β 
Workflow (2,308)Β 
Responsive (1,588)Β 
Starter Kit (1,368)Β 
Routing (1,052)Β 
Admin Dashboard (896)Β 
Bulma (894)Β 
Offline (792)Β 
Cloud Functions (364)Β 
Realtime Database (169)Β 
Related Projects
Advertising πŸ“¦Β 9
All Projects
Application Programming Interfaces πŸ“¦Β 120
Applications πŸ“¦Β 181
Artificial Intelligence πŸ“¦Β 72
Blockchain πŸ“¦Β 70
Build Tools πŸ“¦Β 111
Cloud Computing πŸ“¦Β 79
Code Quality πŸ“¦Β 28
Collaboration πŸ“¦Β 30
Command Line Interface πŸ“¦Β 48
Community πŸ“¦Β 81
Companies πŸ“¦Β 60
Compilers πŸ“¦Β 60
Computer Science πŸ“¦Β 74
Configuration Management πŸ“¦Β 39
Content Management πŸ“¦Β 167
Control Flow πŸ“¦Β 197
Data Formats πŸ“¦Β 77
Data Processing πŸ“¦Β 266
Data Storage πŸ“¦Β 132
Economics πŸ“¦Β 60
Frameworks πŸ“¦Β 198
Games πŸ“¦Β 122
Graphics πŸ“¦Β 103
Hardware πŸ“¦Β 148
Integrated Development Environments πŸ“¦Β 47
Learning Resources πŸ“¦Β 147
Legal πŸ“¦Β 28
Libraries πŸ“¦Β 119
Lists Of Projects πŸ“¦Β 21
Machine Learning πŸ“¦Β 336
Mapping πŸ“¦Β 61
Marketing πŸ“¦Β 15
Mathematics πŸ“¦Β 55
Media πŸ“¦Β 228
Messaging πŸ“¦Β 97
Networking πŸ“¦Β 304
Operating Systems πŸ“¦Β 84
Operations πŸ“¦Β 120
Package Managers πŸ“¦Β 52
Programming Languages πŸ“¦Β 229
Runtime Environments πŸ“¦Β 96
Science πŸ“¦Β 42
Security πŸ“¦Β 375
Social Media πŸ“¦Β 26
Software Architecture πŸ“¦Β 70
Software Development πŸ“¦Β 68
Software Performance πŸ“¦Β 57
Software Quality πŸ“¦Β 127
Text Editors πŸ“¦Β 45
Text Processing πŸ“¦Β 131
User Interface πŸ“¦Β 310
User Interface Components πŸ“¦Β 465
Version Control πŸ“¦Β 29
Virtualization πŸ“¦Β 68
Web Browsers πŸ“¦Β 38
Web Servers πŸ“¦Β 25
Web User Interface πŸ“¦Β 194