Reference

Very useful blog:

http://stevelosh.com/blog/2010/02/my-extravagant-zsh-prompt/#username-and-hostname

http://zsh.sourceforge.net/Intro/intro_12.html#SEC12

Variable

%d and %~ can add a number to specify how many previous path will show. Like %1~

Guide to zsh

Here is the link to A User’s Guide to the Z-Shell

single quotes & double quotes

RPROMPT="$(command)"  # this will run command, then set RPROMPT to the result
RPROMPT='$(command)'  # this will set RPROMPT to run command each time it is printed

Date

man Date

Js event loop | Call stack | task queue

This website shows how js running with single thread to handle concurrency

Synchronous & asynchronous

Function run synchronously means code is running as same as your writing.

But in real situation, some code may need time to running but you don’t want all code is block. Therefore, you may need some technique to let this part running asynchronously which means this part of code is block and the rest of code is not.

Author: Dmitri Pavlutin

Reference: https://dmitripavlutin.com/gentle-explanation-of-this-in-javascript/

Concept

• Invocation of a function is executing the code that makes the body of a function, or simply calling the function. For example parseInt function invocation is parseInt('15').
• Context of an invocation is the value of this within function body. For example the invocation of map.set('key', 'value') has the context map.
• Scope of a function is the set of variables, objects, functions accessible within a function body.

Invocations

• function invocation: alert(‘Hello World!’)
• method invocation: console.log(‘Hello World!’)
• constructor invocation: new RegExp(’\d')
• indirect invocation: alert.call(undefined, ‘Hello World!’)

this in different invocations

this is base on the context of calling this function

In same case, you may want to have a different style depend on your state or a variable. Now we can have two ways to achieve that.

classNames

This is a javascript for conditionally joining classNames.

Here is: Github

Basically, you can combine any number of classNames.

const classNames = require('classNames');
classNames('foo', { bar: true, duck: false }, 'baz', { quux: true }); // => 'foo bar baz quux'

ES6 template literals

You can just use template literals.

graphql

Design Graphql is base on what your want

github

https://github.com/TyrangYang/SpaceX_graphql_react

Vscode page for shortcut

Short cut

Source from Traversy Media

YouTube Channel

YouTube

Github

Message passing

echo() ->
    receive
        {From, Msg} -> From ! {Msg}, echo();
        %^pattern^    %^response^   %^keep loop
        stop -> true
        %^pattern^  ^a return value and stop receiving
    end.

The app should Run when you open up your index.html file

The conclusion is add "homepage":".", in package.json.

medium.com/@louis.raymond

Still not work when you have client side router

If you are routing client side, index.html may still not work. In this case, you may using BrowserRouter. Change it to HashRouter.

Click: Different between them

Installation

For mac

sudo brew install redis-server

open redis server

redis-server

test is work or not

redis-cli ping

basic command

ECHO 'hello word

QUIT

SET foo 100

GET foo // 100

SET bar 'hello world'

GET bar // hello world

INCR foo // 101

DECR foo // 100

EXISTS foo // 1

EXISTS foo1 // 0

DEL bar

EXISTS bar // 0

GET bar //(nir)

FLUSHALL // all empty

SET server:name someserver

GET server:name // "someserver"

SET server:port 8000

GET server:port

SET greeting "Hello world"

GET greeting

EXPIRE greeting 50  // set expirations to 50 second

TTL greeting

SETEX greeting 30 "hello world" // set value and expiration

PERSIST greeting // key will not expire

TTL greeting // -1

MSET key1 "hello" key2 "world"

APPEND key1 " world"

RENAME key1 greeting

LPUSH people "Brad" // 1

LPUSH people "Jen" // 2

LPUSH people "Tom" // 3

LRANGE people 0 -1 // return all // Tom Jen Brad

LRANGE people 1 2 // Jen Brad

RPUSH people "Harry"

LRANGE people 0 -1 // Tom Jen Brad Harry

LLEN people // 4

RPOP people // Harry

LPOP people

LINSERT people BEFORE "Brad" "TOM"

LRANGE people 0 -1 // Jen Tom Brad

SADD cars "Ford"

SADD cars "Honda"

SADD cars "BMW"

SISMEMBER cars "Ford" // 1

SISMEMBER cars "Chevy" // 0

SMEMBER cars // Honda BMW Ford

SCARD cars // 3

SMOVE cars mycars "Ford"

SMEMBER cars // Honda BMW

SMEMBER mycars // Ford

SRAM cars "BMW"

SMEMBER cars // Honda

ZADD users 1980 "Brad"

ZADD users 1975 "Jen"

ZADD users 1990 "Mike"

ZADD users 1990 "Kate"

ZRANK users "Mike" // 3

ZRANK users "Jen" // 0

ZRANK users "Brad" // 1

ZRANGE users 0 -1 // Jen Brad Kate Mike

ZINCRBY users 1 "Jen" // 1976

HSET user:brad name "Brad"

HSET user:brad email "brad@gmail.com"

HGET user:brad name

HGET user:brad email

HGETALL user:brad

HMSET user:john name "Jen" email "jen@yahoo.com" age "25"

HGETALL user:john

HKEYS user:john

HVAL user:john

HINCERBY user:john age 1 // 26

HDEL user:john age // 1

HLEN user:john // 2

SAVE

Development setting up for Mac

This guide covers the basics of setting up a development environment on a new Mac.

https://sourabhbajaj.com/mac-setup/

shapeCatcher

Draw a character and find the ASCII code

http://shapecatcher.com/index.html

draw.io

Draw diagram online

https://www.draw.io

regular expression

Good online tool to test and learn regular expression

https://regexr.com

100 front end component design

100 react component design challenge

https://www.florin-pop.com/blog/2019/09/100-days-100-projects/

bootswatch

Several bootstrap scheme.