πŸ‡―πŸ‡΅ ζ—₯本θͺž | πŸ‡ΊπŸ‡Έ English | πŸ‡ͺπŸ‡Έ EspaΓ±ol | πŸ‡΅πŸ‡Ή PortuguΓͺs | πŸ‡ΉπŸ‡­ ΰΉ„ΰΈ—ΰΈ’ | πŸ‡¨πŸ‡³ δΈ­ζ–‡

Learning Basic Operations by Comparing Fish and Bash

In web development, command-line operations in the "black screen," or terminal (shell), are essential. Many people probably use the default shell, "Bash," without giving it much thought. However, there are more advanced shells that can dramatically improve our workflow. The prime example, and the focus of this article, is "Fish (Friendly Interactive Shell)."

This article provides a thorough explanation of Fish's basic usage and attractive features, comparing it with the most popular shell, "Bash." We hope this article serves as a first step for web creators to make their daily coding life more comfortable. All the code is designed to work perfectly just by copying and pasting. Let's explore the world of Fish by accumulating small successes of "It worked!"

What's the Difference Between Fish and Bash? Let's Learn the Shell Basics

First, let's briefly grasp the characteristics of each shell.

To use an analogy, if Bash is a "reliable, veteran machine that requires manual operation," then Fish is like a "smart AI assistant that anticipates your intentions and provides support." Now, let's see its capabilities in action.

【Hands-on】This is Different! A Thorough Comparison of Basic Operations in Fish and Bash

From here, we'll experience Fish's convenient features by comparing specific operations. If you haven't installed Fish yet, please install it according to your environment.

For macOS (Homebrew):

brew install fish

For Ubuntu/Debian:

sudo apt-get update
sudo apt-get install fish

After installation, you can start the Fish shell by typing `fish` in your terminal.

1. Different Look and Information! Prompt Comparison

The first thing you see when you start a shell is the "prompt," the part on the left where you type commands. There's a big difference between Bash and Fish right from the start.

A typical Bash prompt:
It displays information like the username, hostname, and current directory, but it's relatively simple.

user@hostname:~/project$

Fish's default prompt:
Fish clearly displays the username and the current directory path. Especially useful is that when you are inside a Git repository, it automatically displays the branch name. For web creators, Git operations are a daily routine. Seeing which branch you're working on at a glance is a great help in preventing mistakes.

user@hostname ~/project (main)>

2. Fish's Greatest Weapon! Autosuggestions

The feature that makes Fish a "god-tier shell" is its autosuggestions. This feature predicts the command you are likely to type next based on your command history, displaying it in a faint gray color.

For example, suppose you've previously typed the command `git commit -m "Initial commit"`. Next time, just by typing `git c`...

Fish's autosuggestion:
As you can see, the entire command inferred from your history is displayed faintly after the part you've typed. If you're happy with the suggestion, just press β†’ (right arrow key) or Ctrl + F to accept the entire command. You no longer need to type long commands over and over.

user@hostname ~/project (main)> git commit -m "Initial commit"

Bash also has a completion feature, but you usually need to press the Tab key to see the candidates, making it less seamless and intuitive than Fish. This experience alone is worth switching to Fish.

3. Drastically Reduce Typos! Syntax Highlighting

Fish tells you in real-time whether the command you're typing is "valid" by color-coding it. This is called syntax highlighting.

For a valid command (e.g., `echo`):
A valid command that exists on the system is displayed in light blue by default.

echo "Hello World"

For a non-existent command (e.g., a typo like `ech`):
If you mistype a command or enter one that doesn't exist, it instantly turns red. This allows you to notice your mistake before executing the command, preventing unnecessary errors.

ech "Hello World"

Thanks to this feature, you'll see the familiar "command not found" error message much less often.

Advanced: How Is Scripting Different?

A shell's role isn't just interactive operations. The different philosophies of Fish and Bash also appear when writing "shell scripts" to automate a series of processes. Fish's scripting is designed with a more modern and readable syntax.

1. Variable Definition

