KL

Notes

Web Design and Frontend Dev-related Resources

Introduction

This page contains my notes taken while studying web design and front-end web development.

Technologies & Applications:

  • Git (Version Control System)
  • Github (Free Cloud Source Code Storage and Git-based Version Control System)
  • Github Pages (Free Static Site Hosting)
  • VS Code (Code Editor)

Getting Setup

Basic Website Folder Structure


sitename/
    index.htmlcss/
        style.css

Blank HTML Document

Example index.html file:

Blank CSS Document

Example style.css file with a CSS Table of Contents:

Base Styles

CSS Global Reset

CSS Global Colors

CSS Global Typography

This is a Heading 1

This is a Heading 2

This is a Heading 3

THis is a paragraph. This is bold text. This is italic text. This is a inline text link.

  • This is an Unordered List Item
  • This is an Unordered List Item
  • This is an Unordered List Item
  1. This is an Ordered List Item
  2. This is an Ordered List Item
  3. This is an Ordered List Item

This is a link.

Glossary:

Common Terms & Definitions:

HTML
Hypertext Markup Language
CSS
Cascading Style Sheets
JS
JavaScript
CLI
Command Line Interface
GUI
Graphical User Interface

Helpful CLI Commands:


$ cd // returns path to current directory

$ dir // returns list of contents inside the current directory
$ cd Desktop // move down one level into a sub directory

$ cd .. // move up one level into the parent directory

$ git clone https://github.com/username/reponame // copies a remote repo to your local computer