IDE Like a Pro

ActionVim - CommandVim - Keyboard ShortcutVS Code - Command[^2]1VS Code - Keyboard Shortcut[^3]2GoLand - Action[^5][^5.1]3GoLand4 - Keyboard Shortcut
Undou
Redo<C-r>
➡️ Fold AllFold AllCtrl + K, Ctrl + 0Collapse AllCtrl + K, Ctrl + 0
🔙 Unfold AllUnfold AllCtrl + K, Ctrl + JExpand AllCtrl + K, Ctrl + J
Expand All to Level(Unfold All)1. (Ctrl + K, Ctrl + J)1.1. Expand All to …1. Ctrl + Shift + *
Fold Level 1 (2, 3…)2. Ctrl + K, Ctrl + 1 (2, 3…)1.2. … Level2. 1 (2, 3…)
2. Expand All to LevelAssigned to Ctrl + Shift + *
➡️ Shrink SelectionVisual mode: <S-v>Shrink Selection5Alt + Shift + LeftArrowShrink SelectionCtrl + Shift + W (default)
🔙 Expand SelectionVisual mode: vExpand SelectionAlt + Shift + RightArrowExtend SelectionAlt + Shift + Right
Assigned to Alt + Shift + LeftArrow
➡️ Move Line DownMove Line DownAlt + DownArrowMove Line DownAlt + DownArrow
🔙 Move Line UpMove Line6 UpAlt + UpArrowMove Line UpAlt + UpArrow
➡️ Copy Line Downyy pCopy Line DownAlt + Shift + DownArrowDuplicate LineAlt + Shift + DownArrow
🔙 Copy Line Upyy PCopy Line7 UpAlt + Shift + UpArrow8NA
Delete Current Linedd
➡️ Add Cursor BelowAdd Cursor BelowCtrl + Shift + DownArrow2. UpArrow / DownArrow
🔙 Add Cursor AboveAdd Cursor AboveCtrl + Shift + UpArrowAdd multiple carets on double Ctrl with arrow keys1. Ctrl Ctrl (hold alter second press)
Cursor UndoCursor UndoCtrl + U
➡️ Right with SelectionNARight with SelectionShift + RightArrow
🔙 Left with SelectionNALeft with SelectionShift + LeftArrow
➡️ Down with SelectionNADown with SelectionShift + DownArrow
🔙 Up with SelectionNAUp with SelectionShift + UpArrow
Column Selection<C-v>Toggle Column Selection ModeAssigned to Alt + Shift + InsertColumn Selection ModeAlt + Shift + Insert
Line SelectionVExpand Line SelectionCtrl + LExtend Line SelectionReassigned to Ctrl + L
Format Code<Leader> fmFormat DocumentAlt + Shift + FReformat CodeAlt + Shift + F
➡️ Close TabBuffer close<Leader> xClose EditorCtrl + WClose TabCtrl + W
🔙 Reopen Closed TabReopen Closed EditorCtrl + Shift + TReopen Closed TabCtrl + Shift + T
Toggle Terminal<M-h> (Horizon)
<M-i> (Float)
<M-v> (Vertical)
Toggle TerminalCtrl + ` TerminalCtrl + ` or Ctrl + Tab, T
➡️ Show Explorer<C-N> (Focus)Show ExplorerCtrl + Shift + EProject ViewCtrl + Shift + E or Ctrl + Tab, 1
🔙 Hide Explorer<Leader> + e (Toggle)Toggle Primary SidebarCtrl + BProject ViewCtrl + Shift + E
Command PaletteShow All CommandsCtrl + Shift + PFind ActionsCtrl + Shift + P
Markdown: Open PreviewMarkdown: Open PreviewCtrl + Shift + VPreviewCtrl + Shift + V
Markdown: Open Preview to the SideMarkdown: Open Preview to the SideCtrl K, Ctrl + VEditor and PreviewCtrl K, Ctrl + V
Reveal in Explorer ViewReveal in Explorer ViewAssigned to Ctrl + K, ESelect Opened FileCtrl + K, E
Structure (of current file)Focus on Outline ViewAssigned to Alt + 79StructureAlt + 7 or Ctrl +Tab, 7
➡️ Switch to Next Tab<Tab>Ctrl + Tab
🔙 Switch to Previous Tab<S-Tab>Ctrl + Shift + Tab
Search Files<Leader> ffGo to Files…Ctrl + PGo to Files…Ctrl + P
Toggle Line Comment<Leader> /Toggle Line CommentCtrl + /
Open in TerminalOpen in Integrated TerminalAssigned to Ctrl + K, Ctrl + ` Open in TerminalAssigned to Ctrl + K, Ctrl + `
Open Keyboard ShortcutsPreferences: Open Keyboard ShortcutsCtrl + K, Ctrl + SKeymap / Configure Keymap…Assigned to Ctrl + K, Ctrl + S
➡️ Go To Next ProblemGo To Next ProblemF8Next Highlighted ErrorAssigned to F8
🔙 Go To Previous ProblemGo To Previous ProblemShift + F8Previous Highlighted ErrorShift + F8
BackGo BackAssigned to Alt + LeftArrowBackAlt + LeftArrow
ForwardGo ForwardAssigned to Alt + RightArrowForwardAlt + RightArrow
Context Actions~ Source ActionsCtrl + .Context ActionsCtrl + .
RefactorRefactorAssigned to Ctrl + Alt + R (to match with other refactor actions)
Introduce VariableCtrl + Alt + V
Introduce ConstantCtrl + Alt + C
Extract MethodCtrl + Alt + M
Go ToGo ToAssigned to Ctrl + K, Ctrl + G
Go To DeclarationGo To DefinitionCtrl + Click + or F12Go To DeclarationCtrl + Click or F12
Go To Type DeclarationGo To Type DefinitionGo To Type DeclarationCtrl + Shift + Click or Ctrl + F12
Implement InterfaceGo: Generate Interface StubsImplement Interface0. Move the cursor to the type
(Workaround with Quick Fixes)10e.g. var _ MyInterface = (*MyType)(nil)1. Ctrl + . (Source Actions)
Cursor Top (First line)First Linegg or <C-Home>Cursor TopCtrl + Home2. Implement Interface... (Assigned to Ctrl + Alt + I)
Cursor Bottom (Last line)Last LineG or <C-End>Cursor BottomCtrl + End
Cursor Home (Beginning of line)^ or HomeCursor HomeHome
Cursor End (End of line)$ or EndCursor EndEnd
CopyYank/Copyy (The cursor will move to the start of selected area)
PastePaste after cursor(Move the cursor to end of word/line…) - p
Switch ProfileProfiles: Switch Profile…Change to Ctrl + Shift + M (to match with browsers)
ActionMost appsVim - Keyboard Shortcut
Move cursor backward (1 character)<Left>h
Move cursor forward (1 character)<Right>l
Move cursor down (1 line)<Down>j
Move cursor up (1 line)<Up>k
Move cursor down (1 page)<PageDown><S-Down> or <C-f>
Move cursor up (1 page)<PageUp><S-Up>or <C-b>
Move cursor to beginning of line<Home>
Move cursor to end of line<End>
Move cursor to first line<C-Home>
Move cursor to last line<C-End>

