This is my personal, official portfolio website. This site is a place for anyone from employers to enjoyers to view the following:
- My full resume featuring extra information, styling, interactivity, and a downloadable PDF version.
- A comprehensive list of my best works following a recap of my coding journey thus far as well as where to find each project.
- In-depth reviews of said projects with details such as how it was made, my inspiration, and graphics depicting everything from previews to behind the scenes. (Not yet finished.)
- A list of recommendations, awards, and references from previous employers, teachers, and coworkers. (Not yet added.)
- A quick-message system for ease of access and to invite collaboration with other contact information available on the site.
Please feel free to reach out with offers, collaboration requests, or any suggestions on how I can improve this page. I welcome new connections!
I look forward to hearing from you! :]
IF YOU ARE VIEWING THIS IN BROWSER USE THIS LINK TO VISIT THE WEBSITE: boltenbeeper.github.io/portfolio
======= Next part is just for me or anyone who would like to use this site as a template for their own work: =======
To add a new project to the My Work page:
- Copy and paste one of the folders from the “details” folder. The copied folder should contain a .html, .css, and .js, file. (Any of the folders will do but it’s best to start with whichever one best matches the styles of the page you want to make.)
- In the index.js file of the my-work folder, look for the div with the “listed-projects” class. Inside that div is all of the projects displayed on the My Work page. Copy and paste one of the chunks of code that starts with the “listed-project” div whereever best fits inside the listed-projects div. The code chunks to copy and pase should be clearly separated with empty lines between them and labled.
- Change any mention of the projects name with the name of the new project, making sure to keep original format, capitalization and syntax in tact. (Be sure to look in class names and the names of linked files for all references. In total, there should be about 6 references of the project’s name.)
- In the same index.html file, look trowards the top of the file for the “nav-map” div. Inside that div, look for the list items (li) that each have a class similar to NM1. Copy and paste that one of those list items and all of it’s children and paste it before/after the same projects you pasted the previous code chunk. Then, correct the references to whichever prject is on the pasted chunk to reference the new project. (Make sure all of the NM1 type classes are in numerical order. Ex.: NM1 -> NM2 -> NM3)
- Find the my-work.js file in the same my-work folder. Look towards the top of the file for all of the querySelectors referencing the same class names similar to NM1. Copy and paste one of the code chunks and do the same thing as in step 4 as far as where to paste the chunk, correcting the referenced project, and ensuring numerical order for the class names.
- Towards the middle of the file, there will be a chunk where every new line references one of these class names. Similar to steps 4 and 5, copy and paste one in the apropriate place in the list of lines and ensure numerical order.
- Now, all that is left is to change the styles/html for the new page that was copied and pasted from step 1. Customize the page however you’d like and use what ever pictures you’d like. The built in image viewer for the details pages should automatically sync up to what ever pictures are used for that specific page.