𝔩𝔢𝔩𝕠𝔭𝔢𝔷
Connect With Me on LinkedIn

Tutorials

Setting the Stage

Empty Canvas

Lienzo - Just as a painter relies on clean brushes and a well-prepared canvas, a software developer's artistry is deeply influenced by their chosen tools and materials. The right environment, frameworks, and applications provide the backdrop upon which code, like paint strokes, transforms into software masterpieces.

Productivity Tools

Let's start by gather some essential tools that will be constant companions throughout our development journey. These are the applications that I install on every machine forming the cornerstone of a productive toolkit.

  1. Obsidian: A powerful note-taking app that helps organize thoughts, ideas, and code snippets.
  2. 1Password: For managing and securing passwords and sensitive information.
  3. Firefox: The main browser for researching and browsing with any quality of life addons such as an ad blocker.
  4. Chrome: The testing grounds browser where we limit what addons we install in order to avoid any conflicts while developing.
  5. Spark: A reliable email client to keep an organized inbox.
  6. Grammarly: Your writing assistant to ensure clean code comments and documentation.
  7. MeetingBar: A handy tool for keeping track of meetings and appointments.

Development Easel

These are the programs where the most time is spent! Feel free to style them to preference or start with the provided config files to get up and good quickly.

  1. Visual Studio Code: A versatile code editor.
    • Download and install the latest version from their website.
    • Follow these instruction to launch from the command line
    • Be sure to signing with Github in order to save profile settings
    • Take a look at this file for the settings I typically use.
  2. GitKraken: A powerful Git GUI client for version control.
    • Download and install the latest version from their website.
  3. Hyper: A highly customizable terminal emulator.
    • Download and install the latest version from their website.
    • Take a look at this file for the settings I typically use.
  4. Nerd Fonts: - Fonts that can support the various glyphs used by command line tools.
    • Follow this link for my go-to font and download the raw file.
    • Install by double clicking the font file.

Command Palette

Our terminal will be the main entry point for the various operations required while developing software. We'll spend some time configuring a few command line tools so that we can use it efficiently.

Although there are a few OS specific steps initially, once we have a consistent foundation, the rest should be platform agnostic between MacOS and Linux.

Tip:Windows users should look into WSL in order follow along with minimum differences.

Foundational Dependencies

MacOS

  1. Xcode Command Line Tools: Enables UNIX-style development via your terminal.
    • Install with the following terminal command
      xcode-select --install
Tip:Macs comes with ZSH as the default shell. Git and other build essentials come bundled in the command line tools installed above

Linux (Debian/Ubuntu)

  1. Build Essentials: A package of packages used for building software
    • Install with the following terminal command
      sudo apt-get install build-essential
  2. Git: A version control system.
    • Install with the following terminal command
      sudo apt-get install git
  3. ZSH: A shell we'll be extending to make our terminal more helpful
    • Install with the following terminal command
      sudo apt-get install zsh
    • Set as default shell
      sudo chsh -s $(which zsh)

Package Manager

  1. Homebrew: This a go-to for most devs using MacOS. By using this, Linux users can also follow along
    • Install with the following terminal command
      /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Dotfiles

  1. Dotfiles: My preferred starting point. If you have your own setting already present, we'll be able to merge them in in a later step.
    • Clone the repo to your home directory
      git clone git@github.com:lelopez-io/.dotfiles.git ~/.dotfiles
  2. GNU Stow: This will help manage all the dot files required for our config by allowing us to version control them.
    • Install the stow package
      brew install stow
    • Move into the repo
      cd ~/.dotfiles
    • Initialize you home directory with the contents in ~/.dotfiles
      # The adopt flag will keep any files/settings you have locally.
stow . --adopt
  3. Resolve Conflicts: You can use git to pick and choose what you want to keep. Alternatively, you can discard all changes and keep the repo values instead.
Important:If you have used neovim before, you'll want to delete the ~/.config/nvim directory and re-run the stow command should you wish to keep the repo nvim config. Otherwise delete the repo nvim directory before running stow so that only your settings are kept without merging

