How to Set Up Your Computer for Full-Stack JavaScript Development

On day 1 of our Full-Stack JavaScript Development Accelerator, students set up their computers with the programs they will need for the next 8 weeks and beyond. If you are curious about our offerings, or are just getting started in web development, take a look at the programs and tools we use.

Tools

Set up your computer with:

Editors

Our choice:

We use Atom.io or Sublime Text 3 in class, and I'm betting you already do too (unless you rock Vim or Emacs). Bonus: enjoy the full-feature, unlimited-time Trial mode.

Editors with debugging tools:

If you are coming from an IDE like Visual Studio or Eclipse, you may like WebStorm (trial version) better than Sublime Text because of the autocompletion and debugging tools. It's also cheaper for an academic license ($29 vs $79).

Open source:

If you're a strict proponent of open source, or want to dog-food and customize your editor in JavaScript, there are two great free editors: Brackets and Light Table.

Free web services:

Sign up for:

Set up on Mac OS:

Click here for Ubuntu »
  • Homebrew (The instructions are at the end of the web page.)

  • rbenv, ruby-build, ruby 2.1.0 and the sass gem

    • brew doctor
    • brew update
    • brew install rbenv ruby-build rbenv-gem-rehash
    • echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bash_profile
    • echo 'eval "$(rbenv init -)"' >> ~/.bash_profile
    • rbenv install 2.1.0
    • rbenv global 2.1.0
    • gem install sass
    • Do NOT use sudo to install ruby or gems
    • If you get a permissions error when installing sass, somehow system ruby is still active. Try restarting your terminal, or if it persists, check for the items above in your .bash_profile file
  • Node.js

    • brew install nvm
    • nvm install 0.10
    • nvm alias default 0.10
    • add source $(brew --prefix nvm)/nvm.sh to your .bash_profile or .zshrc
    • Reference the NVM README if you get stuck
  • PostgreSQL

  • Pick a programmer's editor:

    • Try out Atom.io and ask around for an invite.
    • Or go with the crowd and choose Sublime Text 3
    • Or try Adobe's open source
    • Which one should you choose? I like Atom.io and Brackets because you can customize them with JavaScript. Customizing Sublime requires knowledge of Python.
  • MongoDB

    • brew install mongodb
    • You may not want it to start at login; it's pretty easy to just run MongoDB when you need it
  • Redis

    • brew install redis
    • Same as above: you don't need it to start at login
  • Heroku Toolbelt

    • brew install heroku-toolbelt

Set up on Ubuntu:

  • No need for Homebrew; you already have a perfectly good package management system.

  • In your terminal preferences, make sure that "Run Command as a login shell" is an enabled profile preference.

    • Reference these two screenshots (1 and 2) for help
  • rbenv, ruby-build, and ruby

    • Note: You DO NOT have to buy a digital ocean server. These are instructions for how to install LOCALLY. Ignore the create a server droplet step.
    • Note: Replace 1.9.3 with the latest version of ruby: 2.1.0
  • gem install sass // DO NOT use sudo to install gems

  • Node.js

  • PostgreSQL

  • Sublime Text 3

  • MongoDB

    • Note: You DO NOT have to buy a digital ocean server. These are instructions for how to install LOCALLY. Ignore the create a server droplet step
  • Redis

    • Same note as above
  • Heroku Toolbelt - sudo apt-get install heroku-toolbelt

There you go—all the tools we use in the Full-Stack JavaScript Development Accelerator.

Questions, comments, or concerns? Let me know on the GitHub repo.

Ivan Storck

Web Developer, Teacher, Entrepreneur. Co-founder of Sustainable Websites, Code Fellows, and Aerobatic. Ivan lives in Seattle and enjoys paddling his SUP, spending time with family, and traveling.