DEV Community

SaKKo
SaKKo

Posted on • Updated on

How I upgrade my Mac for development in Catalina macOS

#beginners #ruby #node #webdev

My previous post How I setup my Mac for development will work just fine with older macOS.

I also made a video, check it out if you have trouble installing ruby, python, nodejs

Alt Text

But now that it's Catalina, bash has been changed to zsh and I want to note my setup and other findings here.

Most of the steps are the same except nvmrc part

Check / Set my home folder

I sometime see people use long username in home folder. I usually go with short and easy to remember username. Mine is sakko.

To check, type open terminal and type pwd

$ pwd
/Users/sakko
Enter fullscreen mode Exit fullscreen mode

If it's not what you like, find a way to change it now before continuing. It will be extremely difficult to change this after a few months.

Install Xcode

Download Xcode from here https://developer.apple.com/download/more/ or the Apple App Store.

Then try creating a single page app iOS project. Run the project to see if it build successfully.

Install Xcode Command Line Tools

Open terminal and type

$ xcode-select --install
Enter fullscreen mode Exit fullscreen mode

Then click install to continue

Configure git config

Open terminal and input these (replace your name and email)

$ git config --global user.name "John Doe"
$ git config --global user.email "john.doe@gmail.com"
Enter fullscreen mode Exit fullscreen mode

Setup global .gitignores

Mac has some annoying files that can be ignored by git. Let's add them.

$ nano ~/.gitignore
Enter fullscreen mode Exit fullscreen mode

Then add these

# Node
npm-debug.log

# Mac
.DS_Store
.AppleDouble
.LSOverride

# Thumbnails
._*

# Files that might appear in the root of a volume
.DocumentRevisions-V100
.fseventsd
.Spotlight-V100
.TemporaryItems
.Trashes
.VolumeIcon.icns
.com.apple.timemachine.donotpresent

# Directories potentially created on remote AFP share
.AppleDB
.AppleDesktop
Network Trash Folder
Temporary Items
.apdisk

# Windows
Thumbs.db

# WebStorm
.idea/
Enter fullscreen mode Exit fullscreen mode

After you are done, activate this globally by running

$ git config --global core.excludesfile ~/.gitignore
Enter fullscreen mode Exit fullscreen mode

install iterm2

https://iterm2.com/

install oh my zsh

fully explained here https://github.com/robbyrussell/oh-my-zsh

but for quick installation just run

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

then restart terminal

Install NVM

For nodejs development, open https://github.com/nvm-sh/nvm

copy the installation line (eg.)

$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.1/install.sh | bash
Enter fullscreen mode Exit fullscreen mode

Open ~/.zshrc and see if these lines are present. (if not, add it)

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion
Enter fullscreen mode Exit fullscreen mode

If you are using .nvmrc in your projects to activate node version like .ruby-version, then you might want to install nvm-auto from https://github.com/dijitalmunky/nvm-auto

run this line by line

cd ~/.oh-my-zsh/custom/plugins
git clone https://github.com/dijitalmunky/nvm-auto.git
sed -e 's/^plugins=(\(.*\))/plugins=(\1 nvm-auto)/' -i .pre-nvm-auto ~/.zshrc
echo 'nvm_auto_switch' >> ~/.zshrc
source ~/.zshrc
Enter fullscreen mode Exit fullscreen mode

Restart terminal then install nodejs (only the version you use)

$ nvm install 10.16.0
$ nvm install node    # this will install latest
Enter fullscreen mode Exit fullscreen mode

Install Ruby

I'm a Rails developer so I need ruby as well. I choose rvm (like nvm) to manage versions and gemsets.

Simply run the command below and follow what's prompted.

$ \curl -sSL https://get.rvm.io | bash -s stable
Enter fullscreen mode Exit fullscreen mode

When it's done, restart terminal once, to get rvm loaded.

Install ruby, I use 2.5.3 and 2.6.3 at the moment

$ rvm install 2.5.3
$ rvm install 2.6.3
Enter fullscreen mode Exit fullscreen mode

I don't like document to be installed (to save space) so I usually globally ignore it. (Not sure if this is necessary anymore)

$ echo "gem: --no-document" >> ~/.gemrc
Enter fullscreen mode Exit fullscreen mode

Then install latest version of Rails

$ gem install rails
Enter fullscreen mode Exit fullscreen mode

Homebrew, Postgresql, MySql, ElasticSearch, Redis and other apps

RVM will install Homebrew for you, so you don't need to reinstall it.

So let's install other apps

# image processing
$ brew install imagemagick gs vips

# postgresql or postgresql@11
$ brew install postgresql
$ brew services start postgresql # to start service

# mysql
$ brew install mysql
$ brew services start mysql # to start service

# redis
$ brew install redis
$ brew services start redis # to start service

# memcached
$ brew install memcached
$ brew services start memcached # to start service
Enter fullscreen mode Exit fullscreen mode

