DEV Community: kim

Node.Js Api Cheat Sheet

kim — Wed, 02 Jun 2021 16:09:23 +0000

Spawn - passthru the in/out

var spawn = require('child_process').spawn;

var proc = spawn(bin, argv, { stdio: 'inherit' });

proc.on('error', function(err) {

  if (err.code == "ENOENT") { "does not exist" }

  if (err.code == "EACCES") { "not executable" }

});

proc.on('exit', function(code) { ... });

// also { stdio: ['pipe', 'pipe', process.stdout] }

// also { stdio: [process.stdin, process.stderr, process.stdout] }

proc.stdout.on('data', function (data) {

});

proc.stderr.on('data', function (data) {

});

Snippets

info = require('../package.json')

info.version

process.stdout.write(util.inspect(objekt, false, Infinity, true) + '\n');

[Globals] exec

var exec = require('child_process').exec,

var child = exec('cat *.js bad_file | wc -l',

  function (error, stdout, stderr) {

    console.log('stdout: ' + stdout);

    console.log('stderr: ' + stderr);

    if (error !== null) {

      console.log('exec error: ' + error);

    }

});

Globals

__filename

__dirname

Reference

Node.Js Api Cheat Sheet - Cheat Sheet Maker

Pug Cheat Sheet

kim — Wed, 02 Jun 2021 16:00:48 +0000

[Mixins] Mixin blocks

mixin article(title)
  article
    h2.title= title
    block

{: data-line="1,4"}

+article('hello there')
  p Content goes here

See: Mixin blocks

[Mixins] Mixin attributes

mixin pet(name)
  span.pet= name

{: data-line="1"}

+pet('cat')

See: Mixin attributes

[Mixins] Mixins

mixin list
  ul
    ···

{: data-line="1"}

+list

Mixins allow you to create reusable code blocks.
See: Mixins

Mixins

{: .-three-column}

[Pug] Conditionals

if authenticated
  a(href='/logout') Sign out
else
  a(href='/login') Sign in

{: data-line="1,3"}

See: Conditionals

[Pug] Multiline text

p.
  This is text that doesn't need to
  be prefixed by pipes.

{: data-line="1"}

script.
  // It's great for raw
  // JavaScript and stuff
  alert('hello')

{: data-line="1"}

[Pug] Includes (partials)

include ./includes/head.pug

include:markdown article.md

See: Includes

[Pug] Layouts

//- page.pug
extends layout.pug

block title
  | hello

block content
  | hello

//- layout.pug
title
  block title
body
  block content

[Pug] Iteration

ul
  each user in users
    li= user

[Pug] Comments

// This comment will appear in the HTML

//- This is a silent comment

//-
  Nesting inside a comment creates
  a comment block

See: Comments

Reference

Pug Cheat Sheet - Cheat Sheet Maker

Golang Cheat Sheet

kim — Wed, 02 Jun 2021 15:59:51 +0000

Files Embedding

package main

import (
    "embed"
    "log"
    "net/http"
)

// content holds the static content (2 files) or the web server.
//go:embed a.txt b.txt
var content embed.FS

func main() {
    http.Handle("/", http.FileServer(http.FS(content)))
    log.Fatal(http.ListenAndServe(":8080", nil))
}

HTTP Server

package main

import (
    "fmt"
    "net/http"
)

// define a type for the response
type Hello struct{}

// let that type implement the ServeHTTP method (defined in interface http.Handler)
func (h Hello) ServeHTTP(w http.ResponseWriter, r *http.Request) {
    fmt.Fprint(w, "Hello!")
}

func main() {
    var h Hello
    http.ListenAndServe("localhost:4000", h)
}

// Here's the method signature of http.ServeHTTP:
// type Handler interface {
//     ServeHTTP(w http.ResponseWriter, r *http.Request)
// }

Reference

Golang Cheat Sheet - Cheat Sheet Maker

Watchman Cheat Sheet

kim — Wed, 02 Jun 2021 15:38:07 +0000

Also see

Documentation (facebook.github.io) ### Watching

watchman watch ~/src
watchman watch-list
watchman watch-del ~/src

Getting started

watchman watch ./src

Adds ./src to the watch list.

watchman -- trigger ./src retest '*.js' -- npm test

Adds a trigger called retest to run npm test every time *.js changes in ./src.

Reference

Watchman Cheat Sheet - Cheat Sheet Maker

React Cheat Sheet

kim — Sun, 19 Jul 2020 15:57:39 +0000

Below are the React Component and Elements Cheat Sheets.
Read full cheat sheet at React Cheat Sheet

1. React Component Lifecycle

Each component in React has a lifecycle that you can monitor and manipulate during its three main phases