Terminal Editor

  1. NeoVim: A vim based text editor that we can extend and configure.
    • Install with the following terminal command
      brew install neovim
    • If you didn't use stow: copy the following files to your local ~/.config/nvim directory
  2. Packages: Since the config makes use of folke/lazy.nvim, we simply have to start neovim for all packages to be installed
    • Install the packages using the following editor command.
      nvim
  3. prettierd: Allows our editor to efficiently cleanup and format our files consistently.
    • Install with the following terminal command
      brew install fsouza/prettierd/prettierd

Terminal Multiplexer

  1. TMUX: Enables multiple terminals to be created and accessed from a single screen.
    • Install with the following terminal command
      brew install tmux
    • If you didn't use stow: copy the following file to your local ~/.tmux.conf file'
    • Note that we specify CTRL+A i.e. <C-A> as the prefix key. This means any time we want issue TMUX a command, we need to start with the prefix key.
  2. TPM: A plugin manager for our terminal multiplexer
    • Install with the following terminal command
      git clone https://github.com/tmux-plugins/tpm ~/.tmux/plugins/tpm
  3. Plugins:
    • Start TMUX with the following terminal command
      tmux
    • Install plugins with the following tmux command
      # <C-a>-I # press CTRL+A at the same time, let go and then press SHIFT+i

Shell Configuration

  1. oh-my-zsh: A framework for managing our zsh configuration
    • Install with the following terminal command
      sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
  2. Spaceship: A ZSH prompt that makes your time in the terminal more pleasant by offering useful information
    • Install with the following terminal command
      git clone https://github.com/spaceship-prompt/spaceship-prompt.git "$ZSH_CUSTOM/themes/spaceship-prompt" --depth=1
    • Link the theme file with the following terminal command
      ln -s "$ZSH_CUSTOM/themes/spaceship-prompt/spaceship.zsh-theme" "$ZSH_CUSTOM/themes/spaceship.zsh-theme"
  3. zsh-syntax-highlighting: Allows us to easily review our commands as we type them.
    • Install with the following terminal command
      git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-syntax-highlighting
  4. zshrc: We can configure our local shell with .zshrc as the main entry point.
    • If you didn't use stow: copy the following to your $HOME directory:
    • .zshrc - sets the theme and plugins while also linking out to the remaining config files.
    • .zsh_prompt - configures the prompt so that it displays useful information to us.
    • .zsh_profile - links out to the various cli tools we'll use
    • .zsh_aliases - sets up aliases for frequently used commands
Tip:Create empty .zsh_aliases and .zsh_profile files and fill them as needed with only the commands/aliases you use. By filling it out as you go you can avoid errors should you have configurations defined for commands not yet present.

Shell Navigation

Linux (Debian/Ubuntu)

For Linux users, we need a specific version of openssl to install the version of ruby we want.

  1. libssl

    • Install with the following terminal command
      sudo apt-get update
sudo apt-get install -y build-essential libssl-dev zlib1g-dev libyaml-dev libreadline-dev libncurses5-dev libffi-dev libgdbm-dev

  2. openssl:

Linux & MacOS

The rest of the commands will work for both platforms.

  1. tree: Allows us to display directories as tries in our terminal
    • Install with the following terminal command
      brew install tree
  2. rubyenv: Allows us to install specific versions of ruby. We'll need ruby in order to install colorls later.
    • Install with the following terminal command
      brew install rbenv ruby-build
    • Add the related entry(s) to ~/.zsh_profile
    • Source the ~/.zshrc file for it to take effect
  3. ruby: Well be able to use rubyenv to install the version we want
    • Install with the following terminal command
      rbenv install 3.2.2
    • Configure the global version to use
      rbenv global 3.2.2
    • Source the ~/.zshrc file & ensure we're using the correct ruby version.
      source ~/.zshrc
which ruby
which gem
  4. colorls:
    • Install with the following terminal command
      gem install colorls
    • Add the related entry(s) to ~/.zsh_profile
    • Source the ~/.zshrc file for it to take effect

Version Control

