Skate Builder

Description

It allows the user to see their custom skateboard in 3D and orbit around it. Users can modify the board components such as the wheels, trucks, bottom of the board, and the top of the board.

I created the web application from prototyping and designing to coding it. The focus of the project was to take advantage of React's virtual dom to make a more dynamic application. I also wanted to implement react hooks to better organize my code but to increase performance as well.

Technologies/Design

Technology Stack

• Frontend: HTML, CSS, JavaScript, React, P5
• Hosting Platform: Netlify

Libraries/Frameworks

• React
• Bootstrap

Packages

• React P5 Library
  • Link: https://www.npmjs.com/package/react-p5

Other Tools

• Trello for keeping track of my tasks
• Google's Draw.IO to help with project design

Documentation Links:

• Technical Document: https://docs.google.com/document/d/1MCRrqGJQbbMHs3IyIg8_CmagLsrP3YsuiWWqv7RdNIg/edit?usp=sharing
• Flowcharts:
  • Component Flowchart Link: https://drive.google.com/file/d/1mCwIyYelgMC8WvLxBIdH0SdYwnCaT5LW/view?usp=sharing
  • Sketch Link: https://drive.google.com/file/d/1D_5B5luLsOGYqyqOw4wWxQUnhoPidzFu/view?usp=sharing