React Mounting

constructor(): called before anything else, when the component is initiated, and it is the natural place to set up the initial state and other initial values.

Example:

class Header extends React.Component {
  constructor(props) {
    super(props);
    this.state = {favoritefood: "pizza"};
  }
  render() {
    return (
      <h1>My Favorite Food is {this.state.favoritefood}</h1>
    );
  }
}

ReactDOM.render(<Header />, document.getElementById('root'));

getDerivedStateFromProps(): Called right before rendering the element(s) in the DOM

Example:

class Header extends React.Component {
  constructor(props) {
    super(props);
    this.state = {favoritefood: "pizza"};
  }
  static getDerivedStateFromProps(props, state) {
    return {favoritefood: props.favfood };
  }
  render() {
    return (
      <h1>My Favorite Food is {this.state.favoritefood}</h1>
    );
  }
}

ReactDOM.render(<Header favfood="hotdog"/>, document.getElementById('root'));

render(): required, and is the method that actually outputs HTML to the DOM.

Example

class Header extends React.Component {
  render() {
    return (
      <h1>This is the demo content</h1>
    );
  }
}

ReactDOM.render(<Header />, document.getElementById('root'));

componentDidMount(): called after the component is rendered.

Example

class Header extends React.Component {
  constructor(props) {
    super(props);
    this.state = {favoritefood: "pizza"};
  }
  componentDidMount() {
    setTimeout(() => {
      this.setState({favoritefood: "hotdog"})
    }, 1000)
  }
  render() {
    return (
      <h1>My Favorite Food is {this.state.favoritefood}</h1>
    );
  }
}

ReactDOM.render(<Header />, document.getElementById('root'));

React Updating

getDerivedStateFromProps(): This is the first method that is called when a component gets updated.

Example

class Header extends React.Component {
  constructor(props) {
    super(props);
    this.state = {favoritefood: "pizza"};
  }
  static getDerivedStateFromProps(props, state) {
    return {favoritefood: props.favfood };
  }
  changeFood = () => {
    this.setState({favoritefood: "sushi"});
  }
  render() {
    return (
      <div>
      <h1>My Favorite Food is {this.state.favoritefood}</h1>
      <button type="button" onClick={this.changeFood}>Change food</button>
      </div>
    );
  }
}

ReactDOM.render(<Header favfood="hotdog"/>, document.getElementById('root'));

shouldComponentUpdate(): you can return a Boolean value that specifies whether React should continue with the rendering or not.

Example

class Header extends React.Component {
  constructor(props) {
    super(props);
    this.state = {favoritefood: "pizza"};
  }
  shouldComponentUpdate() {
    return false;
  }
  changeFood = () => {
    this.setState({favoritefood: "sushi"});
  }
  render() {
    return (
      <div>
      <h1>My Favorite Food is {this.state.favoritefood}</h1>
      <button type="button" onClick={this.changeFood}>Change food</button>
      </div>
    );
  }
}

ReactDOM.render(<Header />, document.getElementById('root'));

render(): called when a component gets updated, it has to re-render the HTML to the DOM, with the new changes.

Example

class Header extends React.Component {
  constructor(props) {
    super(props);
    this.state = {favoritefood: "pizza"};
  }
  changeColor = () => {
    this.setState({favoritefood: "sushi"});
  }
  render() {
    return (
      <div>
      <h1>My Favorite Food is {this.state.favoritefood}</h1>
      <button type="button" onClick={this.changeFood}>Change food</button>
      </div>
    );
  }
}

ReactDOM.render(<Header />, document.getElementById('root'));

getSnapshotBeforeUpdate(): you have access to the props and state before the update, meaning that even after the update, you can check what the values were before the update.

Example

class Header extends React.Component {
  constructor(props) {
    super(props);
    this.state = {favoritefood: "pizza"};
  }
  componentDidMount() {
    setTimeout(() => {
      this.setState({favoritefood: "hotdog"})
    }, 1000)
  }
  getSnapshotBeforeUpdate(prevProps, prevState) {
    document.getElementById("div1").innerHTML =
    "When I was young, my favorite food is " + prevState.favoritefood;
  }
  componentDidUpdate() {
    document.getElementById("div2").innerHTML =
    "And now, my favorite food is " + this.state.favoritefood;
  }
  render() {
    return (
      <div>
        <h1>My Favorite Food is {this.state.favoritefood}</h1>
        <div id="div1"></div>
        <div id="div2"></div>
      </div>
    );
  }
}

ReactDOM.render(<Header />, document.getElementById('root'));

componentDidUpdate(): called after the component is updated in the DOM.

Example

