[NEW] React + Firebase: For Beginners

What happens to content within an element that React is creating elements within, then goes on to explain the nested createElement call, and the arguments passed into the returned function.

We’ll move the components into different files to make the code more maintainable.

How to extract JavaScript into its own file, then create a second component that is reusable within the parent component.

How to create and pass in attributes to components.

How to utilize a Vanilla JavaScript principle to simplify attribute names being passed into components.

Daniel adds routing to the application.

We’ll add a page header from the ant library that renders a more complete version of the component that shows for each post.

Reach Router will be used for the course because of emphasis on accessibility, and also its intuitive path scoring algorithm.

Daniel demonstrates how to use Babel and Parcel together by creating a Babel configuration file. The application is configured to accept proposed JavaScript implementations as well as the current standards.

We’ll review the useState hook to keep track of state inside a function component. A cardinal rule for using hooks are also covered regarding their use in conditionals or control flow statements.

We’ll review the useEffect hook to handle side effects in function components. How dependencies affect the functionality of the hook is discussed.

The useState hook is utilized to update the state, and the onChange event handler is tasked with displaying it in the component.

We’ll create a list of posts from the mock api and populated data for display to our users.

We’ll go over why a unique key must be provided when rendering lists of elements in JSX, and why providing it increases performance.

We’ll utilize the useEffect built-in hook to asynchronously request data from the API.

We’ll declares the dependencies that useEffect relies on in order to specify which parameters that React should be checking for changes on during a re-render. It's demonstrated that this prevents the code from running the effect unnecessarily.

We introduce Cloud Firestore, the database replacing Realtime Database in Firebase.

We’ll go over the structure of cloud firestore

An introduction on how to query data from the Cloud Firestore.

We’ll configure the Firebase application and exports necessary variables.

We’ll sets up a new Cloud Firestore database, then wire it into the application.

We introduce key properties and methods of the QuerySnapshot objects.

We introduce key properties and methods of the DocumentSnapshot objects.

We’ll post a document to the database, then demonstrate how to GET the same document and update the state of the application to reflect the new data.

We’ll demonstrate how to add functionality to the app that allows the user to delete posts, then also removes it permanently from the database.

We’ll learn the map function and go over the posts collection to display the data in the app.

We’ll go over the benefits of subcollections, then introduce the next feature in the application, which is to allow the user to fetch a specific post via a URL.

Daniel begins constructing a page where the specified post will be placed.

We’ll post a document to the database, then demonstrate how to GET the same document and update the state of the application to reflect the new data.

We’ll demonstrate how to add functionality to the app that allows the user to delete posts, then also removes it permanently from the database.

We’ll demonstrate how easy it is to configure the OAuth with the Firebase console.

We’ll wire up the app to allow users to sign in via Email and Password.

We’ll construct a function that creates a user document.

We’ll construct a function that GETs a user document.

We’ll approach the problem of scaling, should the application grow in size. Also the ability to make it a multi-tenant application which will allow multiple users to sign up , sign in, and create multiple posts with sharable links.

We’ll wire up the app to allow users to sign out, and authorization so that only the correct posts show up for the correct blogs. We'll deal with unsigned users and partials views that render data based on conditions for example if they are signed in or not