Last but definitely not least is to get your machine configured with your distributed version control. Here we'll setup for Github but the steps should be similar if you have a different provider.

  1. generate ssh key:
    • Initialize by running the following command in your terminal:
      ssh-keygen -t ed25519 -C "your_email@example.com"
  2. register key with agent:
    • Start the agent:
      eval "$(ssh-agent -s)"
    • Open/Init config file
      vim ~/.ssh/config
    • Add the following to the end of the ~/.ssh/config file
      Host github.com
    AddKeysToAgent yes
    UseKeychain yes
    IdentityFile ~/.ssh/id_ed25519
    • (MacOS only) Add the key to your keychain
      ssh-add --apple-use-keychain ~/.ssh/id_rsa
  3. add to key to account:
    • Copy the public key with the following command:
      pbcopy < ~/.ssh/id_ed25519.pub
    • Paste that key in your online account settings.
    • Test the key by running the following command:
      ssh -T git@github.com
ImportantYou will only ever share the public key. This public key is used to verify that any code pushed up is actually yours aka signed by your local private key.

Project Muses

From here the rest depends on you and what kind of software you are looking to develop. Often the size of your team and company will influence how much of the stack you have to touch. Additionally, if you are joining a team with existing projects, it's best you look at their READMEs and other documentation for specific instruction on how to best configure their tooling.

The following are some of the tools I've had to use across various projects and have become staples in my workflow.

Frontend Development

Javascript/Typescript

  1. nvm: A Node version manager allows you have multiple versions of node should you have to work on projects with different requirements.
    • Install with the following terminal command
      curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh | bash
    • Add the related entry(s) to ~/.zsh_profile
    • Source the ~/.zshrc file for it to take effect
  2. node: With NVM we can install the latest LTS version for our runtime environment
    • Install with the following terminal command
      nvm install node
    • Source the ~/.zshrc file for it to take effect

Backend Development

Python

  1. pyenv: A Python version manager. Similar to Node above, it's possible to work on multiple projects that depend on different versions.
    • Install with the following terminal command
      brew install pyenv pyenv-virtualenv
    • Add the related entry(s) to ~/.zsh_profile
    • Source the ~/.zshrc file for it to take effect
  2. python:
    • Install with the following terminal command
      pyenv install 3
    • Configure the global default
      pyenv global 3
    • Init a virtual env (as needed / if a project requires this)
      pyenv virtualenv project-name

Mobile Development

Flutter

  1. Flutter: Helps you develop cross platform applications.
    • Installation is not as simple as the instructions for Python or Node and can vary depending on platform. Please visit their site for the latests instructions.
    • Add the related entry(s) to ~/.zsh_profile
    • Source the ~/.zshrc file for it to take effect
  2. Android Studio:
    • Download and install then follow flow for SDK Command-Line Tools
  3. Xcode
    • Download and install

Containers

  1. Rancher Desktop:

    • Install the latest release
    • Pick the dockerd runtime when given the option.
    • Select manual path config when give the option.
    • Add the related entry(s) to ~/.zsh_profile
    • Source the ~/.zshrc file for it to take effect
Important:Rancher Desktop is a pre-requisite if you are also going to be working Kubernetes

Kubernetes

  1. kubectl: A command line tool for communicating with a Kubernetes cluster's control plane.
    • This comes from the Rancher Desktop install mentioned above.
    • Add the related entry(s) to ~/.zsh_profile
    • Source the ~/.zshrc file for it to take effect
  2. kubectx + kubens: A useful tool that allows us to easily switch between clusters and namespaces
    • Install with the following terminal command
      brew install kubectx
  3. kube-ps1: Allows us to disable kubernetes status in our prompt when not needed.
    • Install with the following terminal command
      brew install kube-ps1
    • Add the related entry(s) to ~/.zsh_aliases
    • Source the ~/.zshrc file for it to take effect

Google Cloud

  1. google-cloud-sdk:
    • Download the appropriate package for your platform
    • Extract the google-cloud-sdk directory to the ~/.gcloud path
    • Add the related entry(s) to ~/.zsh_profile
    • Source the ~/.zshrc file for it to take effect

CI/CD

  1. Concourse/Fly
    • Install with the following terminal command
      brew install --cask fly
    • Add the related entry(s) to ~/.zsh_profile
    • Source the ~/.zshrc file for it to take effect
Previous
In the Pursuit of Done
Next
Typescript Cell