Code Monkey home page Code Monkey logo

nightillusions / react-firebase-material-admin Goto Github PK

View Code? Open in Web Editor NEW
11.0 0.0 5.0 3.6 MB

Firebase React (TS) Admin Biolerplate is a project template for building modern, scalable web applications with React using serverless infrastructure provided by Google Firebase.

Home Page: https://react-firebase-material-f3cba.web.app/

License: MIT License

JavaScript 0.46% TypeScript 97.88% HTML 0.50% CSS 1.15%
react firebase material dropzone google-firebase material-ui serverless-infrastructure typescript mui boilerplate

react-firebase-material-admin's Introduction

Firebase React Admin Biolerplate
incl. GitHub Actions deployment

Firebase React Admin Biolerplate is a project template (aka, boilerplate) for building modern, scalable web applications with React using serverless infrastructure provided by Google Firebase. It allows you to save time and build upon a solid foundation and design patterns.

This project was bootstrapped with Create React App.

Tech Stack

  • Create React App (★ 76k) for development and test infrastructure (see user guide)
  • Material UI (★ 54k) to reduce development time by integrating Google's Material Design
  • React Dashboard (★ 2k) Free React Dashboard made with Material UI’s components
  • Reach Router (★ 6k) for declarative routing and client-side navigation
  • React Dropzone (★ 7k) Simple React hook to create a HTML5-compliant drag'n'drop zone for files.
  • TypeScript (★ 58k) TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
  • Google Cloud & Firebase for serverless architecture - Cloud SQL, Cloud Functions, CDN hosting, file storage (docs)

Also, you need to be familiar with HTML, CSS, JavaScript (ES2015), TypeScript and React.

Prerequisites

Getting Started

Just clone the repo, update environment variables in .env and/or .env.local file, and start hacking:

$ git clone [email protected]:nightillusions/react-firebase-material-admin.git MyApp
$ cd MyApp
$ yarn                             # Installs dependencies
$ yarn start                       # Compile the app and opens it in a browser with "live reload"

Then open http://localhost:3000/ to see your app.

npm start

How to Deploy

For more information refer to the Deployment guide in the project's Wiki.

How to Update

If you keep the original Git history after cloning this repo, you can always fetch and merge the recent updates back into your project by running:

$ git remote add frab [email protected]:nightillusions/react-firebase-material-admin.git
$ git checkout master
$ git fetch frab
$ git merge frab/master
$ yarn install

_NOTE: Try to merge as soon as the new changes land on the master branch in the upstream repository, otherwise your project may differ too much from the base/upstream repo.

License

Copyright © 2020 Pascal Jordin. This source code is licensed under the MIT license found in the LICENSE.txt file.


Made with ♥ by Pascal Jordin (website) Get in touch!

react-firebase-material-admin's People

Contributors

nightillusions avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

react-firebase-material-admin's Issues

Unhandled Rejection (TypeError): Cannot read property 'avatarUrl' of undefined

Bonjour Pascal,

(Ceci est un excellent projet!!)

After following the deploy instructions from
(https://github.com/nightillusions/react-firebase-material-admin/wiki/Deployment)
and setting up Firebase keys etc... I'm getting the issue below when trying Google auth or account creation via email

Unhandled Rejection (TypeError): Cannot read property 'avatarUrl' of undefined

Any pointers? Did I miss something in my Firebase config, or is there a step to recreate the Firebase store (I have yet to setup GitHub actions)

Screenshot 2020-05-11 19 40 36

Thanks,

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.