/portfolio.github.io

A second attempt at my personal portfolio website following this design I made from a template: https://www.figma.com/design/6vFWPvPk0krYZyIhoS7Zec/My-personal-website?node-id=0-1&node-type=canvas&t=d9z2M0y2SJBwkRaB-0

Primary LanguageHTML

My Personal Website (v2)

Website is live here!: https://cfkim.github.io/portfolio.github.io/

My Personal Website is a clean, organized, and straightforward website to showcase my projects and experience as a mobile developer.

It uses plain, vanilla HTML + CSS. This was a challenge for me to see my HTML and CSS skills which are fundamental to learning more complex frameworks like React. Up until this point I have used Chat GPT and a lot of Googling to help me learn basic web development skills and get projects running. But this time I decided to build a simple and sleek website with the knowledge I've gained so far and minimal Googling. It was quite rewarding since I remember struggling heavily with css and now I know how to identify issues and fix them on my own quickly.

Inspiration

Additionally, in this first release, I decided to use a pre-made Figma website wireframe as inspiration here. I also received heavy inspiration from this portfolio website by Ben Rogers here. I liked the grey scheme for a timeless and minimalistic look that resembles the branding of high end companies like Apple. If I wanted to change the theme, I can easily do so since I wrote my code in a very straightforward and organized way. This was a great learning experience and testament to having some firm grasp of HTML and CSS for myself. I also learned how valuable it is to have a wireframe or mock-up of the website before making it. This cut down on so much development time since I wasn't making design decisions while I coded simultaneously. The result is a cohesive, appealing website.

Learnings

I didn't necessarily learn new things as much as I solidified a lot of things I've learned from previous web dev projects. This mainly includes flexbox layouts and creating a navbar on my own.

Road Map

  • Make it responsive to different screen sizes
  • Make project links functional + animated
  • Improve site content wording and descriptions
  • Implement Dark Mode

Installation

Fork and clone this repository to play with the code and adapt this into your own personal portfolio website.

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.