nvim

Vim modes

Vim provides a modal user interface, which means that the result of pressing any key on the keyboard may differ depending on which mode is active at the time.

Vim has 4 main modes:

  • Normal mode
  • Insert mode
  • Visual modes
  • Command-line mode

Vim commands and Vim notation

  • In Normal mode, a Vim command is composed by pressing one or more keystrokes in sequence.

    NotationMeaning
    xPress x once
    dwPress d, then w (in sequence)
    dapPress d, a, then p (in sequence)
  • A keystroke can be composed of:

    • one key on the keyboard, e.g. c, m, s

      • Some key has special names:

        NotationMeaningNote
        <Esc>Press the Escape key
        <CR>Press the carriage return keyaka <Enter>
        <Ctrl>Press the Control key
        <Tab>Press the Tab key
        <Shift>Press the Shift key
        <Up>Press the up arrow key
        <Down>Press the down arrow key
        Press the space bar

        For the full list of keys and its notations, use :help key-notation

    • multiple keys on the keyboard (by pressing all at the same time). e.g. Ctrl and n

    [!NOTE] Vim uses <> notation to make clear of a keystroke.

    Vim Notation (for a keystroke)MeaningKeyboard KeyAlternative Notation
    cc
    m, am, a
    ss
    <C-…>control-keyCtrl^
    <M-…>, <A-…>alt-key or meta-keyAlt^[
    <S-…>shift-keyShiftUse an uppercase letter, e.g. V equivalent to <S-v>
    <Leader>vim uses <Leader> key as a namespace for our own user-defined commandsSpace (Typically)
  • Combine both of facts that:

    • a Vim command is composed of one or more keystrokes
    • a keystroke can be a single or multiple key pressing

    a notation can be a little complicated:

    Notation (for multiple keystrokes)First KeystrokeSecond Keystroke
    <C-n>Press <Ctrl> and n (at the same time)
    g<C-]>Press gPress <Ctrl> and ] (at the same time)
    <C-r>0Press <Ctrl> and r (at the same time)Press 0
    <C-w><C-=>Press <Ctrl> and w (at the same time)Press <Ctrl> and = (at the same time)

Switch between Vim modes:

ModePurposeHow to switch to?Note
Normal modeVim’s default modeFrom other modes: press EscThis is where all the magic happens.
Insert mode~ Text EditorFrom normal mode, press i, a or o:There are also <S-i>, <S-a> and <S-o>:
- i: Insert (before cursor).- <S-i>: Insert at the beginning of the line.
- a: Append (after cursor).- <S-a>: Append at the end of the line.
- o: Add newline (after current line) then insert (on newline)- <S-o>: Add newline (before current line), then insert (on newline).
Visual modesText selectionFrom
- v: Character-wise Visual mode
- <S-v>: Line-wise Visual mode
- <C-v>: Block-wise Visual mode
Command-line modeRun any Vim commandFrom press :
4

GoLand keymap has changed to a custom one based on VS Code

11

VS Code commands can be invoked with Command Palette (Ctrl + Shift + P)

12

VS Code Keyboard Shortcut is aka keybinding

13

GoLand actions can be invoked in Search Everywhere / Actions

3

Actions tab of Search Everywhere can be accessed directly with Ctrl + Shift + P

8

The commands Copy Line Up/Down are unbound on Linux because the VS Code default keybindings would conflict with Ubuntu keybindings

9

Override VS Code workbench.action.openEditorAtIndex7

Awesome playgrounds 🛝

NameWhat to play?Notes
Python TutorPython, Java, C, C++, JavaScriptVisual Debugger, AI Tutor
LoupeJavaScript’s call stack, event loop, callback queueVisualizing the javascript runtime at runtime
JavaScript Visualizer 9000JavaScript’s call stack, event loop, task queue, micro-task queueInspired by Loupe
float.exposedFloating numbersSee Exposing Floating Point
Play with DockerDocker, Docker SwarmThere are labs, quizzes from beginner to advanced level 1
KillercodaKubernetes, …May support a lot of tools with your help
TypeScript PlaygroundTypeScript
tailwindPLAYTailwind CSS
codapiLanguages (Python, Go, C), databases, network (OpenAPI, curl, caddy), tools (git, grep, ripgrep)…Using interactive code snippets to document and explain things
jqkungfujqBuilt with WebAssembly
sandbox.bioTerminal, jq, awk, grep, sedAlso has tutorials for jq, awk…
Shipmight’s Helm PlaygroundHelmSupport only 1 template
Paul Vollmer’s Helm PlaygroundHelmSupport multiple templates
TIO - Try it online 2260 practical programming language and 420 recreational programming language (e.g. Braille)
iximiuz LabDevOps Playgrounds: Linux, Docker, Kubernetes…

Playgrounds for Golang

NameWhat to play?Notes
Go PlaygroundGo
Tour of GoAn interactive introduction to Go
Go by ExampleHands-on introduction to Go using annotated example programs (link back to Go Playground)
Play with GoA series of hands-on, interactive, browser-based guides that introduce the tools required to work with the Go programming language.
Ardan Lab’s Ultimate Go TourFor anyone who wants a jump start in learning Go or who wants a more thorough understanding of the language and its internals.

Wizard Zines/Julia Evans’s playgrounds

