vhbui02

Differences between innerHTML, innerText and textContent

<p>This element has extra spacing and containes <span>a span element</span>.</p>

• innerHTML: the text content of the element, including spaces and inner HTML tags. Output: This element has extra spacing and contains <span>a span element</span>.

• innerText: the text content of the element and its children, without spaces* and without tags. Output: This element has extra spacing and contains a span element.

vhbui02

Some custom keyword

B (Block)

.td__container: set max-width, padding left right

.td__inner: handle padding top bottom, become an anchor for element that use absolute (e.g. a button)

.td__header: styling the Sub-title

vhbui02

Some most commons emmet:

!: generate HTML template

div Enter, h1 Enter, p Enter, ...

div.wrapper => <div class="wrapper"></div>

h1.header.center => <h1 class="header center"></h1>

vhbui02

Very good articles

https://legacy.reactjs.org/docs/hooks-faq.html#is-it-safe-to-omit-functions-from-the-list-of-dependencies

Build Production Application

• stop the dev server by "ctrl + c"
• run 'npm run build'
• build folder gets created
• use Netlify to host the React website.

Remove these files from /src dir generated by CRA

vhbui02

Exports

Exports by building one property at a time

square.js

exports.area = (width) => {
	return width * width;
}

vhbui02

Adding custom auto-loading function directory

set -Up fish_function_path ~/.dotfiles/fish/functions

Notes: the dir is realpath format, which means NO TRAILING SLASH

Two method to maintain these custom-autoloading function directory

Method 1: funced and funcsave directly to these directory

vhbui02

https://gist.github.com/joshbuchea/6f47e86d2510bce28f8e7f42ae84c716

vhbui02

tee [OPTIONS] [FILE]

Options

-a or --append: append to the given FILEs, DO NOT OVERWRITE

-p: diagnosis errors writing to non pipes.

vhbui02

command [OPTION] <command-name>

Options

-a or --all: prints all COMMAND found in PATH (including program, function and builtit), in the order which they're found.

-q or --query: return true if COMMAND existed, return false otherwise.

-v or -s or --search: prints the path to the program, not the function or builtit.

vhbui02

pwd or pwd -L: if you've used any symbolic links/aliases to navigate to your current working dir, it will print that symbolic links/aliases insteaf of the actual location.

pwd -P: it displays the actual location of the working directory

Example

You're in /home/user/linkeddir, which is a sym link to /home/user/actualdir

• pwd or pwd -L: display /home/user/linkeddir
• pwd -P: display /home/user/actualdir