Logo

dev-resources.site

for different kinds of informations.

πŸš€ A hands-on guide to setting up zsh, oh my zsh, asdf, and spaceship prompt with zinit for your development environment

Published at
6/18/2024
Categories
terminal
zsh
tutorial
beginners
Author
girordo
Categories
4 categories in total
terminal
open
zsh
open
tutorial
open
beginners
open
Author
7 person written this
girordo
open
πŸš€ A hands-on guide to setting up zsh, oh my zsh, asdf, and spaceship prompt with zinit for your development environment

Introduction 🌟

Elevate your development environment with this guide on installing and configuring Zsh, Oh My Zsh, asdf, and the Spaceship Prompt theme. We will also leverage Zinit for additional plugin management. Let’s get started!

🚨🚨🚨 WARNING:If you like it this article please click in reaction and save, also follow me here and on my Github

πŸ› οΈ Step 1: Installing Zsh

Zsh is a robust shell that provides a powerful command-line experience. Here’s how to install it:

🐧 For Linux (Ubuntu/Debian):

sudo apt update
sudo apt install zsh
chsh -s $(which zsh)
Enter fullscreen mode Exit fullscreen mode

🍎 For macOS:

Zsh is pre-installed. To set it as your default shell:

chsh -s /bin/zsh
Enter fullscreen mode Exit fullscreen mode

πŸͺŸ For Windows:

Use WSL (Windows Subsystem for Linux) or Git Bash. For WSL:

  1. Install a WSL distribution (e.g., Ubuntu) from the Microsoft Store.
  2. Install Zsh as you would on Ubuntu.

Verify the installation:

zsh --version
Enter fullscreen mode Exit fullscreen mode

βš™οΈ Step 2: Setting Up Oh My Zsh

Oh My Zsh simplifies Zsh configuration with themes and plugins.

Install Oh My Zsh:

sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
Enter fullscreen mode Exit fullscreen mode

This script will set up Oh My Zsh and switch your default shell to Zsh.

Configure Oh My Zsh:

  1. Open your .zshrc file:

    nano ~/.zshrc
    
  2. Enable plugins:

    plugins=(git asdf)
    
  3. Reload your configuration:

    source ~/.zshrc
    

πŸ”„ Step 3: Installing and Configuring Zinit

Zinit is a plugin manager for Zsh, offering flexible and fast plugin management.

Install Zinit:

  1. Add Zinit installer chunk to your .zshrc:

    cat << 'EOF' >> ~/.zshrc
    
    ### Added by Zinit's installer
    if [[ ! -f $HOME/.local/share/zinit/zinit.git/zinit.zsh ]]; then
        print -P "%F{33} %F{220}Installing %F{33}ZDHARMA-CONTINUUM%F{220} Initiative Plugin Manager (%F{33}zdharma-continuum/zinit%F{220})…%f"
        command mkdir -p "$HOME/.local/share/zinit" && command chmod g-rwX "$HOME/.local/share/zinit"
        command git clone https://github.com/zdharma-continuum/zinit "$HOME/.local/share/zinit/zinit.git" && \
            print -P "%F{33} %F{34}Installation successful.%f%b" || \
            print -P "%F{160} The clone has failed.%f%b"
    fi
    
    source "$HOME/.local/share/zinit/zinit.git/zinit.zsh"
    autoload -Uz _zinit
    (( ${+_comps} )) && _comps[zinit]=_zinit
    
    # Load a few important annexes, without Turbo
    zinit light-mode for \
        zdharma-continuum/zinit-annex-as-monitor \
        zdharma-continuum/zinit-annex-bin-gem-node \
        zdharma-continuum/zinit-annex-patch-dl \
        zdharma-continuum/zinit-annex-rust
    
    ### End of Zinit's installer chunk
    
    EOF
    
  2. Source your .zshrc:

    source ~/.zshrc
    

πŸ”Œ Step 4: Installing Additional Plugins with Zinit

Use Zinit to install additional plugins for a richer Zsh experience.

Install plugins using Zinit:

  1. Open your .zshrc file and add the following Zinit plugin commands:

    nano ~/.zshrc
    
  2. Add these lines to install and load additional plugins:

    zinit light zdharma-continuum/fast-syntax-highlighting
    zinit light zsh-users/zsh-autosuggestions
    zinit light zsh-users/zsh-completions
    
  3. Save and reload your .zshrc:

    source ~/.zshrc
    

πŸ“¦ Step 5: Installing and Configuring asdf

asdf is a versatile version manager for multiple languages.

Install asdf:

  1. Clone the asdf repository:

    git clone https://github.com/asdf-vm/asdf.git ~/.asdf --branch v0.11.3
    
  2. Add asdf to your .zshrc:

    echo -e '\n. $HOME/.asdf/asdf.sh' >> ~/.zshrc
    echo -e '\n. $HOME/.asdf/completions/asdf.bash' >> ~/.zshrc
    source ~/.zshrc
    

Install asdf plugins:

  1. Add the Node.js plugin:

    asdf plugin-add nodejs https://github.com/asdf-vm/asdf-nodejs.git
    
  2. Install a specific version:

    asdf install nodejs 16.13.0
    asdf global nodejs 16.13.0
    
  3. Add the Python plugin:

    asdf plugin-add python https://github.com/danhper/asdf-python.git
    
  4. Install a specific version:

    asdf install python 3.9.7
    asdf global python 3.9.7
    

Managing project-specific versions:

Create a .tool-versions file in your project directory:

nodejs 14.17.6
python 3.8.10
Enter fullscreen mode Exit fullscreen mode

