Skip to content

dmattox10/React-Sorting-Hat

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

40 Commits
 
 
 
 
 
 
 
 

Repository files navigation

React Sorting Hat

JavaScript Style Guide

This project is deployed HERE CLICK ME! on my own server.

  • This project is front-end only.
  • Added docker.

Note

Running this project with the data-no-weights gets rid of the need for a gray state for the bar, but almost everyone ends up in slytherin so I ended up tweaking the data quite a bit, and the code that uses those weights was fun to write.

Below is the original summary for the assignment, I took it from there!

React Sorting Hat - Stretch Assignment

Welcome to Hogwarts, the School of Whitchcraft and Wizardy. One of the tools that is used by students of Hogwarts on their first day entering the school is notoriously known as the Sorting Hat. Your goal throughout this stretch assignment is to build the Sorting Hat using ReactJS.

About this project

Obviously I'm using React, here with functional components, and Context API for state management/sharing. I'm especially fond of the progress bar component, found online as a static CSS styled "object" which I made dynamic! It may not be obvious at first when using the app, that you need to mouse off of, or touch off of the cards to flip them back to the question side.

Todo

I would like to add a touch more color, and some social features.

Screenshots

The progress bar changes color as it fills to reflect the house that you are most alike up to that point based on your answers.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •