Welcome to My Portfolio

Hello 👋 and welcome!

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
  • Continued development
  • Useful resources
• Author
• Acknowledgments

Overview

I built my portfolio as a greenfield React.js project. My portfolio showcases some of my best work. I hope you enjoy and talk to you soon!

The challenge

Users should be able to:

• Navigate through portfolio with nav bar.
• Change theme from light to dark mode.
• Click and view projects in production mode.
• Submit contact information in form.

Screenshot

Links

• Live Site URL: Portfolio

My process

I went through a course of reflection, and wanted to develop a React.js application that is fully functional and interactive. The project is complied in components so that it can be easily updated. Media queries were implemented so that the project is responsive to multiple screen widths (mobile, tablet, laptop, desktop). Added a contact form to be able to recieve email from users. Contact form uses EmailJS library to connect to my email. Lastly, added a toggle button that allows the application to switch between "Light" and "Dark" mode made with context API.

Built with

• Semantic HTML5 markup
• CSS custom properties and animation
• Flexbox
• Responsive Design
• JSX
• ES6
• Context API
• React - JS library

What I learned

I learned some new techniques along the way that made customizing my portfolio easier. Context API allowed me to share data with multiple components, without having to pass data through props manually.

Continued development

My journey will continue by re-enforcing my skills in new projects and freelancing. I plan on learning more languages such Ruby, and develop with Wordpress. I want to push the boundaries and create beautiful applications. My goal is to land a full-time development position 👩‍💻 .

Useful resources

• EmailJS - Allowed the contact form to send information to my email.
• Font Awesome - This is an amazing article which helped me finally understand how to implement FontAwesome icons in React.js.

Author

• LinkedIn - Resume
• Twitter - @techcodeflo

Acknowledgments

I want to shout out to SkillCrush community for helping me along the way of becoming a Front-End Developer. With out the help of my instructors, classmates, and friends I wouldn't have discovered my passion for development.