Portfolio Website

Description

[App] Creating my own personal portfolio

See it live on tonyisern.com Or clone repo, cd into repo, then run "npm run start" See my API endpoints at https://optimistic-blog-api.herokuapp.com/api/posts

Purpose

Creating a portfolio to showcase my projects, as well as a place for contact information and a blog. Blog fetches data from an Express server with API endpoints for the blog posts

Beyond that, other learning outcomes were:

• Designing reusable components
• Creating a blog using local markdown files
• Using EmailJS to send emails
• Using CSS animations
• Typescript for types

Features

1. Allows users to see a list of all my projects
2. Users can see all of my contact information, including Github, LinkedIn, and email.
3. Allows can see blogs
4. Users can navigate between blogs on a blog page using the 'Next' and 'Previous' buttons
5. Users can see a video snippet of each project, as well as the hosted project and code.
6. Allow users to send an email with EmailJS using the contact page

Development

Javascript Framework(s)

• React
• Next

Technologies used

• Netlify - Hosting
• React CSS Modules - CSS with local scoping
• Typescript - Static typing in JavaScript
• EmailJS - Sending emails

Areas for Improvement

• Use MDX for blogs instead of markdown
• Allow users to comment on blogs
• Add a representative image to each blog post
• Have CSS animations occur as the user scrolls into view instead of on the page load

Known Bugs

1. Navigation menu links are not showing the correct font