Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Issue #1 | Connect app to Firebase #44

Merged
merged 4 commits into from
Dec 22, 2019
Merged

Issue #1 | Connect app to Firebase #44

merged 4 commits into from
Dec 22, 2019

Commits on Dec 22, 2019

  1. Display items from database in List component 

    This commit adds `firebase` and `react-firestore` as dependancies so that we can interact with our database.

A List component was created where we'll be able to house all the list's logic and display the list items that get added to the database.

Inside that List component, we've used `FirestoreCollection` which is a component that allows you to interact with a Firestore collection. Using this component, you can access the collection at a given path and provide sort options, perform queries, and paginate data.

This component will setup a listener and update whenever our collection is updated in Firestore.
    @stacietaylorcima
    stacietaylorcima committed Dec 22, 2019
    Configuration menu
    Copy the full SHA
    481de50 View commit details
    Browse the repository at this point in the history

  2. Write items to the database 

    This commit adds an AddItem component that is a form responsible for sending items up to firestore.

When we wrap this AddItem component in the higher-order component (HOC) `withFirestore` we're provided some handy dandy methods that make it easy to send documents up to the database.

Check out more documentation and examples of how `withFirestore` is used here: https://www.npmjs.com/package/react-firestore#withfirestore
    @stacietaylorcima
    stacietaylorcima committed Dec 22, 2019
    Configuration menu
    Copy the full SHA
    b7bd16b View commit details
    Browse the repository at this point in the history

  3. Clear input on submit

    @stacietaylorcima
    stacietaylorcima committed Dec 22, 2019
    Configuration menu
    Copy the full SHA
    b6e6866 View commit details
    Browse the repository at this point in the history

  4. Add placeholder to input, cleanup HTML tags

    @stacietaylorcima
    stacietaylorcima committed Dec 22, 2019
    Configuration menu
    Copy the full SHA
    7a6ccdb View commit details
    Browse the repository at this point in the history