Welcome to my portfolio! I've had my finger tips on keyboards since I was first introduced to the Commadore 64 as a child. Since then I've worked several years in Cyber Security, attended multiple college classes covering various programming languages finializing with a Computer Science degree, written numerous Python scripts for personal projects/tasks, created countless partial games utilizing Unity3D, and recently completed a 6-mth Full Stack Web Developer course. If it's not obvious yet, my heart has never been in Cyber Security - I prefer the rollercoaster ride of working through coding projects. I'm also a bit of a wanna-be artist - I've taught myself basic usage of GIMP for texturing, and sprite creation and Blender for 3D box-modeling/sculpting, rigging, and animating.

• Description
• Lessons Learned
• Installation
• Usage
• Contribution
• Testing
• Questions
• Licensing

That's cool but - what's up with this portfolio? A portfolio is a developers greatest tool for sharing projects and displaying their skillset to potential employers or clients. First impressions are lasting and set the tone so the portfolio shouldn't just be a path to your projects but also an extension of you and your creativity. With this project I set out to create something that doesn't resemble a typical web site.

This being my first React project I wanted to keep additional libraries to a minimum so more focus could be applied to learning React. However, I also wanted to attempt to give the site a 3D feel without using the HTML Canvas to manipulate 3D objects. This meant layer depths were artificial and required 'smoke and mirrors' to achieve a 3D effect. Animations were initially performed in CSS but I quickly switched to using Framer-motion since the CSS was becoming bloated and animations were too cumbersome to tweak. The end-result, in my opinion, gives the site a very unique feel.

Deployed Site: https://donovancourtney.dev/

What did I learn from this project?

The greatest lesson I learned from this project is MOBILE FIRST. I knew the concept going in but didn't give it any thought until too late. But that's okay I have a slightly different idea for a mobile version.

Next lesson is dont mess with react routing::cringe - Something I currently still working on fixing.

Finally, not to diminish the importance of those two but I did learn a great deal about React and Framer-motion animations. I also discovered that building a site's appearance comprised mostly of absolute positioned PNGs makes styling incredibly difficult.

React app generated using create-react-app with the typescript switch option: --templates typescript

• Install packages: npm i
• start: npm run start
• build: npm run build

The site consists of 4 routes - all accessiable from the drop-down menu in the top right. The Projects page has a series of buttons to click to display basic project information and external links. The Contact page has a 'terminal' that is powered on with the right-most large dial. The screen prompts the user for Name, Email and Message.

Follow the "fork-and-pull" Git workflow.

1. Fork the repo on GitHub
2. Clone the project to your own machine
3. Commit changes to your own branch
4. Push your work back up to your fork
5. Submit a Pull request so that we can review your changes

NOTE: Be sure to merge the latest from "upstream" before making a pull request!

N/A

Feel free to contact me with any questions or comments:
[email protected]
https://github.com/decourtney

Code and Docs released under MIT License.