React Pinterest

Live Site

Views

Intial Plan Walk Through

• Here is the overview of what we decided as a class to complete for our React Pinterest project
• Issue Ticket for discussion

What do we need to build?

• TODO

Views

• Home
• Boards
• Pins (see all the pins the user has created)
• SingleBoard (See all the pins on the board)
• PinDetails
• BoardForm
• PinForm

Example Routes using react-router-dom

<Switch>
        <Route
          exact
          path='/'
          component={() => <Home authed={authed} />}
        />
        <Route
          exact
          path='/pin-details'
          component={() => <PinDetails authed={authed} />}
        />
        <Route
          exact
          path='/pins'
          component={() => <Pins authed={authed} />}
        />
        <Route
          exact
          path='/pin-form'
          component={() => <PinForm authed={authed} />}
        />
        <Route
          exact
          path='/single-board'
          component={() => <SingleBoard authed={authed} />}
        />
        <Route
          exact
          path='/board-form'
          component={() => <BoardForm authed={authed} />}
        />
        <Route
          exact
          path='/boards'
          component={() => <Boards authed={authed} />}
        />
        <Route component={NotFound} />
      </Switch>

Components

• Board
• Pin
• Main Container
• PinDetails
• Forms: Boards/Pins
• Navbar
• Loading (stretch)
• Search (stretch)
• Firebase Image Upload (stretch)
• Search History (stretch)
• Comments (stretch)

Starter ERD

Deployment

See detailed instructions here