Skip to content

Latest commit

 

History

History
99 lines (69 loc) · 4.19 KB

README.md

File metadata and controls

99 lines (69 loc) · 4.19 KB
Raw

Front-End Inspiration Board

Overview

Part of a full-stack project involving four team members. Completed in 8 days (including planning time) over three weeks.

Front-end owners: @kalawac, @annalord
Back-end owners: @emilyiscoding, @bukunmig

Related Links

Basic Full-Stack Project Requirements

Goal

Create a digital inspiration board

Features

UX Summary: Feature Requirements

Users should be able to create one or more boards.

Once a board is created, users should able to select a single board. Users should be able to create new cards for the selected board. When a user selects a board, they should be able to see all the cards associated with that board.

Users should be able to "+1" the cards that they agree with and see the total number of "+1"s on a single card.

UX Summary: Our Additional Features

Login and Sign Up

  • Users should be able to sign up for site access with a username
  • Users should be able to log in with a username that is not case-sensitive
  • Usernames should be unique to a single user

Boards

  • Users should be able to sort the board list by most recent, popularity (number of cards) and board owner
  • Users can choose a card color when creating a board; cards on that board should populate in the selected color theme

Detailed Feature Requirements (from Ada-C18/full-stack-inspiration-board)

Teams may:

  • Interpret the features however you'd like
  • Style the web app however you'd like, as long as it's usable

Create & Read Boards

As a user, I want to be able to...

Create
  • Create a new board, by filling out a form. The form includes "title" and "owner" name of the board.
  • See an error message if I try to make a new board with an empty/blank/invalid/missing "title" or "owner" input.
  • All error messages can look like a new section on the screen, a red outline around the input field, and/or disabling the input, as long as it's visible
  • Hide the "New Board" form, so I don't have to see the "New Board" form all the time when I'm looking at cards.
Read
  • View a list of all boards.
  • Select a board.

Create, Read, and Delete Cards

As a user, I want to be able to...

Create
  • Create a new card for the selected board, by filling out a form and filling out a "message."
  • See an error message if I try to make the card's "message" more than 40 characters.
  • All error messages can look like a new section on the screen, a red outline around the input field, and/or disabling the input, as long as it's visible
  • See an error message if I try to make a new card with an empty/blank/invalid/missing "message."
Read
  • View a list of cards that belong to the selected board.
Delete
  • Delete an existing card.

+1 Feature

As a user, I want to be able to...

  • Press a "+1" icon on a single card, to indicate that I agree with it.
  • See the number of "+1"s on a single card. Every card starts with zero "+1"s.

Additional Features (from Ada-C18/full-stack-inspiration-board)

Instructions from Ada: Each team should implement one additional feature from each layer.

All suggested additional features are listed below.
The features we have implemented in this project are indicated by "=>".

Front-end Feature Options

  • => Use React Router
  • => Allow the user to select how to sort the cards between these options:
    • Sort by ID
    • Sort alphabetically
    • Sort by number of "+1"s

Back-end Feature Options

  • => Write tests for the CRUD operations around the Board model
  • Every time a new card is made, it sends a message to the team's public Slack channel