I started a new job recently, which meant a new work computer. I also gave myself a two-week break in between jobs, so I gave up the lovely Macbook Air I had been using at my previous job and turned back to my older Macbook Pro for personal web development work. That means I basically set up my development environment twice over the course of a few weeks, and having done it twice, I want to share how I set things up.
I’m assuming a Mac environment, by the way…
- First I create a user and login. Then I switch some basic OS X settings to suit my preferences: I make the dock smaller, turn on touch to click for the trackpad, and tweak some notification settings. I also set fun things like my wallpaper here. I also set up basic Finder settings, like exposing hidden files. To do this, go to the Terminal and type:
defaults write com.apple.finder AppleShowAllFiles YES
Then hit enter and relaunch Finder. I create some basic folder structure here as well – I like to have a code/ and src/ folder at my user root, for example.
-
Then I go on a downloading spree! First, because it takes so long, I get started on installing Xcode and the Xcode Command Line Tools. Now, Windows has a nice little app called Ninite that automatically installs apps for you, and the most similar I’ve found is GetMacApps. In any case, however I get them, I download Chrome and Firefox, music apps like Spotify and Last.FM, VLC to watch video files, Transmission for torrents, Dropbox for cloud backups, Sourcetree for visual Git management, Evernote for notes (and saving recipes…best use of Evernote I’ve found), Sublime Text 3 as my editor, iTerm2 to serve as my terminal, DiskInventoryX to better see what files are taking up hard drive space, Flux so I can fall asleep at night, and Spectacle for window management shortcuts.
-
Then, I begin to set up my development environment. I set dock shortcuts to Sublime Text, Sourcetree, and iTerm2. I add some sweet colors to my iTerm2 profile and tweak any keyboard shortcuts in iTerm2 that I need (the show/hide shortcut, in particular.)
-
I start to install utilities and globally-needed packages. I always start with Homebrew, the best package manager for OS X. Then through Homebrew, I install Node and Git.
-
At this point I configure Git. I add an SSH key for Github, set up global .gitignore to ignore system files like .DS_Store files, and set up my .gitconfig (set my default editor, email address, etc.)
-
Next I configure my .bash_profile. I add some shortcuts, history via the up arrow, color options to the shell, and configure my command prompt. I keep my command prompt pretty simple: just my username, current path, and then git branch information followed by the good ol’ $ sign. I have a few shortcuts for common commands in git, like ‘gitst’ for ‘git status’ and ‘gitco’ for ‘git checkout’. I also make a shortcut for Python’s simple HTTP server, because sometimes it’s useful just to pop it open to look at files served through a real web server. My dotfiles are on Github if you are curious about those.
-
At this point I symlink to
subl, Sublime Text’s build in command line tool. This allows me to type ‘subl filename’ and then have that file open up in Sublime. This is done by typing the following into the terminal:
ln -s /Applications/Sublime\ Text.app/Contents/SharedSupport/bin/subl /usr/local/bin/subl
-
Then, after I make sure everything in my .bash_profile is working and my command prompt looks like I want it to, I install global npm packages like bower, gulp, grunt, and grunt-cli.
-
Then I turn to customizing Sublime text. I install the Sublime Text package manager and then install the Predawn theme. The other packages I install are SASS, coffeescript, and Jade syntax highlighting, emmet, advancednewfile, Angular JS code completion, and a whitespace trimmer.
-
I round this out (which up until now is basically a good set up for front end development and JavaScript development) by installing some things for Rails development — through Homebrew, I install Ruby and postgres and then install Rails. Finally, I download PGadmin and postgresapp, as I have thus far only used Postgres with Rails development.
-
Finally, I customize Chrome a bit. I download some must-have extensions like Adblock Plus and LastPass. I also download the LiveReload extension to hook into automatic page refreshing during development and AngularJS Batarang extension for some Angular-specific JavaScript console information.
And that’s it! I would love to hear about your development and machine set up in the comments.