DEV Community

TheTruth4418
TheTruth4418

Posted on • Updated on

Final project..

My journey through Flatiron school is almost complete as I wrap up my React project. With the struggles endured during this project I feel it has made me a better developer and I am ready for what's next.

-Synopsis

My Project is for fighting game players to have notes on command so that they can remember what they need at any given time! As of right now I am supporting Mortal Kombat 11, Tekken 7, and Guilty Gear Strive!

-PROJECT FLOW

Starting off with a very generic home screen, can select between Creating/Viewing notes!

-Create

Alt Text

Creating a note will pull up a form depending on whether we view a character or a matchup note with the use of state. The data submitted by the form is then submitted via Redux-thunk.

-View

Upon selecting Viewing mode, users are asked to select the type and then the game separately in order to make the code easier to read.

-CharacterNoteSelect/MatchupNoteSelect

These components pull up a form that will dynamically retrieve the list of characters the selected game. Code snippets shown are for Character but are relatively the same for Matchup as well just little more code due to having to include another character!

Alt Text
Upon mounting the component, I have redux actions to refresh the current note in redux, I then use a function to set up the form based off the game!

-NoteCard/MatchupNoteCard

These are my functional presentation components that display all the info to the client!
Alt Text
Using a little bit of destructuring, I displayed some information, but I needed the use of another component NoteList to take in each note of the character and put it in an array so that I can easily just display that array in my div!

Beyond this I also added functionality to add bullet points to a note as well!

-Conclusion

I plan on developing this application more and more and add exciting things like updates and user functionality!

Creating this application helped me understand React to a deeper level than when I was reading material over it. With the struggles endured on this project, I am ready to face the challenges of the full-stack software development workforce.

Thank you Flatiron School for all your help.

Top comments (0)