# react-redux-codelab

**Repository Path**: mirrors_stevemao/react-redux-codelab

## Basic Information

- **Project Name**: react-redux-codelab
- **Description**: React/Redux codelab, you can use it at a starter project!
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-09-26
- **Last Updated**: 2025-11-23

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# react-redux-codelab: tvscrub
In this codelab we will build a tvshows tracker with react, redux and firebase.

You can find an instance here to play with: [react-redux-codelab (hosted by Firebase)](https://react-redux-codelab.firebaseapp.com/)

![Imgur](http://i.imgur.com/FsJFZZl.png)

![Imgur](http://i.imgur.com/TCty3IV.png)


## Slides
1. Tools and libs: [Google doc -fr-](https://docs.google.com/presentation/d/1NlW5g9BY4QHIgyGbQqZxWtR3KugYmyUvSUAsHezmCo0/edit?usp=sharing)
2. Components and redux state: [Google doc -fr-](https://docs.google.com/presentation/d/1MfxJQWou7iEe9Il5MaYCqhEH4LYRBZKTClbPEN__zjc/edit?usp=sharing)
3. Steps: [PLAN -fr-](./PLAN.md)
4. Steps (detail): [Google doc -fr-](https://docs.google.com/presentation/d/1qU1pqq3TXb-0jLTKToKLcKremc8A6sVqXknNzGxdrhU/edit?usp=sharing)

## Steps
For full steps, you can look up to the Google doc.

This steps are summaries:
  * React
    * How do we create a react component (as pure function)
  * Redux
    * How do we create a reducer and an action with redux
  * react-redux
    * How do we connect our component to our state/actions
  * redux-thunk
    * How do we dispatch asynchronous actions
  * redux-little-router
    * How do we activate browser navigation
    * This is also the time to retrieve some URL options (route params)
  * reselect
    * How to we optimize our container (react-redux)
  * firebase
    * How do we deploy the application on your own account

## Get tools
Tools and dependencies that are **NEEDED**, choose between:
  * [Install everything locally](./TOOLS-LOCAL.md)
  * [Use docker](./TOOLS-DOCKER.md)
 
You should install these tools, those are must-haves (but are optionals):
  * [google-chrome](https://www.google.fr/chrome/browser/desktop/)
  * [redux-devtools](https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljd)
  * [react-devtools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi)
  * [Atom](https://atom.io/)
    * Plugins:
      * highlight-selected
      * file-icons
      * react
      * pigment
      * linter-eslint
      * linter-sass-lint