Set up your Local Battleground

There is no such thing as always online. As any seasoned developer will second, domesticated or not, you need a local environment to develop. The bigger and more versatile your involvement in team-based projects, the safer you'll feel with your own little corner where you can trail and error without hordes of angry Mongols on horses boo-ing you.

With *nix as the dominant webserver flavouring, we're going to assume you own a Mac. An Ubuntu VM (set up) is highly advised if you are stuck with a Windows machine.

Choose your pick, based on the projects you're planning to explore.

The Basics

Your OSX install comes packed with quite an extensive set of developer-friendly tools and libraries. Therefore, getting the basics up is a matter of minutes.

Get HomeBrew

If you haven't done so, install Brew right away.
We've covered this in a little separate post already, head there.

Download Github

If you don't actively use one of the smaller versioning services, you'll probably end up with Github. Good choice too.
Github has an awesome software client for managing your repositories locally.

Download Github for Mac

Front-end

The days of simple html pages are long behind us, sir. For most of our front-end apps, we distribute static packages, with dependency configuration and branched repo versioning. If this sounds scary, don't worry, its like rainbows and unicorns.

Install Node.js

Nodejs is basicly backend javascript. It’s lightweight and perfect for local builds of compile/distribution dependent projects. Since we’re taking this seriously, that’s just what we’ll do. Add Node.js and npm with brew:

brew install node

Install Grunt or Gulp

Grunt and Gulp are Task Runners, which will monitor, compress and compile the project. Grunt is a marvelous beast, Gulp a nimble sytar, both make you feel like you’re doing it for real. Install it with npm:

sudo npm install -g gulp grunt-cli (feel free to pick your favourite flavour)

Install Bower

Bower is the package manager we’ll be using in many projects. Additionally, most of the front-end frameworks come with a bower configuration.

npm install -g bower

Install Sass

Sass is a css extension language. It lets you nest, fragment, re-use, import and compile css code and files. While we're not using it in every project, you'll smell cupcakes and blow glitter out your working station when you do the first time.

sudo gem install sass

Install Foundation

If you need Foundation for your project, go along and install it already:

sudo gem install foundation

Install Ionic

We love to use the Ionic Framework wherever we can. More recently, we started using ngCordova alongside Ionic too. Both are easy to install:

npm install -g cordova ionic  
bower install ngCordova  

HTTP Server

You've probably used the Apache https server before. You can continue using it through-out all our tutorials, it even comes pre-installed on your Mac.

We however prefer Nginx, for it's smaller footprint and safety track record.

Nginx

We love Nginx for it's small footprint and refreshingly clear configuration files. There are 2 articles about Nginx installation on Cloudoki, made to work together as close as possible. One Nginx for OSX and one Nginx for Ubuntu.

Once you start toying around, it doesn't hurt to keep this article close: Nginx Pitfalls.

PHP coders

If you're part of the majority (php coders) - we understand. It's not you. Just grow up and learn some real language like Python when you have some time to spend.
In the meanwhile, let's install some requirements for Laravel (and Lumen) - our backend php frameworks of choice.

Composer

Start with installing Composer, the dependency manager for Laravel.

The quick way.

brew tap josegonzalez/homebrew-php  
brew install josegonzalez/php/composer  

If that doesn't work out for you, try the classic way.

curl -sS https://getcomposer.org/installer | php  
mv composer.phar /usr/local/bin/composer  

Add composer to your PATH. OSX has a neat solution for this, namely the /etc/paths file.

sudo nano /etc/paths  
~/.composer/vendor/bin

Restart Terminal and echo $PATH to verify.

Laravel 5

Laravel is a Symfony2 based php Framework, very capable of handling the API Routing and Business logic one typically needs for a 3 Layer service setup. While some might rightly point out that a light routing API could be better of with a feather-light Node framework, working on the same framework architecture for both API as worker level creates a more gentle learning curve for the average development team, certainly for new projects.

composer global require "laravel/installer=~1.1"  

The most common missing element is Mcrypt. Install it through HomeBrew.

brew install mcrypt  

If you used to have the Laravel 4.* package on your machine, you might run into an empty project folder on laravel new. Solve this by removing the old reference and restarting the terminal. You may additionally force composer by removing the package requirement, to re-install it.

sudo rm /usr/local/bin/laravel

# If error persists after restarting Terminal 
sudo nano ~/.composer/composer.json  
composer global update  
composer global require "laravel/installer=~1.1"  

Lumen

Lumen is the boiled down version of Laravel. Since both have the same origin, some architectures benefit from a Lumen API and Laravel BLM (worker) combo. You're basicly playing with the same toys.

composer global require "laravel/lumen-installer=~1.0"  

Make sure to check Mcrypt, as described in Laravel.


Updated August 19th 2015, added Gulp.

comments powered by Disqus