YEAR
TECHNOLOGIES
- React
- Jest
TOOLSET
- AdobeXD
- VSCode
- Git
- Github
- Netlify
Battleships
The classic childhood game reimagined as a modern web application built using the latest front-end web technologies. Users battle against the computer in this turn-based game playable on your desktop or mobile browsers.
LAUNCH PROJECT
Beautiful unit tests compliment the readable structure
A React application full of beautiful unit tests, Object-Oriented programming design principles, and the best parts of JS functional programming. Ships were built with factory functions and then initialized inside two Board components to keep all logic inside a predictable scope. State was kept quite shallow (2 levels) to reduce state-management complexity. Overall, I'm really happy with the naming convention and folder structure proven by the ease of refactoring I experienced.
Skills Utilized
State Management
React's state object is used to control the game logic and user data. Components were built to be class-based. State is kept relatively shallow and no outside API calls are made thereby negating the need for more complex state management tools such as Redux.
Test Driven Development
This approach allowed me to move consistently through my coding steps confident in the robustness of the application. I used React Testing Library to write unit tests for each React component. This allowed for predictable code and faster iteration even with the initial time spent on setting up tests.
Continuous Deployment
Netlify was hooked up with Github allowing for rapid deployment on Netlfy's servers every time I pushed new code up to the apps's repository. This allowed for hotfixes pushed to Github to reflect almost instantaneously in the production environment.