NameWhat to play?Notes
memory spyRun programs and spy on their memory!
mess with dnsExperiment with setting up DNS records!
DNS lookupsMake DNS queries without using the command line!
nginx playgroundTest nginx configurations instantly!
sql playgroundRun SQL queries on a simple test dataset!

Playgrounds for JavaScript Toolchain3

NameWhat to play?Notes
Prettier PlaygroundJavaScript formatterOpinionated Code Formatter
ESLint PlaygroundJavaScript linterFind and fix problems in your JavaScript code
Babel PlaygroundJavaScript compilerUse next generation JavaScript, today.
Biome PlaygroundFormat, lint, and more
Oxc PlaygroundThe JavaScript Oxidation Compiler (Oxc) is a collection of high-performance tools for the JavaScript language written in Rust.
Parcel PlaygroundWeb bundlerThe zero configuration build tool for the web
HTML to JSX, SVG to JSXJSX
SVGOMGSVGO
postcss-preset-env PlaygroundPostCSS plugins
Lightning CSS PlaygroundCSS parser, transformer, bundler, minifier

Playground for Frontend Frameworks

NameWhat to play?Notes
SvelteJS REPLSvelteJSOfficial
SolidJS PlaygroundSolidJSOfficial
VueJS PlaygroundVueJSOfficial
React PlaygroundReact

DX Playgounds

NameWhat to play?Notes
CodingFont PlaygroundChoose your favorite font for coding
VS Code ThemesChoose your favorite VS Code theme
Theme Studio for VS CodeCreate Your Own VS Code Themes

Amazon AI Ready commitment

Amazon aims to provide free AI skills training to 2 million people by 2025 with its new ‘AI Ready’ commitment 1

Courses for business and nontechnical audiences

  • Introduction to Generative Artificial Intelligence provides an introduction to generative AI, its applications, and need-to-know concepts, like foundation models. Find it on AWS Educate.

    • Course Duration: 0.75h
  • Generative AI Learning Plan for Decision Makers is a three-course series covering how to plan a generative AI project and build a generative AI–ready organization. Find it on AWS Skill Builder.

  • Introduction to Amazon CodeWhisperer teaches participants how to use Amazon’s AI code generator, which produces whole lines of code. Find it on AWS Educate.

    • Course Duration: 0.75h

Foundations of Prompt Engineering

The Foundations of Prompt Engineering course is available at AWS Skill builder

Prerequisites

We recommend that attendees of this course have taken the following courses:

  • Introduction to Generative AI - Art of the Possible (1 hour) - Course link

  • Planning a Generative AI Project (1 hour) - Course link

  • Amazon Bedrock Getting Started (1 hour) - Course link

Browsers - Tips

Keyboard Shortcuts

BrowsersEdgeChromeFirefox Developer Edition
Search TabsCtrl + Shift + ACtrl + Shift + Tab (Show All Tabs / Search Tabs)
Focus on Address BarCtrl + L, Alt + D, F4Same as Edge, F6
Refresh Page (Normal Refresh)Ctrl + RSame as Edge
Settings (Hamburger)Alt + F
Clear browsing dataCtrl + Shift + DeleteSame as Edge
Browser task managerShift + EscSame as Edge
ScreenshotCtrl + Shift + SSame as Edge
Toggle favorites barCtrl + Shift + BSame as Edge
Open search in sidebarCtrl + Shift + ENA
Reorders tabs within the browserCtrl + Shift + PgDn/PgUpSame as Edge
Switch ProfileCtrl + Shift + MCtrl + Shift + MFirefox doesn’t support profile, instead it use Container Tab
Open Developer ToolsCtrl + Shift + I, F12Same as Edge
Refresh Page, ignore cache (Hard Refresh)Ctrl + Shift + RSame as Edge
Inspect ElementCtrl + Shift + C
Web ConsoleCtrl + Shift + K
Network MonitorCtrl + Shift + E
Browser Task ManagerShift + EscSame as Edge

See:

Hidden Settings

BrowsersEdgeChromeFirefox Developer Edition
about:about (Mother of about)
Advance Preferenceabout:config
Browser Task Managerabout:processes

Managing dotfiles with chezmoi - TODO

What is chezmoi?

How to use chezmoi?

A collection of useful tools for CLI

Terminal

Alacritty

  • Config

    Alacritty looks for configuration files in:

    $XDG_CONFIG_HOME/alacritty/alacritty.toml
    $XDG_CONFIG_HOME/alacritty.toml
    $HOME/.config/alacritty/alacritty.toml # Recommended
    $HOME/.alacritty.toml
    

Warp

