Portfolio

Christopher T. Guy

Welcome

Welcome to my "Portfolio" web site, the first of three web sites that I'm building on my path to becoming a Front-End Web Developer.

Get with "The Program"

Learn to "Code"

The Vision

“There is nothing like a dream to create the future”

Victor Hugo

The world is only a click away, a swipe to the left, a scroll up.


Technology is everywhere. We use it to help with simple every day tasks, to complex medical procedures, or for just plain ole entertainment.

It's everywhere and it's Awesome.

My name is Christopher Thomas Guy, I was in construction for 30 years and found myself needing a career change.


My tools changed.


My career changed.


But I still build things...



Now I build...

Business Web Sites

Personal Web Sites

Technical Web Sites


The Path

“Education is the passport to the future, for tomorrow belongs to those who prepare for it today.”

Malcolm X


How to find a job on the Internet?

Build the Internet...

One day while searching YouTube and the internet for career ideas I came across a video on Web Development. I watched an HTML tutorial from Traversy Media and was hooked immediately. I was barely 10 minutes into the video when I had to pause it, I made sure I had a code editor downloaded so I could code along, I unpaused the video and the rest is history...

The Internet is just simply a bunch of web pages, right!


Where to Start?

What is a Web Page?

The simplest way to put it is, a web Page is just an HTML document that the internet browser reads and renders to your screen. The HTML document contains the information about the web page and can very from text that simply reads "Hello World" to a Facebook or Twitter web site, they all use an HTML document for thier Web Pages.

There are many ways to populate an HTML document. HTML in itself is not complicated, It's just a bunch of tags (lables) that tells the browser where to put things on a page. This can be anything from headers, plain text, buttons, forms and or pictures. I mentioned earlier that this can be done with putting the tags right into the HTML document, the other way is use logical programming to insert (inject) the tags into the document.

I decided to start with the basics HTML, CSS and JavaScript.

Web Development Tutorials

I use YouTube videos for lectures and tutorials, it offers a limitless selection of tutor's to explain the same thing differently for different skill levels and spoken Languages. Anyone can find someone to help them learn. Being able to pause the lecture at any time and practice writing actual code is "limitless learning for anyone's pace".

Crash Courses

Traversy's Tutorial Trifecta

The basics for front-end development is right here in 3 relatively short video's totaling just over 4 hours.

The HTML crash course was the video that first got me hooked. I think each one is perfect for someone just starting out and wanting to get a taste of each stage of web development, Brad is an easy person to listen to and dosesn't talk down to you or over your head.

Thank you Brad Traversy

YouTube Tutors

What to Learn?

Web Development is a vast field of coding languages, libraries and frameworks. The first two skills I learned were HTML and CSS. These are mostly concidered coding languages and not programming languages. They are used for the mark-up and styling of a web page. They're also used in combination with logical programming languages like javaScript, PHP, Python and more.

I started with just the basics of front-end (client-side) web development by first making static web pages with HTML and CSS. I then moved forward using a CSS compiler called SASS and started adding some vanilla javascript (front-end script programming language).

Back-End (server-side) programming languages use the HTML mark-up as well as CSS styling but they are written right into the programming script. They usually don't seperate mark-up and styling with the actual programming. This can be a little more confusing for a person just starting out. It can get complicated if you're not sure of the differences of what each language does and is used for.

Web Development Skills

This section has been divided up into 3 categories. Front-End Development, HTML, CSS and javaScript. Full-Stack Development that looks at the node.js family. The Back-End or Server-Side that looks at other technologies the the node.js stack covers in one language.

Front-End Development

HTML, CSS and Vanilla JavaScript.

  • HTML Logo

    Skill Level:

    Intermediate

  • CSS Logo

    Skill Level:

    Intermediate

  • Sass Logo

    Skill Level:

    Intermediate

  • Tailwind Logo

    Skill Level:

    Novice

  • Bootstrap Logo

    Skill Level:

    Novice

  • javaScript Logo

    Skill Level:

    Intermediate

  • typeScript Logo

    Skill Level:

    Novice

  • git Logo

    Skill Level:

    Intermediate

  • npm Logo

    Skill Level:

    Intermediate

  • jquery Logo

    Skill Level:

    Novice

Full-Stack Development

MERN, MEAN & MEVN Stack

  • Mongodb Logo

    Level

    Junior

  • Express Logo

    Level

    Junior

  • React Logo

    Level

    Junior

  • Node.js Logo

    Level

    Junior

  • Vue Logo

    Level

    Novice

  • Angular Logo

    Level

    Novice

  • Redux Logo

    Level

    Novice

  • Next Logo

    Level

    Novice

Back-End Development

Server Side Programming

  • Python Logo

    Level

    Novice

  • PHP Logo

    Level

    Novice

  • SQL Logo

    Level

    Novice

  • apache Logo

    Level

    Novice


Where to Learn it?

University, Polytechnics and Bootcamps.

A Computer Science Degree from a University would be my first choice, if I was 30 years younger.

Any Technical Institution that offers credited certifications for programming languages would be my second choice, if I had the financial means to attend and the time to commit.

The third choice would be to enroll in a Bootcamp, this also presents a problem with no financial means to enroll, it does shorten the learning time with the condensed version of a Bootcamp environment.

I chose the self-taught route?

Web Development Courses

Free Code Camp

Free Code Camp is a great way to learn free with a structured learning environment.

It is a free environment so you might have to get more in depth studies elsewhere, I do think it's a great way to structure your learning. They showed me areas to study that I didn't even consider on my own.

Visit Free Code Camp

Responsive Web Design

HTML, CSS

  • Tribute Page

    Tribute
  • E-Commerce

    E-Commerce
  • Survey Form

    Survey
  • Documentation

    Technical Documentation
  • Portfolio Page

    Technical Documentation
  • Certificate

    Responsive Web Design Certification

JavaScript

Vanilla JavaScript

W3 Schools

W3Schools is my go to for quick reference and code examples for basic CSS and HTML.

They offer a structured environment for a lot of other languages as well, PHP, Python, React, SASS and many more.

Visit W3Schools

JavaScript

Basic Vanilla JavaScript

My Notes

My learning includes theory as well. I had a project in the FCC Responsive Design course that had me make up a Documentation page. I now use that format to build pages to put my notes on.

When I first started learning I took hand written notes, I had pages and pages of notes. Hmmmm I was learning how to become a Web Developer, so I started making pages for my note that I could access anywhere

Most of my note are taken verbatum from one source or another. The process of reading the documentation pages then making my own that has the same info (writing down what the Professor said) made me read and reread the same information over and over.

I made code example to write out the code that I was learning in theory class, not just listening to a lecture or reading it once in a book.


The Future

“My interest is in the future because I am going to spend the rest of my life there.”

Anonymous

The Future

Is in Your Hands

The Technology field is limitless, seriously, if you don't find a sector in Technology to work in... create one.


The visionaries and creators of today are bringing to life some awe inspiring concepts and changing A.I, Robotics and Computing forever.

"If you build it.."

A.I.

Robotics

"They will come!"