Skip to content

First WDI Project. Deploying a Website Portfolio

Notifications You must be signed in to change notification settings

e-morales/Project0

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Project0

First WDI Project. Deploying a Website Portfolio

My approach to this project was to really attempt to build each section from scratch. Nothing against BootStrap or the like, but I wanted to challenge myself. I wasn't planning on memorizing code snippets at all, but rather understanding how to read and follow along with the code[referring to javascript].

Code Snippets

I reffered to a lot of sites online for assistance. I usually go with neat clean code-a-longs sticking to my skillset that make it simple to follow to prevent complicating myself.

Testimonials

For the testimonials section I already had a simple clean and thin section in mind. Nothing but simple quotes looping around. I followed a tutorial in which this code ran the slider. Image of code It took me a while to understand what was happening at first. It works as a for loop without a for loop. The % modulo is responsible for rotating the slides.

Carousel

This was the same approach as the testimonial slider, but modified to add next and previous controls. Image of code

NavBar

I really like the effect of how the sticky nav sticks to the top of the browser as soon as you scroll down the page. I followed w3c schools to acheive this. Image of code

This is crazy how this one line of code can make your nav links go from a quick, cheap scroll to a timely, smooth effect! Image of code

Hamburger Menu

Very useful article and simple to follow. Vanilla javascript, styling, and some media quieries to acheive a mobile hamburger menu. https://itnext.io/how-to-build-a-responsive-navbar-using-flexbox-and-javascript-eb0af24f19bf

Solved & Unsolved Headaches

Lightbox

The lightbox was tough. I could not find a tutorial I was able to follow. A lot of sites were lightbox plugins that used javascript to install their modal.

I couldn't shrink my name on the header using media quieries. I probably put a handful of styles, making it difficult for the h1 to be responsive just like the rest of the headers.

Overall

Overall, I'm proud of the design I came up with. Obviously I will add more content and switch up certain sections, but I like the theme. It's functional as far as the slides and navigation. It is a good starting point to represent myself and skills to employers.

Links

About

First WDI Project. Deploying a Website Portfolio

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published