Run asdf install in the project directory to use these versions locally.

πŸš€ Step 6: Configuring the Spaceship Prompt Theme

The Spaceship Prompt theme offers a sleek and informative prompt for Zsh.

Install Spaceship Prompt:

  1. Clone the Spaceship repository:

    git clone https://github.com/spaceship-prompt/spaceship-prompt.git "$ZSH_CUSTOM/themes/spaceship-prompt" --depth=1
    
  2. Create a symlink:

    ln -s "$ZSH_CUSTOM/themes/spaceship-prompt/spaceship.zsh-theme" "$ZSH_CUSTOM/themes/spaceship.zsh-theme"
    
  3. Set the theme in your .zshrc:

    ZSH_THEME="spaceship"
    

Configure Spaceship Prompt:

  1. Create a configuration file .spaceshiprc.zsh:

    nano ~/.spaceshiprc.zsh
    
  2. Add the following configuration:

    SPACESHIP_USER_SHOW=always
    SPACESHIP_PROMPT_ADD_NEWLINE=false
    SPACESHIP_CHAR_SYMBOL="Ξ»"
    SPACESHIP_CHAR_SUFFIX=" "
    SPACESHIP_PROMPT_ORDER=(
      user          # Username section
      dir           # Current directory section
      host          # Hostname section
      git           # Git section (git_branch + git_status)
      package       # Package version
      node          # Node.js section
      bun           # Bun section
      elixir        # Elixir section
      erlang        # Erlang section
      rust          # Rust section
      docker        # Docker section
      docker_compose # Docker Compose section
      terraform     # Terraform section
      exec_time     # Execution time
      line_sep      # Line break
      jobs          # Background jobs indicator
      exit_code     # Exit code section
      char          # Prompt character
    )
    
  3. Source your configuration in .zshrc:

    echo "source ~/.spaceshiprc.zsh" >> ~/.zshrc
    source ~/.zshrc
    

Enable Command History Sharing:

To share command history across sessions:

HISTFILE=

~/.zsh_history
HISTSIZE=10000
SAVEHIST=10000
setopt share_history
Enter fullscreen mode Exit fullscreen mode

Enable Auto-Corrections:

Enable corrections for common typos:

setopt correct
Enter fullscreen mode Exit fullscreen mode

πŸ”  Step 7: Adding a Nerd Font for the Spaceship Prompt

Nerd Fonts provide additional icons and glyphs that enhance the appearance of your terminal, especially with themes like Spaceship Prompt.

  1. Install a Nerd Font (e.g., Hack or Roboto Mono):
  • Go to the Nerd Fonts GitHub repository and download your preferred font (e.g., Hack or Roboto Mono).
  • Follow the installation instructions for your operating system.
  1. Configure Your Terminal Emulator:
  • Open your terminal emulator's preferences/settings.
  • Select the installed Nerd Font (e.g., Hack Nerd Font or Roboto Mono Nerd Font) as the font for your terminal.

Now, your Spaceship Prompt should display with the Nerd Font icon you selected.

πŸŽ‰ Conclusion

You’ve now set up a robust and visually appealing development environment with Zsh, Oh My Zsh, asdf, and the Spaceship Prompt theme, using Zinit for additional plugins. This configuration will enhance your workflow and make managing multiple projects a breeze. Happy coding!


Further Reading πŸ“š:


Photo by Lukas on Unsplash

This article was crafted and tailored with ChatGPT help. πŸ€–πŸ’‘

zsh Article's
30 articles in total
Favicon
Understanding Linux Shells: Interactive, Non-Interactive, and RC Files
Favicon
Enhance Your macOS Terminal with Oh My Zsh, Autosuggestions, and Powerlevel10k
Favicon
Oh My Zsh: A Simple Guide for Developers
Favicon
Display Dir Structure in Tree Format.
Favicon
A Guide to Setting Up Zsh: Improving Your Terminal Experience
Favicon
OMZ: Some Plugins that I forget about
Favicon
Managing dotfiles using GNU Stow on macOS
Favicon
Copy paste bash command but dont understand what it does?
Favicon
How do I show the git branch with colours in Bash prompt?
Favicon
Demystifying Bash and Zsh on Mac
Favicon
How to make your terminal looks Splendid
Favicon
Adding Zsh Completion for `gh copilot`
Favicon
Docker aliases with zsh using Ohmyzsh
Favicon
Improve your PowerShell experience
Favicon
Colorful terminals with Oh My Posh and Windows Terminal
Favicon
Some Config Ideas for your ZSH
Favicon
Ma configuration post-installation d'Arch Linux
Favicon
πŸš€ Simplify Your Linux Process Killing with a Fuzzy Process Killer πŸš€
Favicon
How to Remove Duplicate Paths in ZSH on MacOS
Favicon
zsh: permission denied: ./gradlew
Favicon
How to install oh-my-zsh and zsh-autosuggestions for macbook
Favicon
Add Visual Studio Code to your OSX zsh PATH
Favicon
Simple Directory Watcher to Restart Dev Server
Favicon
πŸš€ Um Guia PrΓ‘tico para Configurar Zsh, Oh My Zsh, asdf e Spaceship Prompt com Zinit para Seu Ambiente de Desenvolvimento
Favicon
πŸš€ A hands-on guide to setting up zsh, oh my zsh, asdf, and spaceship prompt with zinit for your development environment
Favicon
My zsh config
Favicon
Finding Terminal Utopia
Favicon
How to stop Storybook opening a new webpage on start (automatically with zsh)
Favicon
zoxide - A faster alternative to boring cd command
Favicon
A quick bash/zsh tip

Featured ones: