Gifty

Table of Contents

• Description
• Installation
• Walkthrough
• Contributors
• Technologies

Description

• This was the capstone project for the Turing School of Software and Design. We worked in a team of front and back end engineers to complete a full stack application over the course of two weeks.

• Our team utilized Agile methodologies and a git rebase workflow to collaborate on Gifty, an application to keep track of dates and gift ideas for friends' birthdays. We have all had the experience of shopping last-minute for a birthday gift you forgot to purchase, and settling on something less-than-stellar for an amazing friend. With Gifty, you'll never spend the day before a birthday desperately browsing Amazon again.

Deploy Link

https://gifty-capstone.herokuapp.com/

Frontend Repo

https://github.com/Gifty-capstone/gifty-frontend

Backend Repo

https://github.com/kendallha/go-look-at-a-tree-api

Notable frontend features

• Built using React framework
• Use of Router to enable user to navigate using back and forward browser controls.
• Implemented Redux for global state management
• Frontend tested with Cypress acceptance testing including the use of stubbed fetch data and happy/sad paths
• Utilized responsive design for mobile, tablet or desktop viewing
• 95% Lighthouse accessibility score

Installation

1. Clone down this repo
2. cd into project directory
3. Run npm i to install all project dependencies
4. Run npm start to begin the server
5. Application should open in default browser window (if not, navigate to http://localhost:3000)

Walkthrough

Home Page

When the application loads, the dashboard of a demo user is displayed. The dashboard shows a list of upcoming birthdays, as well as if a gift has been purchased for those birthdays. A complete list of friends is displayed on the main dashboard.

The user can add a new friend from the dash board, via a modal form.

By clicking on any friend's name, the user can visit their specific gift page to view details about that friend.

On this page, the user can add, delete, or mark any gift as purchased.

Wireframes

Learning Goals

• Collaborate with backend engineers to build a full stack application.
• Practice using an Agile workflow.
• Implement git rebase workflow.
• Understand and implement Redux.
• Expand upon React skills to build a more complex application using Hooks.

Contributors

Melanie Daoheuang	Kendall Haworth	Rachel Hendricks

Technologies