In Bash:
You write it in the format `VARIABLE_NAME=value`. There's a unique rule that you can't have spaces around the equals sign.

MY_PROJECT="My Awesome Site"
echo $MY_PROJECT

In Fish:
You use the `set` command to define variables. This makes it clear what you're doing, and since you pass the value as an argument, you don't have to worry about the presence of spaces.

set MY_PROJECT "My Awesome Site"
echo $MY_PROJECT

2. if Statements (Conditional Branching)

In web development, conditional branching like "if the `package.json` file exists, run `npm install`" is common.

In Bash:
A slightly archaic notation using `[` (the test command) or `[[` is common. Keywords like `; then` and `fi` are also required.

if [ -f "package.json" ]; then
  echo "package.json found!"
fi

In Fish:
You can write it more intuitively, like in other programming languages. You write the conditional expression directly after `if` and close the block with `end`. `then` and `;` are unnecessary, making the code cleaner.

if test -f "package.json"
  echo "package.json found!"
end

3. for Loops (Iteration)

Iterative processes, like performing the same operation on multiple files, are also frequently used.

In Bash:
You construct a loop with a combination of keywords like `for`, `in`, `do`, and `done`.

for i in {1..3}; do
  echo "Bash loop count: $i"
done

In Fish:
Similar to the `if` statement, this also has a simple syntax where `do` is unnecessary and the block is closed with `end`. The part enclosed in `()` is called "command substitution," and it treats the output of the command as a list.

for i in (seq 1 3)
  echo "Fish loop count: $i"
end

Points to Note When Migrating to Fish

While we've showcased the appeal of Fish, there are a few "points to be aware of" when migrating. Understanding these will help you start your Fish life smoothly and without confusion.

1. Syntactic Incompatibility with Bash

As we've seen, Fish prioritizes script readability, so it's not fully compatible with Bash. You need to be especially careful when copying and pasting Bash commands you find online.

Command Chaining (`&&`, `||`)

In Bash, you often use `&&` to write a process where "if the previous command succeeds, execute the next command."

# Create a directory and, if successful, move into it
mkdir my_dir && cd my_dir

In Fish, this is expressed with the clearer keyword `and`. (Although recent versions of Fish can also use `&&`, the official recommendation is to use `and` or `;`)

# The Fish way of writing
mkdir my_dir; and cd my_dir

Similarly, Bash's `||` (execute the next command if the previous one fails) corresponds to `or` in Fish. If you find a Bash command isn't working, remember this difference.

2. How to Set Environment Variables

The method for setting "environment variables," which you configure when setting paths for tools, is also different.

In Bash (written in `~/.bash_profile`, etc.):
You use the `export` command to set environment variables.

export NODE_ENV="development"

In Fish (written in `~/.config/fish/config.fish`):
You use the `set` command with the `-x` or `--export` flag. This ensures the variable is passed not only to the current shell but also to its child processes.

set -x NODE_ENV "development"

In particular, when adding a new path to the `PATH` variable, Fish uses a slightly special syntax. Since `$PATH` is treated as a list (array), you can simply add to it like this:

# Add ~/.node_modules/bin to the beginning of PATH
set -x PATH ~/.node_modules/bin $PATH

You don't need to concatenate it as a string with colons `:` like in Bash, allowing for safer and more intuitive path management.

Conclusion: Let's Start Using Fish!

In this article, we've explained the basic usage and appeal of the next-generation shell, "Fish," by comparing it with the standard shell, Bash.

Summary of Fish's benefits:

Of course, Bash has the significant advantages of being "available everywhere" and having a "vast amount of information." However, how about choosing the friendlier and more powerful Fish as your "partner" for daily development work? Especially for beginner web creators who want to get used to the command line, Fish should be the best learning partner.

The features introduced in this article are just a fraction of Fish's charm. As a next step, try customizing it using a plugin manager. You can make it look cool, add even more convenient features, and build your own ultimate terminal environment.

To the next article: A Beginner's Guide to Customizing Fish with Themes (Fisher, Oh My Fish)