Kitty

  • Install (Linux/Mac)

    curl -L https://sw.kovidgoyal.net/kitty/installer.sh | sh /dev/stdin
    

    kitty will be install to

    • /Applications/kitty.app on Mac
    • ~/.local/kitty.app on Linux
  • Add icon for kitty to taskbar on Linux

    # Create symbolic links to add kitty and kitten to PATH (assuming ~/.local/bin is in your system-wide PATH)
    ln -sf ~/.local/kitty.app/bin/kitty ~/.local/kitty.app/bin/kitten ~/.local/bin/
    
    # Place the kitty.desktop file somewhere it can be found by the OS
    cp ~/.local/kitty.app/share/applications/kitty.desktop ~/.local/share/applications/
    
    # If you want to open text files and images in kitty via your file manager also add the kitty-open.desktop file
    cp ~/.local/kitty.app/share/applications/kitty-open.desktop ~/.local/share/applications/
    
    # Update the paths to the kitty and its icon in the kitty desktop file(s)
    sed -i "s|Icon=kitty|Icon=/home/$USER/.local/kitty.app/share/icons/hicolor/256x256/apps/kitty.png|g" ~/.local/share/applications/kitty*.desktop
    sed -i "s|Exec=kitty|Exec=/home/$USER/.local/kitty.app/bin/kitty|g" ~/.local/share/applications/kitty*.desktop
    
  • Change default icon to kitty-icon dark

    # Fedora
    curl https://raw.githubusercontent.com/DinkDonk/kitty-icon/main/kitty-dark.png -o ~/.local/kitty.app/share/icons/hicolor/256x256/apps/kitty.png
    gtk-update-icon-cache -f -t ~/.local/kitty.app/share/icons/hicolor
    

    For more information, see Install kitty

  • Shortcuts

    ActionKeyboard Shortcut
    Create a new tabCtrl + Shift + T
    Create a new windowCtrl + Shift + Enter
    Change layoutCtrl + Shift + L
    Close windowCtrl + Shift + W
    Next windowctrl + shift + ]
    Previous windowctrl + shift + [

    For more information, see:

Shell

bash

zsh

oh-my-zsh: Framework for Zsh, comes with plugins, themes, functions, helpers

Antidote: zsh plugin manager (successor of Antibody - successor of Antigen) - Cure to slow zsh loading time

Completion, suggestions & syntax highlight for zsh

fish

Shell Plugins

argc-completions

Argc-completions: Completions for any shell. Supports 1000+ commands. Automatically generate completion definition from help text and man page.

fzf: A command-line fuzzy finder

fzf

  • Key bindings for command-line1:
    • CTRL-T - Get a list of files and directories
    • CTRL-R - Get a list of command history
    • ALT-C - Get a list of directories
  • Fuzzy Complete for files/directories2:
    • **<TAB>: COMMAND [DIRECTORY/][FUZZY_PATTERN]**<TAB>

Shell Prompt

Starship: Cross-shell Prompt

See Starship

CLI tools

File navigate

broot3: A better way to navigate directories 🌟🌟🌟

broot

broot can replace a lot of CLI tools (e.g. ls, cd, tree, df, find…)

Data process

sed, awk, grep

jq4: The original JSON processor 🌟🌟

jq clones:

  • jaq5: Rust clone
  • gojq6: Go clone

yq7: YAML (JSON, XML, CSV, TOML, …) processor 🌟🌟

xq8: XML, HTML processor

fx9: Interactive JSON/YAML viewer & processor 🌟🌟🌟

fx

CLI - Tips & Tricks

PATH

# For bash, zsh
echo $PATH | sed 's/:/\n/g'
# For fish
echo $PATH | sed 's//\n/g'
# Output
/home/admin/.local/bin # The shell checks this directory first
/home/admin/bin
/usr/local/bin
/usr/local/sbin
/usr/bin
/usr/sbin

Command history

What is command history

(Almost) everything you type to the terminal is saved.

Where is the command history

The command history is stored at $HISTFILE, which by default:

  • For bash, it’s ~/.bash_history,
  • For zsh, it’s ~/..zsh_history,
  • For fish, its’s ~/.local/share/fish/fish_history

How to use command history

  • Access last command:

    • Press Arrow Up
    • Press Arrow Up more for last of last command
  • Search for a command is the command history: Ctrl + R

    For a default bash, zsh prompt, it looks like this

    (reverse-i-search)`’:
    
  • Use atuin1 for a magical 🪄 shell history, which:

    • records additional context for your commands
    • synchronizes your history between machines/shells

Command completion

  • Use Warp2 terminal
  • Use fish3 shell
  • Use argc-completions4

How to know how to use a command?

  • Use --help, -h, help flag/option/sub-command

    • Some commands support --help

      uname --help
      
      uname -h # Does't work
      
    • Some commands support -h

      dig -h
      
      dig --help # Doesn't work
      
    • Some commands support both --help, -h and even have a sub-command named help

      go help
      
      go -h
      
      go --help
      
    • Some commands don’t support --help or -h, and don’t have a help sub-command either, e.g. ssh, ssh-keygen

      $ ssh -h
      unknown option -- h
      
      $ ssh --help
      unknown option -- -
      
      $ ssh help
      ssh: Could not resolve hostname help: Name or service not known
      
  • Access the command’s manual pages

    man uname
    
  • Use tldr5, cheat6

    tldr uname
    
    cheat uname
    
1

https://github.com/atuinsh/atuin

4

https://github.com/sigoden/argc-completions

2

https://www.warp.dev/

3

https://fishshell.com/

5

https://github.com/tldr-pages/tldr

6

https://github.com/cheat/cheat

Developing inside containers

distrobox

distrobox1: Use any linux distribution inside your terminal

distrobox

toolbox

toolbox2 is a tool for Linux operating systems, which allows the use of containerized command line environments

This is usedful for OSTree based operating systems like Fedora CoreOS and Silverblue. The intention of these systems is to discourage installation of software on the host, and instead install software as (or in) containers

Toolbox solves these problem by providing a fully mutable container within which one can install their favorite development and debugging tools, editors and SDKs.

devcontainers

development container (dev container) : a dev container allows you to use a container as a full-featured development environment

dev container vs production container

devcontainers spec : An open specification for enriching containers with development specific content and settings.

Tools and services support the Development Container Specification

Editors

  • VS Code & its Dev Containers extension3 VS Code - Dev Container
  • JetBrain’s IDE: IntelliJ, Goland4

Tools

  • Jetpack.io5 devbox6: Instant, easy, and predictable development environments (Nix-based, no container while developing)
  • cachix devenv7: Fast, Declarative, Reproducible, and Composable Developer Environments using Nix

Services

  • GitHub Codespaces

    GitHub Codespaces

  • CodeSandbox8

  • DevPod9: Codespaces but open-source, client-only and un-opinionated: Works with any IDE and lets you use any cloud, kubernetes or just localhost docker.

    DevPod Demo

Developer tools for Backend

CLI tools

httpie

HTTPie CLI1: modern, user-friendly command-line HTTP client for the API era. JSON support, colors, sessions, downloads, plugins & more.

httpie demo

hey

[hey]2: HTTP load generator, ApacheBench (ab) replacement

oha

[oha]3: HTTP load generator, inspired by rakyll/hey with tui animation.

oha demo

1

https://github.com/httpie/cli

2

https://github.com/rakyll/hey

3

https://github.com/hatoo/oha

Developer tools for Frontend

Browser extensions

  • CSS Stacking Context inspector1
  • React Developer Tools2
  • React Context DevTool3
  • Redux DevTools4
  • VisBug5: Firebug for designers

Desktop Applications

  • Polypane6: The browser for ambitious web developers.
  • Responsively7: Open-source DevTool for all web developers.

DevOps tools

Web app

CLI

1

dnsperf is available as a CLI app2 that test the performance of a DNS server.

2

https://github.com/DNS-OARC/dnsperf

Docker FAQ

RUN, CMD, ENTRYPOINT

InstructionRUNCMDENTRYPOINT
SummaryExecute “build commands”.Specify default commands.Specify default executable.
DescriptionRUN executes any commands to create a new layer on top of current imageCMD sets the command to be executed when running a container from image.An ENTRYPOINT allows you to configure a container that will run as an executable.
ExampleRUN apt-get update && apt-get install -y neofetch
Notes- The main purpose of a CMD is to provide (default command) and its parameters for an executing container.1
- CMD can also be used to only provide default parameters for the ENTRYPOINT instruction. 2- Command line arguments to docker run <image> will be appended after all elements in an exec form ENTRYPOINT, and will override all elements specified using CMD.
- You can override the ENTRYPOINT instruction using the docker run --entrypoint flag.
Provide defaults (executable and/or parameters) for an executing containerThe container’s main executable.

Example:

  • A simple Dockerfile use RUN to install neofetch and add a layer

    FROM ubuntu:latest
    
    RUN apt-get update && apt-get install -y neofetch
    
  • MySQL’s Official Dockerfile

    FROM debian-slim:latest
    # ...
    ENTRYPOINT ["docker-entrypoint.sh"]
    # ...
    CMD ["mysqld"]
    
  • Nginx’s Official Dockerfile

    FROM debian:bookworm-slim
    # ...
    ENTRYPOINT ["/docker-entrypoint.sh"]
    # ...
    CMD ["nginx", "-g", "daemon off;"]
    

Exec form vs shell form

Exec formShell form
SyntaxCMD [ "executable" , "param1" , "param2" ]RUN executable param1 param2
ExampleCMD [ "nginx" , "-g", "daemon off;" ]RUN apt-get update && apt-get install -y neofetch
Advantages- Avoid shell string mungingMore relaxed, and emphasizes ease of use, flexibility, and readability
- Invoke commands using a specific command shell, or any other executable3- Long commands can be split up into multiple lines4
DisadvantagesThere is no automatically5 using of a command shell:There is an automatically using of a command shell6 (the default shell7).
- There is no shell processing, e.g. variable substitution8
- The backslashes need to be escaped9
How is it parsed?As a JSON array10As a regular string4

For more information, see exec and shell form | Docker

1

CMD [ "executable" , "param1" , "param2" ] (exec form)

2

CMD [ "param1" , "param2" ] (exec form, as default parameters to ENTRYPOINT)

10

You must use double-quotes (") around words, not single-quotes ('). e.g. ENTRYPOINT ["/bin/bash", "-c", "echo hello"]

8

RUN [ "echo", "$HOME" ] won’t handle variable substitution for $HOME, but

3

You can invoke the command with any shell you want, but you need to do it for every command in the exec form.

5

You can execute a shell directly with the exec form, for example: RUN [ "sh", "-c", "echo $HOME" ]

9

On a Windows machine: RUN ["c:\\windows\\system32\\tasklist.exe"]

4

For example, RUN source $HOME/.bashrc && echo $HOME can be split into multiple lines

6

You can override the default shell used for the shell form of command by using SHELL instruction

For example:

# Change the default shell to bash
SHELL ["/bin/bash", "-c"]
7

The default shell used for the shell form of command:

  • On Linux: ["/bin/sh", "-c"]
  • On Windows: ["cmd", "/S", "/C"]

A guide to write documentations as code

The tools

VSCode

Why VS Code?

VSCode’s extensions

  • markdownlint: A Node.js style checker and lint tool for Markdown
  • vale: Brings code-like linting to prose.
  • Markdown Footnote: [^1] footnote syntax support to VS Code’s Markdown editor and preview

VS Code snippets

  • Alert snippets:

    Configuration
    • Open Command Palette : Cmd + Shift + P

    • Search for “snippets” and select Configure User Snippets

    • Choose in the list : markdown.json (Markdown)

    • Adds this to your configuration object :

      "🟦 Useful information that users should know, even when skimming content." : {
        "prefix": "md:note",
        "body": [
          "> [!NOTE]",
          "> $1"
        ],
        "description": "Useful information that users should know, even when skimming content."
      },
      "🟩 Helpful advice for doing things better or more easily." : {
        "prefix": "md:tip",
        "body": [
          "> [!TIP]",
          "> $1"
        ],
        "description": "Helpful advice for doing things better or more easily."
      },
      "🟪 Key information users need to know to achieve their goal." : {
        "prefix": "md:important",
        "body": [
          "> [!IMPORTANT]",
          "> $1"
        ],
        "description": "Key information users need to know to achieve their goal."
      },
      "🟧 Urgent info that needs immediate user attention to avoid problems." : {
        "prefix": "md:warning",
        "body": [
          "> [!WARNING]",
          "> $1",
        ],
        "description": "Urgent info that needs immediate user attention to avoid problems."
      },
      "🟥 Advises about risks or negative outcomes of certain actions." : {
        "prefix": "md:caution",
        "body": [
          "> [!CAUTION]",
          "> $1"
        ],
        "description": "Advises about risks or negative outcomes of certain actions."
      }
      

    (Source)

  • Collapse section:

    • Snippet:

      "md:collapsed-section": {
       "prefix": "md:collapsed-section",
       "body": [
        "<details>",
        "<summary>$1</summary>",
        "</details>",
       ],
       "description": "Creates a collapsed section with the <details> tag"
      }
      
    • Shortcut: add to keybindings.json:

      {
        "key": "alt+c",
        "command": "editor.action.insertSnippet",
        "when": "editorLangId == 'markdown'",
        "args": {
          "snippet": "<details>\n<summary>$0</summary>\n\n$TM_SELECTED_TEXT\n</details>"
        }
      }
      

      (Source)

Don’t read the docs (of an CLI tool) without trying

Tools

tldr

tldr-pages1: Simplified and community-driven man pages

alt text

tldr-pages for a CLI tool can be available for many platforms, e.g. common, linux, osx, windows, …

tldr-pages can be accessed in a lot of ways2:

tldr (tl;dr) : short for too long; didn't read (also occasionally don't read) : (internet slang) used to introduce a summary of an online post or news article4

cheat

cheat5: cheatsheats for *nix commands that are used frequently, but not frequently enough to be remembered

cheat demo

xny

xny6: A way to use Learn X in Y Minutes on the command line.

Terminal/shell completion feature

Warp’s completion

warp completion

zsh completion

zsh completion

zsh completion with fuzzy search zsh completion with fuzzy search

fish completion

fish completion

The new terminal of JetBrain’s IDEs (e.g. GoLand)

New Terminal of

For more information, see its Introduce Blog

Fedora - Caches

Desktop applications cache

update-desktop-database ~/.local/share/applications # User-level

update-desktop-database /usr/share/applications     # OS-level

Icon cache

gtk-update-icon-cache

Font cache

fc-cache -f # Generate font cache files

fc-cache -r # Erase olf font cache files, then generate new font cache files

Fedora - Change default apps

When you open a file with a file manager, the file manager needs to

  • detect the filetype:

    • via the filename: by lookup the table
    • via the file signature: with map the file signature’s Magic Bytes1 to ta MIME type
  • choose the right application for that file.

Open file from CLI

In the CLI, to open a file, you:

  • decide the application before the file; then invoke that specific application with the file path as an argument.
  • only needs to decide which file to open; then let another application open that file in your preferred application.
xdg-utils (Default in Linux: Fedora, Ubuntu)handlr
Open a file or URL in the user’s preferred application.xdg-openhandlr open
Query & manage MIME typesxdg-mimeshandlr list/set/unset
update-mime-database
1

Magic Bytes is a a type of acceptable magic number

Open terminal from Fedora Files (nautilus)

The default terminal is Fedora is gnome-terminal, for now you can’t change it.

XDG - freedesktop

XDG - Cross-Desktop Group - the brand of specifications2 published by freedesktop.org for interoperability between desktops.

Some of the widely-used specifications:

  • Desktop base directories (basedir): how desktops should locate files, such as config files or application data files.
  • Desktop entries (.desktop): files describing information about an application such as the name, icon, and description

For more information, see

2

https://www.freedesktop.org/wiki/Specifications/

Fedora - Setup Development Environment - WIP

#!/bin/bash

# Install git
sudo dnf install git -y

# Install brew
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
# Setup brew
(echo; echo 'eval "$(which brew) shellenv"') >> $HOME/.zshrc
eval "$(/home/linuxbrew/.linuxbrew/bin/brew shellenv)"

Hardware video acceleration on Fedora

Browsers

Firefox

Apps

mpv

Add

hwdec=auto

to ~/.config/mpv/mpv.conf

VLC

Use the VLC - Flatpak version from flathub, there’s a problem with vlc - rpm package - from Fedora main repositories1.

  • Install

    flatpak remote-modify --enable flathub
    flatpak install flathub org.videolan.VLC
    
  • Config

    Tools / Preferences / Input & Codecs / Codecs / Hardware-accelerated decoding / VA-API video decoder

    [!TIP] If VA-API video decoder doesn’t work, try VA-API video decoder with DRM.

gitignore

A gitignore file specifies intentionally untracked files that Git should ignore.

note

Files already tracked by Git aren’t affected.

To stop tracking a file that’s currently tracked, use git rm --cached to remove the file from the index.

The way git decide which files to ignore

Each line in a gitignore file specifies a pattern.

Git normally checks gitignore patterns from multiple sources:

  1. From the file specified by the configuration variable core.excludesFile in the user’s ~/.gitconfig.

    core.excludesFile:

    • Default value is $XDG_CONFIG_HOME/git/ignore 1.
    • If $XDG_CONFIG_HOME is either not set or empty, $HOME/.config/git/ignore(aka~/.config/git/ignore) is used instead.
  2. From $GIT_DIR/info/exclude.

  3. From a .gitignore file:

    • in the top-level
    • in any sub-directory

    of the git working tree.

  4. From the command line for those commands that support them.

important

The source list is in order of precedence from lowest to highest.

Within one level of precedence, the last matching pattern decides the outcome.

note

The $XDG_CONFIG_HOME defines the base directory relative to which user-specific configuration files should be stored. If $XDG_CONFIG_HOME is either not set or empty, a default equal to $HOME/.config should be used.

For more information, see

note

The patterns (in the .gitignore file in the working tree) match relative to the location of the .gitignore file.

For other sources, the patterns match relative to the top-level of the working tree.

Navigate with keyboard - Tips & Tricks

Move the cursor one character

  • Move backward 1 character: Left
  • Move forward 1 character: Right

Move the cursor one word

  • Move backward 1 word:
    • Almost anywhere: Ctrl + Left
  • Move forward 1 word:
    • Almost anywhere: Ctrl + Right

Delete one character

  • Delete one character before the cursor: Backspace
  • Delete one character after the cursor: Delete

Delete one word

  • Delete one word before the cursor:
    • GUI: Ctrl + Backspace
    • CLI: Ctrl + W, Alt + Backspace
  • Delete one word after the cursor:
    • GUI: Highlight the word with Ctrl + Shift + Right - Backspace
    • CLI: Alt + D

Undo

  • GUI app: Ctrl + Z
  • CLI: Ctrl + Shift + -

Keyboard Shortcuts

Gnome

https://help.gnome.org/users/gnome-help/stable/shell-keyboard-shortcuts.html.en https://help.gnome.org/users/gnome-help/stable/keyboard-nav.html.en

ActionKeyboard ShortcutsNote
Move a window1Alt + F71. Use the arrow keys to move or resize, then press Enter to finish, or press Esc to return to the original position and size.
Resize a window1Alt + F82. Hold down Shift while moving/resizing to snap the window to the edges of the screen and other windows.

Evince

Evince2 is the default document viewer of Fedora (and any Linux distro that uses Gnome)

ActionKeyboard ShortcutsNote
Toggle SidebarF9
Toggle Primary MenuF10
Toggle full-screenF11
Automatic ZoomA
Fit PageF
Fit WidthW
Zoom 1:1Ctrl + 0
Toggle Continuous ScrollingC
Toggle Night ModeCtrl + L
Keyboard ShortcutsCtrl + Shift + ?

Kubernetes - Tools, Tips & Tricks

k9s

k9s: ../Kubernetes CLI To Manage Your Clusters In Style!

k9s demo

Usage

When first opened, k9s show the list of pods.

From the Pods view, you can:

  • Change the selected pod (Up, Down),

    • then doing actions with that selected pod (by pressing the key bindings in blue color), e.g.
      • Describe that pod, by pressing d
      • Logs, show logs of all containers of that pod, by pressing l
      • View that selected pod, by pressing Enter
  • Change the namespace (by pressing the key bindings in pink color)

    • to all by pressing 0
    • to default by pressing 1 (by default, k9s use default namespace)
  • Change to another list (resource)

    • List all the resources, by pressing Ctrl +A
    • Change to the view for that resource, by pressing Enter

    for example: change back to the default view - Pods

    • Ctrl + A
      • Downs to select pods (the 2nd one)
      • Enter
    • Press : to enter command mode
      • Type in the command for pod: pod (or any of po,pod,pods,v1/pods - showed in Ctrl + A)
ActionKey BindingCommandNote
Change the selected resourceUp - Down
View (the selected resource)EnterAvailable for any selected resource
BackEsc
Quit K9sCtrl + C
Help?Available at any view, change depend on which view is showing
Show all available resource aliasCtrl + A1. Up/Down; 2. Enter
(to close the Aliases view: use Ese or press Ctrl + A again)

Headlamp

Headlamp1 (a CNCF Sandbox project2): A Kubernetes web UI that is fully-featured, user-friendly and extensible

Headlamp demo

Tips & Tricks

Use the right version of kubectl for each cluster/project with asdf

You must use a kubectl version that is compatible with your cluster control plane (kube-apiserver).

Why

kubectl is supported within one minor version (older or newer) of kube-apiserver.

e.g.

  • kube-apiserver is at 1.30
  • kubectl is supported at 1.31, 1.30, and 1.29

For more information, see

How?

See the demo at asdf-demo repository

Make aliases for kubectl

Show cluster information in shell prompt

Add shell completions for kubectl

Configuration for completion

Add color to kubectl output with kubecolor

kubecolor colorizes your kubectl command output and does nothing else.

You can use kubecolor as a complete alternative of kubect

kubectl get pods - demo

kubectl describe pod - demo

Configuration
  • zsh

    # .zshrc
    alias k="kubectl"
    
    if [ "$(command -v kubecolor)" ]; then
      alias kubectl="kubecolor"
      compdef kubecolor=kubectl
    fi
    
  • fish

    # ~/.config/fish/config.fish
    if status is-interactive
      abbr --add k kubectl # https://fishshell.com/docs/current/cmds/abbr.html
    
      if  command -v kubecolor &>/dev/null
          alias kubectl=kubecolor # https://fishshell.com/docs/current/cmds/alias.html
    
          # make kubecolor inherit completions from kubectl # https://fishshell.com/docs/current/cmds/complete.html
          complete -c kubecolor -w kubectl
      end
    end
    

Switch between contexts (cluster) with kubectx

kubectx: ../a tool to switch between contexts (clusters) on kubectl faster.

kubectx demo

Switch between namespaces with kubens

kubens: ../a tool to switch between Kubernetes namespaces (and configure them for kubectl) easily.

kubens demo

Switch between contexts/namspace with kubeswitch

kubeswitch: ../kubectx for operators, treat clusters as cattle, not pets.

kubeswitch demo

Linux commands and their modern versions

Read file

Read binary file

  • Example file:

    ABCDabcd1234
    
CommandUsageExampleNote
odDisplay file contents in octal, decimal or hexadecimal format.od --format=x1 --address-radix=x path/to/file000000 41 42 43 44 61 62 63 64 31 32 33 34
Optionally display the byte offsets and/or printable representation for each line.
xxdCreate a hexadecimal representation (hexdump) from a binary file,xxd path/to/file00000000: 4142 4344 6162 6364 3132 3334 ABCDabcd1234
or vice-versa.
hexylA simple hex viewer for the terminal.hexyl path/to/file│00000000│ 41 42 43 44 61 62 63 64 ┊ 31 32 33 34 │ABCDabcd┊1234 │
Uses colored output to distinguish different categories of bytes.

note

Copy & paste examples

echo ABCDabcd1234 | od --format=x1 --address-radix=x
echo ABCDabcd1234 | xxd
echo ABCDabcd1234 | hexyl

tip

The extra value of 0a (at the end) is the ASCII code for LF (LineFeed), which is the newline on many systems1.

How to quickly explore a Github repository - WIP

What?Why?How?Note
Use Github web-
Open the repo in vscode.dev
Use a 3rd-party online editorgithub1s1Also works with gitlab repo, npm package
Temporary clone and peek at itgit-peek2
Clone and have your own copy
1

https://github.com/conwnet/github1s

2

https://github.com/Jarred-Sumner/git-peek

Starship: Cross-shell Prompts

Starship: The minimal, blazing-fast, and infinitely customizable prompt for any shell!

Config

Config file

~/.config/starship.toml

Custom commands

[custom.typescript]
description = "TypeScript"
symbol = "󰛦 "
style = "#3178C5 bold"
when = "jq --exit-status '.devDependencies.typescript' package.json"
command = "jq --raw-output '.devDependencies.typescript' package.json | tr --delete '^'"

[custom.react]
description = "React"
symbol = " "
style = "#149ECA bold"
when = "jq --exit-status '.dependencies.react' package.json"
command = "jq --raw-output '.dependencies.react' package.json | tr --delete '^'"

[custom.nextjs]
description = "Next.js"
symbol = "Next.js "
style = "#F0F0F0 bold"
when = "jq --exit-status '.dependencies.next' package.json"
command = "jq --raw-output '.dependencies.next' package.json | tr --delete '^'"


[custom.tailwind]
description = "Tailwind CSS"
symbol = "󱏿 "
style = "#38BDF8 bold"
when = "jq --exit-status '.devDependencies.tailwindcss' package.json"
command = "jq --raw-output '.devDependencies.tailwindcss' package.json | tr --delete '^'"

Tmux

Getting Started

What is tmux?

tmux is a program which runs in a terminal and allows multiple other terminal programs to be run inside it

Why tmux?

  • Work with multiple programs and shells together in one terminal, a bit like a window manager.

Concepts & terms

The tmux server and clients

  • tmux server: tmux keeps all its state in a single main process, called the tmux server.

  • tmux client:

    • Users attach to the tmux server by starting a client
    • Attaches a tmux session from an outside terminal such as xterm(1)

Sessions, windows and panes

  • Session: Groups 1+ windows together
  • Window: Groups 1+ panes together, linked to 1+ sessions
  • Pane: Contains a terminal and running program, appears in one window

Quick start

Help

C-b ?

tip

What does C-b ? mean?

It means:

  1. Press Ctrl and b
  2. Then press ? (It’s Shift + /)

tip

How to exit the help menu of Tmux?

Press q

Start a new session

tmux

Detach from the current session (inside a tmux session)

C-b d

Start a new named session

tmux new -s SESSIONNAME

List existing sessions

tmux ls

Attach to the most recently used session

tmux attach

Create a new window (inside a tmux session)

C-B c

Switch between sessions and windows (inside a tmux session)

C-B w

Kill a session by name

tmux kill-session -t SESSIONNAME

Tips & Tricks

Copy and Paste

Hold Shift / Select text (with mouse) / Ctrl + Shift + C / Ctrl + Shift + V

VS Code - Tip & Tricks

Start VS Code in a specific profile

VS Code doesn’t have a setting for a default profile.

The only way to start VS Code in a specific profile is via CLI.

Via CLI

  • Manually open VS Code with the profile you want

    code --profile MyProfile
    
  • Tell the shell to automatically pass the argument for you

    # .zshrc
    VSCODE_PROFILE=Fedora
    function code {
      /usr/bin/code "$@" --reuse-window --profile $VSCODE_PROFILE
    }
    

    [!TIP] I also pass in --reuse-window argument.

    code ~/.zshrc
    

    [!WARNING] By doing this, our code will always start with extra --profile argument.

    It may break default behavior of code:

    • We can no longer use code subcommands, e.g. code tunnel, code serve-web

Via GUI

Linux - Fedora - Gnome

In GNOME and other freedesktop.org-compliant desktop environments, such as KDE and Unity, applications are added to the desktop’s menus or desktop shell via desktop entries, defined in text files with the .desktop extension (referred to as desktop files). The desktop environments construct menus for a user from the combined information extracted from available desktop entries.

Desktop files may be created in either of two places:

  • /usr/share/applications/ for desktop entries available to every user in the system
  • ~/.local/share/applications/ for desktop entries available to a single user

How can I add an application to the GNOME application menu? | StackExchange

The desktop entry of VS Code is stored at /usr/share/applications/code.desktop.

Add the argument to Exec field.

Exec=/usr/share/code/code  --profile Fedora --unity-launch %F

warning

You will need sudo permission to edit this file. Remember to backup it before editing.

Working with files - Tips & Tricks

Show hidden files

ToolsLinux - GNOME (Files, aka Nautilus)CLI - brootWindows (File Explorer)MacOS (Finder)
ActionShow/hide hidden files:toggle_hidden[^hidden-gitignored-files]1Windows 11: View / Show / Hidden items
Keyboard ShortcutCtrl + HAlt + HCmd + Shift + . (Period)

YAML

.yaml or .yml

Zsh

ohmyzsh

What is ohmyzsh?

Why use ohmyzsh?

  • Aliases:

    • ~, .., /
    • d: alias for dirs: lists last visited directories
    • cd +n:
      • -: alias for cd 0
      • 1: alias for cd 1
      • 2,…, 9: alias for cd 2, …, cd 9
  • Plugins:

    ohmyzsh is bundled with a lot of plugins, which allow you to take advantage of functionality of many sorts to your shell just by enabling them.

    e.g. git, sudo, last-working-dir, globalias, kubectl

    [!TIP] For more information, see

How to use ohmyzsh?

  • Reload zsh config:

    • Restart terminal

    • Restart zsh session with:

      • omz reload

        # Restart the current Zsh session and Oh My Zsh:
        omz reload
        

        [!TIP] What does omz reload do? It simply run exec zsh1

      • exec

        exec zsh
        

caution

To reload your zsh config, don’t run source ~/.zshrc

Packages manager

Antidote

antidote is my current package manager for zsh

antidote allows deferred loading for plugins that support it.

Config

Fish Shell - Tips & Tricks

Configuration

Show the web-based configuration interface

Use fish_config command to start the web-based configuration interface

fish_config
Web config started at file:///tmp/web_configd369_8st.html
If that doesn't work, try opening http://localhost:8003/2d4d16ce88565f217f8d6345721cd63a/
Hit ENTER to stop.

fish web-base configuration interface

Reload config

Use source command to reload the configuration file

# Reload default configuration file
source ~/.config/fish/config.fish

For more information, see Configuration | Fish Language

Plugin manager

fisher: A plugin manager for Fish

Plugins

  • fzf.fish: Augment your Fish command line with mnemonic key bindings to efficiently find what you need using fzf.
  • hydro: Ultra-pure, lag-free prompt with async Git status. Designed for Fish.
  • jethrokuan/z: a port of z for the fish shell (fast & fish-friendly, with tab-completions and lazy-loading)

Config

VS Code - markdownlint - Config

Config for markdownlint, an extension for VS Code, powered by markdownlink library for Node.js (which inspired by markdownlink for Ruby).

Auto fix on save1

// settings.json
{
  "editor.codeActionsOnSave": {
    "source.fixAll.markdownlint": "true",
  },
}

My brief understand of things in a VUCA world

github-actions.md

Github Actions : an end-to-end GitHub-centric SDLC process. : provides an automation platform and framework that has been missing from GitHub previously and has had to be added on with other solutions such as Jenkins or Travis CI.

ostree

ostree : “git for operating system binaries”1 : Used in Fedora atomic desktop OSes2, RHEL CoreOS

1

https://ostreedev.github.io/ostree/introduction/#:~:text=%E2%80%9Cgit%20for%20operating%20system%20binaries%E2%80%9D

2

https://fedoraproject.org/atomic-desktops/

runtime

runtime : execution time : the amount of time that a program takes to perform a task

runtime : a computer program that enables other computer programs to run inside it

XY problem

XY problem : (Wikipedia) a communication problem encountered in situations where:

  • the question is about an end user’s attempted solution X
  • (rather than the root problem Y)

alt text Image: Sketchplanations