Brainscape's Knowledge GenomeTM

Browse over 1 million classes created by top students, professors, publishers, and experts.


See full index

(Module 1) HTML, CSS, & JavaScript for Web Developers > Intro to HTML5: Development Environment Setup > Flashcards

Intro to HTML5: Development Environment Setup Flashcards

1
Q

Command Line Interface (CLI)

A

A command line program that accepts text input to execute operating system functions.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

Windows OS Command Line Interface (Win CLI)

A

Command Prompt (a.k.a. CMD Program)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

Macintosh OS Command Line Interface (Mac CLI)

A

Terminal

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

File System (fs)

A

An integral part of every OS. Functions Include:

  • Managing the folder/directory structure
  • Providing an index of files
  • Defining syntax for the paths to files
  • Dictating file names, max size, and storage capacity.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

Windows OS File System’s Name

A

File Allocation Table (FAT)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Macintosh OS File System’s Name

A

Apple File System (APFS)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

File System Commands

A

Utilities which allow you to manage the files you download or create. They are designed to operate on file systems.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Are File System Commands Universal?

A

No. They are operating system (Windows vs. Mac) specific. However, there are SOME universal commands that work on both OS.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

Confirming App Installation on CMD Program (Windows)

A
  1. Open Command Prompt

2. Enter: “AppName –version” (Ex: “node –version”)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

What Does NPM Stand For?

A

Node Package Manager

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

What does NPM do?

A

Two main functionalities:

  1. Online repositories for node.js packages/modules => searchable on search.nodejs.org
  2. Command line utility to install packages, do version management, and dependency management of Node.js packages.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Program Plugin Global Installation Stepts (CMD Program - Windows)

A
  1. Open CMD Program
  2. Enter: “ProgramName” “Install” “-g” “Plugin-Name”

(Example: “npm install -g browser-sync”)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

What is “-g” in a CMD Program Installation

A

“-g” = “Globally”

Installs Program/Plugin “globally” (all users on PC) rather than locally (active user doing installation only)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

GitHub

A

A website for hosting source code in Git. It is the most common place to share and collaborate on open source projects, and can also be used to host private repositories for companies.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

Git

A

A Distributed Version Control System

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

Steps: Setting Up GitHub Hosting

A
  1. Create a Repository
  2. Repository’s Settings > “Pages” Section
  3. “Source” > Select Branch > Select Folder > Save
    * Optional: Theme Chooser > Pick Theme*
  4. Site URL Created and is Ready to be Published
  5. Create an “index.html” file > Save Somwhere in Repository’s Folder located locally on PC
  6. Host All Code in the “Main” Branch
17
Q

Steps: Using GitHub for Hosting

A
  1. Pull Repository onto Local Machine
  2. Create a Sub-Folder/Directory in Main Repository (Local)
  3. Create & Save an “index.html” file into local Sub-Folder (Using Sublime Text)
  4. Commit Changes (Sub-Folder)
  5. Push Committed Changes into Remote Repository
  6. Check GitHub to Confirm Local Changes Added to Remote Repository
18
Q

GitHub Hosting (Step 1): Pulling Remote Repository onto Local Machine

A
  1. Copy Repository’s Link (“Code” Section of Repository’s Page on GitHub > “Main” Branch > Green “Code” Button > Copy “.git” URL)
  2. Open CMD Program (Win) or Terminal (Mac)
  3. Enter: “git clone (Paste URL)”
19
Q

GitHub Hosting (Step 2): Creating Local Sub-Directory

A
  • In CMD Program (Win) or Terminal (Mac)*
    1. List Command (Win = “dir” / Mac = “ls”)
    2. Change Directory Command: “cd (Repository’s-Main-Directory)/”
    3. List Command Again
    4. “Git Status” Command (Shows Current Branch & Changes Made, if any) > Confirming in the Right Place.
  • *Switching Branches: “Git Checkout (Branch Name)”
    5. Make Directory Command - Makes Sub-Folder (“mkdir (Directory’s Name)” or “md (Name)”)
    6. Change Directory Command Again > Into Sub-Directory “cd Sub-Directory-Name/”
20
Q

GitHub Hosting (Step 3): Creating Source File (index.html) in Sub-Directory

A
  • In Sublime*
    1. Open New/Empty File
    2. Save File as “index.html” in Sub-Directory Folder (Path File (Win): C:\Users\User\Main-Directory\Sub-Directory)
    3. HTML Template (“HTML” + Ctrl + Space into Line 1)
    4. Enter Title Content Between &
    5. Enter H1 Content Between <h1> & </h1>
    6. Save File
21
Q

GitHub Hosting (Step 4): Comitting Changes

A
  • In CMD Program (Win) or Terminal (Mac)*
    1. Confirm location is in Sub-Directory (cd into it if not)
    2. “Git Status”: Confirms Directory Location & Change(s) status
    3. Move to Main Directory (Either “cd (dir. name)” or “cd ..” = one directory up from current)
    4. “Git Status” (Name in Red) = Changes Not Committed nor Marked
    5. Marking (Specific file(s): “git add “ or All Changes in Local Folder: “git add .”)
    6. Git Status > Newly Marked File Highlighted in Green
    7. “Git Commit -m “Message in Here” (-m = Req. for Message)
    8. Git Status > “(…) by 1 commit” = Changes Have Been Committed Locally
22
Q

GitHub Hosting (Step 5): Pushing Committed Changes to Remote Repository

A
  • In CMD Program (Win) or Terminal (Mac)*
    1. “Git Push” > Push Local Changes to Remote Repository
    2. “Git Status” > “Working Tree Clean” = Repository Successfully Pushed to Remote
23
Q

GitHub Hosting (Step 6): Confirming Changes are in GitHub

A
  • In GitHub*
    1. Go to Repository > “New Files Posted”
    2. Checking Web Page: Original URL for Web Page (NOT Repository) + “/Sub-Directory-Name” Added on end > New Page & its changes should appear
24
Q

Browsersync

A

A plugin for node.js/npm that watches HTML and CSS files and performs live reloads to page in browser when changes are made. Tweaking/Testing made faster de to its synchronizing of file changes and interactions across all devices.

25
Q

Browsersync: Start Command

A

“browser-sync start –server –directory –files “(Asterisk)”

26
Q

Breakdown of Browsersync “Start” Command

A

(Browser-sync Start): Telling Browsersync hich Action to Perform
(–server): Starting in Server Mode (Like a Local http Server)
(–directory): Provides Directory Listing of Current Folder
(–files “…”): Which Files to Look for
(–files “*”): The Asterik tells B.S. to reload everything no matter what

Full Start Command Options:
Reload All Files: Browser-sync Start –server –directory –files “Asterisk”
Reload Specific File(s): Browser-sync Start –server –directory –files “File(s) Name(s)”

27
Q

How to Use Browsersync

A
  1. Starting Browsersync opens a new window (URL: localhost:3000)
  2. Select File Being Edited (Files Listed Under “~/”)
  3. Keeping Browser Open > Make Edits to File in Sublime
  4. Save File > Browser Updates Automatically

(Module 1) HTML, CSS, & JavaScript for Web Developers (12 decks)

Brainscape helps you reach your goals faster, through stronger study habits.
© 2024 Bold Learning Solutions. Terms and Conditions