dock - Environments made simple
A developer is only as good as his/her environment. In order to be the most productive developer possible you must start by using the correct tools. When I first learned how to build websites I preferred an IDE (Adobe Dreamweaver) as my primary editor because it provided the most out-the-box functionality. I soon found my development needs outgrew Dreamweaver and eventually realized that there really is no GUI out there that is going to give you the control that you get by using command line tools. So, I started off down the path to learning linux. In order to build an efficient development environment intermediate knowledge of Linux is a sine qua non.
GUI v. CLI
This is not to say that the best development environment doesn't use any GUIs. Many services provide excellent GUIs which provide additional benefits and advanced features. Many developers (myself included) prefer to use non-CLI text editors (textmate, webstorm, textwrangler and coda seem to be most popular). Other developers use the Github GUI, which is capable of executing most of the available git commands. To each it's own, but when making the decision between using a GUI or CLI, consider carefully how much control you will need.
Development Environment
./dock devTo make lives easier, the above command will do everything that you need to get your development environment from zero to supercharged in ~20-30 mins. Here's what the script does:
- Customize your shell
- Install packages via Homebrew
- Install apps via Cask
- Install additional dependencies
1. Customize Your Shell
Most linux machines use bash as the default shell, and if you've been using linux long enough it's likely that you have amassed an impressively large .bashrc (or .zshrc if you like me prefer the zsh shell) filled with aliases and enhancements to your shell environment. If you don't know what a .bashrc is then you should take the time to research how these files work and how they can make your life a lot easier. I would suggest perusing this:
sample .zshrc
2. Install Packages via Homebrew
If you are configuring a development environment for a mac then you must install Homebrew, and it will do a lot of heavy lifting for you. If you use a window's machine then go out and buy a Mac (but seriously). Homebrew is a package managers for Mac OSX; it can install command line packages and applications and manage these installations. Homebrew has tons of packages available and this repo installs a select view. They are listed in the BrewFile. My favorite formulas are:
- git (duh)
- emacs (or your favorite command line text editor)
- autojump
- tree
- tig
- wget
- htop
- mosh
- zsh
3. Install Apps via Cask
Even better, brew can also install your GUI apps using brew cask. Many apps are added everyday so check out what's available here or check out the casks installed with this repo.
4. Install Additional Dependencies
Install Ruby (rubygems)
Mac comes with Ruby installed. Nothing to do here... Yay! But you will need to install some important rubygems:
- Sass is a css preprocessor
- Compass is a utility for sass
- Cheat is a collection of cheat sheets for popular tools
- Ceaser is a collection of easing transistions
gem install sass compass cheat ceaser-easingInstall Global Node Modules
Node has a great deal of modules that are easily downloaded using npm. While each web project should have it's own packages.json for installing dependencies there are a few modules that you will need to install globally:
- coffee-script: Javascript pre-processor
- forever: A simple CLI tool for ensuring that a given script runs continuously (i.e. forever)
- grunt-cli: A node.js automation tool
- bower: a package manger for the web
- node-inspector: An amazing plugin that allows you to use chrome devtools on server code.
npm install # install all modules in package.json npm install -g node-inspector bower forever grunt-cli coffee-scriptYou may also want to consider yeomon, an application generator. This service installs works with bower and grunt but adds the benefit of basically doing what I've done in this repo and providing you with biased app structures (generators) to choose from. In due, time I will create my own Yeoman generator for this boilerplate.
Install LiveReload
If you've developed for a while you probably hate the process of constantly refreshing your browser once pages have been updated. This is a thing of the past with LiveReload. Install their app or browser extensions. The gruntfile.coffee has already been updated to enable livereload when changes are made to the static directory when you "grunt watch".
Production Deployment
As a developer I began making websites with zero server administration experience. I used commercial web hosting services that were both terribly interfaced and extremely limited (GoDaddy, Yahoo, etc.) As the sophistication of the things that I decided to build began to outgrow these services I decided that it was worth my time to learn to deploy a site using Amazon Web Services. Many of the webs most successful companies (Netflix, Tumblr, etc.) and most startups heavily rely on AWS, as it is very competitively priced. Unfortunately, for most front-end developers, learning to use these services is a daunting task.
# install prod env ./dock prod# build git deploy (repo, user, branch) ./dock deploy ohm ohmlabs masterSimilar to the development script above, this script is designed to build a production environment for you. This script does many things, including but not limited to:
- Create Users
- Set Time Zone & Clock
- Install Dependencies
- Provision Server (Firewall, Nginx, Varnish)
- Setting up Deploy Keys
- Create Git Repository for Deployment
For more details on exactly what this script does, please refer to the aws guide
Notes:
- environment: Ubuntu 12.04 Server:
- Adding Deploy Keys to github requires copying ssh key
AWS Guide
There are many services that are offered by AWS, but the most important is Elastic Compute Cloud (EC2) which allows users to create their own virtual servers which are partitioned from Amazon's data servers. As a result these are some of the fastest and most reliable servers you can use. Other crucial services that you will probably use are S3 (a storage service), Route 53 (A DNS management service) and Cloudfront (a CDN). You need only use Route 53 and EC2 to get started, but I recommend becoming very familiar with these four services and the many other products that AWS offers. A basic knowledge of Unix, SSH, and DNS is requisite to follow along with my guide to aws.
Deploying with Github
But getting the server set up isn't the end of server deployment. Since you are already clearly an expert at Git by now why not use git to improve your server deployment process? Git is actually an excellent tool for this, but requires a slightly more advanced usage of git and understanding of shell scripts. Follow the guide.
Server Structure
When you have completed installation you should have the following architecture in /home/git:
├── staging.git
│ ├── hooks
│ │ ├── post-receive
│ │ └── pre-receive
├── production.git
│ ├── hooks
│ │ ├── post-receive
│ │ └── pre-receive
└── public
├── production
└── staging