This is the raw code for the personal portfolio of Charley McGowan
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.
See it live here: www.glitchwizard.dev
The initial portfolio layout can be found HERE
This page will be deployed, but if you want to run it from the source, here's what you'll need:
- NodeJS will need to be installed
- Clone this project to your machine from GitHub
- Yarn is used That's it as far as any pre-req's to get this running.
- Open your favorite terminal and run 'yarn install' from the cloned directory
- From that same terminal run 'yarn start'
Currently Deployed via Netlify:
- NodeJS - The web framework used
- npm - Dependency Management
- React - Used to generate HTML components
- Yarn
- VS Code - Ya know.... to code this beast
Charley McGowan
- Get Engineering projects to be fed from LinkedIn API projects section of my profile (I thought that would be cool )
- Add Contact Section with all my contact info, or maybe make a contact form and have it email me.
- SVG Map my face for the particles to make my face a shape.
- Get the pics in engineering to pop up in a cool modal way
-- Kenny Westfall suggestions --
- Personally I feel the sections don't need their white outlines. They add too much visual complexity, detracting from the cool animated background. I would also recommend adding a subtly transparent dark background to the content sections to make the words a little more readable above the moving lines, improving user experience for people with trouble reading light text on dark backgrounds.
- Also consider making your content sections have a consistent width. Unless you intended a funnel appearance, scrolling down from the wide music section to the narrow engineering, then even narrower about seems jarring.
- Your motivations behind the projects provide great insight into your work and personality as well. I would encourage you to write more about each project in an expandable info section so people who are interested can read more about what you've done. For example, hearing that you have enjoyed coding your current site from scratch and learning as you go is a great signal to hiring managers that you are hungry to learn and grow, and not stuck in your ways.
- Frankly, the outlines give the site a MySpace feel, so if that was your intention then feel free to keep it. In my experience with web design I have found that less visual emphasis on the structure allows the content to shine more.
- Another suggestion, for the coding section, is to move the linked project titles up next to the number to make the cards more readable and to look cleaner. ** Make the title text white but keep it a link. Make the whole card a link, if possible. ** I still think the cards could use a little tweaking so they stand out from the background. Right now I feel like the animated lines clash with the white text.
- If you want to get real fancy, you could make the images set as backgrounds for the same size thumbnails for some consistency, then clicking it launches the full image view. knetwalker's profile picture
- If you want to get real fancy, if you think you would add other projects that would require this function later, you could code a gallery that would automatically set the width of the images based on the number of images you are using.
Used Git for versioning.
- Charley McGowan - Full Project
- Billie Thompson - Initial Readme setup - PurpleBooth
See also the list of contributors who participated in this project.
This project is licensed under the MIT License - see the LICENSE.md file for details
- Epicodus for teaching me how to do any of this at all.
- Lina Shadrach and Franz Knupfer or answering my endless questions in class
- PurpleBooth for the README template to get started here
- adam-p for the README tips and tricks
- Deadmau5 for the coding focus music.
- Kenny Westfall, for giving killer feedback on the look and feel of the site