GA

Notes

Web Design and Frontend dev tings

Introduction

This page contains my notes taken while studying webdeisng and font end web dev

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 Reset

CSS Global Colors

CSS Global Typography

This is Heading 1

This is Heading 2

This is Heading 3

This is a Paragraph. This is bold text This is italics. This is an inline text link. More words for extra emphasis of this lesson!

  • 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


$ pwd (cd on PC) // returns path to current directory

$ ls (dir on PC) // returns list of contents inside the current directory

$ cd Desktop // move down a level into a sub directory

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

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