Skip to content

Latest commit

 

History

History
318 lines (202 loc) · 6.99 KB

reveal-slide.md

File metadata and controls

318 lines (202 loc) · 6.99 KB
Raw
theme transition highlightTheme slideNumber title
night
slide
monokai
false
Frontend Note

Frontend Note

Contents

::: block

  • Shell
  • Command Line Interface(CLI)
  • Git
  • Nodejs
  • JavaScript Engine & Runtime
  • Runtime API
  • ECMAScript
  • Coding Time{style=color:yellow}
  • JavaScript :::

Shell

::: block{style=text-align:left;font-size:36px} In computing, a shell is a computer program that exposes an operating system's services to a human user or other programs.

In general, operating system shells use either a command-line interface (CLI){style=color:yellow} or graphical user interface (GUI){style=color:yellow}, depending on a computer's role and particular operation.

:::

Shell

  • Windows OS: CMD, PowerShell, Git Bash

  • MacOS: Bash, Zsh :::

image info{width="100%"}

image info

Command Line Interface (CLI)

::: block{style=text-align:left;} CLI is a means of interacting with a device or computer program with commands from a user or client.

image info

:::block{style=text-align:left}

  • shell (cd, cat, echo...)
  • package (brew, git, node...) :::

Git

:::block{style=text-align:left} Git is a free and open source distributed version control system{style=color:yellow} designed to handle everything from small to very large projects with speed and efficiency.

  • Github
  • Git Flow

learn git branching :::

Nodejs

:::block{style=text-align:left;} Node.js® is a JavaScript runtime{style=color:yellow} built on Chrome’s V8 JavaScript engine{style=color:yellow}. :::

The runtime environment is the environment in which a program or application is executed.{style=width:100%}

:::block{style=text-align:left;} npm (Node Package Manager)

  • the website
  • the CLI
  • the registry

Node School :::

JavaScript Engine & Runtime

engine{style=color:yellow}

:::block{style=text-align:left}

A program or interpreter that understands and executes JavaScript code.{style=width:100%}

ex: V8, SpiderMonkey :::

runtime{style=color:yellow}

:::block{style=text-align:left}

The runtime provides the host objects{style=color:yellow} that JavaScript can operate on and work with. {style=width:100%}

  • Nodejs: path, filesystem
  • Browser: DOM(Document Object Model) :::

Runtime API

APIs are mechanisms that enable two software components to communicate with each other using a set of definitions and protocols.{style=width:100%}

engine and runtime

ECMAScript

:::block{style=text-align:left} The specification defined in ECMA-262 for creating a general purpose scripting language.

:::

Babel{style=text-align:left}

A transpiler that can convert ES6 code to ES5 code.{style=width:100%}

Coding Time

:::block{style=text-align:left}

requirements
  • Shell
    • MacOS: Zsh or Bash
    • WindowsOS: Git Bash
  • Git
    • git -v{style=color:yellow}
  • Node
    • node -v{style=color:yellow}
    • npm -v{style=color:yellow}

  • Git GUI

    • Sourcetree

  • IDE

    • VSCode

  • repository

:::

JavaScript

  1. Data Types
  2. Build-in Objects
  3. Function
  4. Synchronous & Asynchronous
  5. Promise

Data Types

  • String
  • Number
  • Bigint
  • Boolean
  • Undefined
  • Null
  • Symbol
  • Object
    • Call by sharing
    • Immutable

Build-in Objects

The term "global objects" (or standard built-in objects) here is not to be confused with the global object. Here, "global objects" refer to objects in the global scope{style=color:yellow}.{style=width:100%}

Function

  1. First-class Function

    • Assigning a function to a variable
    • Passing a function as an argument
    • Returning a function

  2. Arrow Function

  3. Currying

  4. Callback Function

Synchronous & Asynchronous

Blocking methods execute synchronously and non-blocking methods execute asynchronously.{style=width:100%}

Promise

  • states
    • pending: initial state, neither fulfilled nor rejected.
    • fulfilled: meaning that the operation was completed successfully.
    • rejected: meaning that the operation failed.
  • prototype

THE END