Installing ElasticSearch require Java8 you can download them from here.

Agree with the terms or use openjdk from Homebrew

$ brew tap AdoptOpenJDK/openjdk
$ brew cask install adoptopenjdk8
Enter fullscreen mode Exit fullscreen mode

Then install ElasticSearch

# elasticsearch
$ brew install elasticsearch
$ brew services start elasticsearch # to start service
Enter fullscreen mode Exit fullscreen mode

Android development + React-Native

The best tutorial is the official one.

https://facebook.github.io/react-native/docs/getting-started

Other Apps I use

  • Atom.io
  • VSCode
  • Sublime
  • iTerm2
  • Alfred
  • 1Password
  • Little Snitch
  • iStat Menus

Atom packages

I usually start with these packages, (you need to install shell command from atom application menu first)

apm install atom-beautify blame console-log editorconfig emmet es6-javascript language-docker language-javascript-jsx language-plantuml language-vue linter linter-swagger linter-ui-default plantuml-preview prettier-atom rails-snippets react  ruby-block set-syntax indent-guide-improved
Enter fullscreen mode Exit fullscreen mode

Sublime

I usually use Sublime if I want to quickly open some file (especially JSON). Since it's the fastest editor I can find with all the features I need. These are the packages I usually use.

Babel
Emmet
GitGutter
JsPrettier
JSX
JsFormat
Enter fullscreen mode Exit fullscreen mode

Also enable CLI with

sudo ln -s "/Applications/Sublime Text.app/Contents/SharedSupport/bin/subl" /usr/local/bin/subl
Enter fullscreen mode Exit fullscreen mode

Other stuffs,

Docker - not yet, I'm saving my precious 256GB ssd T____T

python, gcloud, ansible, blah blah blah..... too many to add. Install them later.

Top comments (12)

Collapse
 
brendangillies profile image
Brendan Gillies •

Thanks for this article. I'm having issues with installing RVM the way you have described.... I always get this error:

mkdir: /User_Provile.rvm/src: Read-only file system

Did you run into this? I have followed the same procedure described.

Collapse
 
brendangillies profile image
Brendan Gillies •

It looks like my .rvm folder was moved into the "Relocated Items" folder on my desktop as part of the Catalina upgrade... Can't figure out where to move this folder to make it compatible again.

Collapse
 
sakko profile image
SaKKo •

i always clean install new OS to prevent this. Not sure if you can just delete it and reinstall r again.

Thread Thread
 
brendangillies profile image
Brendan Gillies • • Edited

Do you mind sharing what the path to your .rvm folder installs to through your process so that I can verify that I've moved it to the same location

Collapse
 
patricnox profile image
PatricNox •

Additional:

Xcode needs to be updated
------------ developer.apple.com/download/

NFS in docker
----------- firehydrant.io/blog/nfs-with-docke...

Endpoint security VPN
---------- supportcontent.checkpoint.com/file...

Also sadly Apache Directory Studio does not work with Catalina so a replacement is needed if used.

Collapse
 
dualyticalchemy profile image
⚫️ nothingness negates itself • • Edited

cool list and workflow, love Alfred

i use zshell now with pyenv, rbenv and nvm, as you do. i always install klange's nyancat. i use spacevim with coc, ack, ctags, etc. tho

i replace Preview with Skim for my PDF viewer and use Digital Color Meter in my Dock.

karabiner no longer works for me in Catalina to change my CAPS LOCK to ESCAPE, but i usually do that, or also set CAPS LOCK double-tap to L_CTRL

there's OS X for Hackers, which has some relevant bits: gist.github.com/erikh/2260182

oh, and tmux and its plugins, like integration with fzf; lovely stuff

Collapse
 
mateuszjarzyna profile image
Mateusz Jarzyna •

Few years ago I've also installed everything manually, but now I know how to docker databases and so on. My life is much, much easier. Especially when you have to use same database with different version for different projects.

Collapse
 
sakko profile image
SaKKo •

i have to save disk space, this one only has 256gb.

Collapse
 
aquadrehz profile image
AquaDrehz • • Edited

In last version brew changes cask command so

$ brew cask install adoptopenjdk8

should become

$ brew install --cask adoptopenjdk8

Ref: github.com/Homebrew/discussions/di...

Collapse
 
powellian profile image
powellian •

Helpful article, the export NVM_DIR part bailed me out.
Thanks

Collapse
 
darryljmorley profile image
Darryl •

Nice write up. Thanks for this it helped me to get nvm, node, npm back after updating to Catalina.

Collapse
 
sakko profile image
SaKKo •

good to hear, happy to write

Read next

mike_andreuzza profile image

How to create a rating system with Tailwind CSS and Alpinejs

Michael Andreuzza -

yuricodesbot profile image

Supabase Auth now supports Anonymous Sign-ins

Yuri -

kutt27 profile image

Difference between var and let in Javascript

Amal Satheesan -

oatula profile image

Docker

Atul Anand Oraon -