Pipboy-Fallout-4

My first front-end web development project where I create a clone of the "Pipboy" from the game "Fallout 4"!

Purpose

As this is my first summer as a university student, I decided to dedicate some of my spare time to learn front-end development. My goal was to make something cool with what I was learning so that I could not only put my skills to good use, but also to have fun while doing it!

Also, I had joined my first hackathon, the uOttaHack 4 hackathon, at the beginning of 2021 with limited practical skills. As such, I could not contribute as much as I would have liked to. By doing a project like this, I'm positive that I will be more confident and better prepared for future hackathons.

Concepts applied

The project is built using HTML, CSS, Bootstrap and jQuery. Thanks to CSS flexbox and Bootstrap, the Pipboy clone is 100% compatible across all devices and screensizes. Version control is done entirely using git BASH.

Some demo images

Laptop screen

iPhone screen

Pipboy_Mobile_Demo.mp4

Lessons Learned

• Gained a significantly deeper understanding of page structure, containers, grids; much more comfortable with HTML and CSS.
• Obtained a stronger grasp of the jQuery library and the Bootstrap 4 library after going through trial and error and reading the documentation on my own.
• Overall, I am much more confident with front-end development.