alexmayberry / dev-portfolio

This is my web development portfolio.

dev-portfolio

This is my LIVE web development portfolio.

Road Map

0.0 Create repository

0.1 Create Idex.html and style.css

0.2 Create header

0.3 Create project tile template

• Set up css grid and flexbox to responsively array and scale multiple project tiles
• Use media queries to control grid

0.4 Create footer (aka bio)

• create a responsive layout for it using css grid

0.5 Add static full height, third width element

• Add statitic left third full height element on desktop view that would show the bio/footer section for the home screen, and projects gallery when the user is viewing a project. It would also be the full width bio page and project gallery page for mobile

0.51 Add Media Queries

0.6 create a template project page that goes into greater detial about the project

0.7 Add a 'next project' or 'other projects' preview section at the bottom of the template project page.

Do this by using a pseudo class and order if possible.

0.8 Add :hover and other pseudo class functionality

0.9 Add pseudo element functinoality

• Add "about Alex" tool tip to bio-icon

1.0 - Fully functional and responsive site

The first version will be made using nested divs and classes to style the elements. I will also css grid and css flexbox to create the layout and control the responsiveness.

Features for Later Versions

• Add pseudo classes to create a filter for projects on the project page
• Use Sass to create CSS variables which can easily be updated or varied to create dark mode or light mode
• Link site to my github to add things like language graphs to project pages.
• Give a preview of the project and expand its tile to take up the whole screen on the project page. Then add a more indepth preview of the project and a "read more" button that would take you to the full project page. The other tiles would shift around and when clicked on would grow to do the same expanded preveiw view.
• Add a "subscribe for future content" form to my bio and learn how to save that data.
• Add