Personal Website

Author: London Joseph

Deployed at https://elondonj.github.io/

This web page is the final project for the CS410 Intro to Web Developement at Portland State University. The site utilizes a single-page layout with a navigation bar at the top and about, resume, project and contact sections.

The site is built using CSS, HTML, Boostrap and JavaScript.

Navbar

The navigation bar is built Boostrap classes and the Boostrap JavaScript bundle were used for the navbar. The navbar also uses the google font Modak for the logo.

Animation

On large and medium screen an interactive partical animation is displayed. I followed a tutorial by Franks Laboratory for the animation. The code for the animation is found in anima.js

About

The about section has a short bio and picture of myself. This section uses a combination of custom CSS and Boostrap for formatting and design.

Resume

The resume section summerizes my relevant course work and technical skill set. This section uses a combination of custom CSS and Boostrap for formatting and design.

Projects

The projects section displays previous projects in a carousel slider. The slider was built with Bootstrap classes and operated utilizing the Boostrap JavaScript bundle.

Contact

The contact section takes was built with Bootstrap form classes. Messages sent from form to my email via Formsubmit.co

Footer

A small footer with a randomly selected insirational quote. Quotes are sourced from (https://type.fit/api/quotes) api. Quotes.js contains the code for fetching from the api.

References

• Bootstrap 5/Bootstrap JavaScript bundle
  https://getbootstrap.com/docs/5.2/getting-started/introduction/)
• Franks Labratory "Vanilla JavaScript Text Animation Tutorial"
  https://www.youtube.com/watch?v=XGioNBHrFU4)
• Code with Ania Kubow "Send emails from a HTML Conact Form"
  (https://www.youtube.com/watch?v=r4RQ38EoLds)
• Navbar portion from Bootsrap 5 crash course
  https://www.youtube.com/watch?v=4sosXZsdy-s&t=839s
• Carousel Slider Bootstrap 5 | Slider Carousel Tutorial
  https://www.youtube.com/watch?v=ku_97a6Bgkg
• FormSubmit
  https://formsubmit.co/
• Quotes api
  https://type.fit/api/quotes