class Header extends React.Component {
  constructor(props) {
    super(props);
    this.state = {favoritefood: "pizza"};
  }
  componentDidMount() {
    setTimeout(() => {
      this.setState({favoritefood: "hotdog"})
    }, 1000)
  }
  componentDidUpdate() {
    document.getElementById("mydiv").innerHTML =
    "When I was young, my favorite food is " + this.state.favoritefood;
  }
  render() {
    return (
      <div>
      <h1>My Favorite Food is {this.state.favoritefood}</h1>
      <div id="mydiv"></div>
      </div>
    );
  }
}

ReactDOM.render(<Header />, document.getElementById('root'));

Unmounting

componentWillUnmount(): called when the component is about to be removed from the DOM.

Example

class Container extends React.Component {
  constructor(props) {
    super(props);
    this.state = {show: true};
  }
  delHeader = () => {
    this.setState({show: false});
  }
  render() {
    let myheader;
    if (this.state.show) {
      myheader = <Child />;
    };
    return (
      <div>
      {myheader}
      <button type="button" onClick={this.delHeader}>Delete Header</button>
      </div>
    );
  }
}

class Child extends React.Component {
  componentWillUnmount() {
    alert("The component named Header is about to be unmounted.");
  }
  render() {
    return (
      <h1>Hello World!</h1>
    );
  }
}

ReactDOM.render(<Container />, document.getElementById('root'));

2. React Elements and JSX

JSX produce React Element

const item = <h1>My JSX Element</h1>;

Use curly braces to embed some Javascript

const item = <div>{getContent()}</div>;

Use camelCase for the attribute name

 const item = <div className="example"></div>;

Use curly braces to embed some Javascript

const item = <img src={image.url}></img>;

Self-close if the tag is empty

const item = <div />;

Continue...

PL/SQL Cheat Sheet

kim — Sat, 18 Jul 2020 16:44:24 +0000

Below is PL/SQL - Loops Cheat Sheet:

Basic Loop

LOOP 
   The sequence of statements; 
END LOOP;

WHILE Loop

WHILE condition LOOP 
   sequence_of_statements 
END LOOP;

FOR Loop

FOR counter IN initial_value .. final_value LOOP 
   sequence_of_statements; 
END LOOP;

Nested Loops

Nested basic LOOP

LOOP 
   Sequence of statements1 
   LOOP 
      Sequence of statements2 
   END LOOP; 
END LOOP;

Nested FOR LOOP

FOR counter1 IN initial_value1 .. final_value1 LOOP 
   sequence_of_statements1 
   FOR counter2 IN initial_value2 .. final_value2 LOOP 
      sequence_of_statements2 
   END LOOP; 
END LOOP;

Nested WHILE LOOP

WHILE condition1 LOOP 
   sequence_of_statements1 
   WHILE condition2 LOOP 
      sequence_of_statements2 
   END LOOP; 
END LOOP;

EXIT statement

EXIT;
CONTINUE statement
CONTINUE;

GOTO statement

GOTO label;
..
..
<< label >>
statement;

...
Full cheat sheet is here

Scala Cheat Sheet

kim — Fri, 17 Jul 2020 16:51:57 +0000

Function Declarations

def functionName ([list of parameters]) : [return type]

Function Definitions

def functionName ([list of parameters]) : [return type] = {
   function body
   return [expr]
}

Calling Functions

functionName( list of parameters )

In a second way, a user can also call the function with the help of the instance and dot notation as follows:

[instance].function_name(paramter_list)

Functions Call-by-Name

def callByValue(x: Int)

Nested Functions

def FunctionName1( perameter1, peramete2, ..) = 
{
   def FunctionName2() = 
   {
      // code
   }
}

Partially Applied Functions

val multiply = (a: Int, b: Int, c: Int) => a * b * c

// less arguments passed
val f = multiply(1, 2, _: Int)

Named Arguments

Function Definition : def createArray(length:int, capacity:int);
Function calling : createArray(capacity=20, length:10);

Recursion Functions
Example:

// Scala program of factorial using recursion

// Creating object
object sample
{
   // Function define
   def fact(n:Int): Int=
   {
      if(n == 1) 1
      else n * fact(n - 1)
   }

   // Main method
   def main(args:Array[String])
   {
      println(fact(3))
   }
}

=> Output

Higher-Order Functions
Example:

object Demo {
   def main(args: Array[String]) {
      println( apply( layout, 10) )
   }

   def apply(f: Int => String, v: Int) = f(v)

   def layout[A](x: A) = x.toString()
}

=> Output

Anonymous Functions

(z:Int, y:Int)=> z*y

(_:Int)*(_Int)

Currying Functions

def function name(argument1, argument2) = operation

Read the full cheat sheet at: Scala Cheat Sheet