Introduction

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

My Reference Links:

• John Doe's Github: https://github.com/johndoenma
• John Doe's Codepen: https://codepen.io/johndoenma
• KCC NMA's Github: https://github.com/kccnma
• KCC NMA's Codepen: https://codepen.io/kccnma
• A Complete Guide to Flexbox: https://css-tricks.com/snippets/css/a-guide-to-flexbox
• A Complete Guide to Grid: https://css-tricks.com/snippets/css/complete-guide-grid

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.html
├── css/
│   ├── 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 Resets

---

CSS Global Colors

---

CSS Global Typography

---

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:

$ pwd (or simply "cd" on a PC) // returns path to current directory

$ ls (or "dir" on a PC) // 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