Coder Social home page Coder Social logo

divebook's Introduction

NSS Front End Capstone Project

Divebook

Scuba divers keep a log of all of their dives to meet professional education requirements and to meet qualifications for more advanced certifications. Divebook is an app for scuba divers to log the necessary details of each dive. It also provides a place where they can upload photos from each dive and share their dive log with friends.

alt text

This project was bootstrapped with Create React App and uses the following:

Cloudinary (www.cloudinary.com)
Grommet (https://v2.grommet.io)
React-bootstrap (https://react-bootstrap.github.io)
React-image-gallery (https://github.com/xiaolin/react-image-gallery)
React-sidenav (https://github.com/trendmicro-frontend/react-sidenav)
Reactstrap (https://reactstrap.github.io)
Styled-components (https://www.styled-components.com)

divebook's People

Contributors

alagrad94 avatar

Watchers

James Cloos avatar

divebook's Issues

Dive Sites

Story:

As a user who utilizes Divebook to log dives, I should be able to add dive sites to the public database, view a list of dive sites and edit sites already in the database

Acceptance Criteria:

Given: a user wants to add the details about a dive site to the database
When: the user clicks an affordance for adding a dive site (i.e. button or hyperlink)
Then: the user should be presented with a form to supply the details of the dive site
And: completing the form and clicking submit should add the site to the database and make it available to all users
And: the dive sites page should display a list of the dive sites in the database
And: a user should be given the affordance to edit a dive site
And: upon completion of the editing the user should be given the affordance to save their edits

Multiple Users

Story:

Using session storage, Divebook will mimic multiple users using the site concurrently.

Acceptance Criteria:

Given: multiple users active in the application concurrently
When: a new tab is opened
And: the user activates a different account
Then: the current account should be set as active in session storage

User Dashboard

Story:

As a user who utilizes Divebook to log dives, I should have a dashboard as my starting page which contains my profile, dive log and friends list

Acceptance Criteria:

Given: a user wants to see a main landing page containing their profile information, the most recent entries in their dive log and their friends list
When: the user logs into Divebook they are routed to their dashboard
Then: the user should have the affordance to navigate to any of the other portions of Divebook
And: clicking on any section (dive log, profile, friends) should take them to that area of Divebook

User login

Story:
As a user, I should be able to fill out a form with my email address, and the username of my choice to register myself in the application

Acceptance Criteria:

Given: a user wants to use Divebook
When: the user first accesses the application
Then: the user should see a welcome message
And: a hyperlink to the registration form

Given: a user wants to register an account with Divebook
When: the user clicks the Register a new account hyperlink
Then: a registration form should be displayed where the user can enter required personal information

Given: a user has filled out fields of the registration form
When: the user clicks the Register button
Then: the system should check if the username and email are unique
And: it should check if the email address is unique
And: if both are unique, a new account should be created
And: the user should be taken to the main view of Divebook

Dive log

Story:

As a user who utilizes Divebook to log dives, I should be able to see a list of all logged dives with a brief synopsis of each one

Acceptance Criteria:

Given: a user wants to see a list of all of their logged dives
When: the user clicks an affordance for going to the list (i.e. button or hyperlink)
Then: the user should be presented with a page listing all of the dives they have logged and a synopsis of each dive
And: clicking on an individual dive log entry should take the user to a page which displays all details of that entry

Dive log entries

Story:

As a user who needs to log dives, I should be able to enter relavant information about each dive

Acceptance Criteria:

Given: a user wants to log a new dive
When: the user clicks an affordance for entering a new dive (i.e. button or hyperlink)
Then: the user should be presented with a form to enter relevant details of the dive
And: buttons to save the dive or cancel the entry

Given: a user wants to view the details of a loggeed dive
When: the user clicks an affordance for viewing dive (i.e. button or hyperlink)
Then: the user should bew taken to a page which displays all details of that entry
And: | the details page should contain affordances to edit or delete the dive

Given: a user wants to edit the details of a dive
When: the user clicks on the logbook entry
Then: the user should be taken to an edit form prepopulated with the currently stored data about the dive
And: buttons to save their changes or cancel the edits
And: upon saving the database will be udated with the new information
And: the user should be taken to the main view of Divebook

Given: a user wants to delete a previously logged dive
When: the user navigates to the page displaying the details of a logged dive
Then: the user should have an affordance to delete the dive
And: upon initiating the deletion of a dive, the user should be presented with a confirmation prompt
And: upon choosing to delete the dive, the dive is removed from the database
And: upon choosing to cancel the delete the user is returned to the dive details page

User Profile

Story:

As a user who utilizes Divebook to log dives, I should be able to see and edit all of my user profile information

Acceptance Criteria:

Given: a user wants to see their profile information
When: the user navigates to the page displaying the details of their profile
Then: the user should see all of their profile information
And: the page should contain an affordance to edit their profile information

Given: a user wants to edit their profile information
When: the user clicks the element they wish to edit
Then: the user should be taken to an edit form prepopulated with the currently stored data
And: buttons to save their changes or cancel the edits
And: upon saving the database will be udated with the new information
And: the user should be taken to the main view of Divebook

Given: a user wants to delete their accont
When: the user navigates to the page displaying the details of their profile
Then: the user should have an affordance to delete their account
And: upon initiating the deletion of an account, the user should be presented with a confirmation prompt
And: upon choosing to delete the account, the user's information is removed from the database
And: upon choosing to cancel the delete the user is returned to their profile page

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.