Here the web development environment I have setup on my laptop. It’s simply a run-through and short tutorial of the things I use for those of you who are interested in getting into the web development scene.
To start of, here’s a list of apps I use:
- WAMP – This basically has everything you need to get started; it also included some extensions you may find useful like XDebug.
- Node.js – I primarily use this as a command line interface for the tools I use like Bower and Grunt.
- Sublime Text – this is the best text editor I’ve used. It’s free to try but you can buy it if you like it.
Setting things up is pretty straight forward for WAMP and Node.js, configuration will be subjective so I’ll leave that to your personal preferences. Node.js already comes with npm. so you can jump right into installing Grunt and Bower via the Node.js CLI (Command Line Interface). You can also use npm in other development environments like Phonegap apps.
npm install -g bower npm install -g grunt
If you’re on Windows like me, you will need to install GIT for Windows to get Bower working properly. You can also use this tool to manage your repositories if you have any.
After installing git you will need to add the installation path to your PATH Environment Variable, which is typically located in C:Program Files (x86)Gitcmd. You may have to restart your system for the changes to take effect.
Once you’re done with that you can turn your attention to Sublime Text. I like the simplicity versatility and light foot print it has over other text editors. Like npm it also has a a package manager called Package Control you can use to add more functionality to it. You will need to enable this by opening the Sublime Text console (Control + `) and paste the code below. For detailed instructions you can visit the installation guide.
Sublime Text 3
import urllib.request,os,hashlib; h = '6f4c264a24d933ce70df5dedcf1dcaee' + 'ebe013ee18cced0ef93d5f746d80ef60'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)
Sublime Text 2
import urllib2,os,hashlib; h = '6f4c264a24d933ce70df5dedcf1dcaee' + 'ebe013ee18cced0ef93d5f746d80ef60'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler()) ); by = urllib2.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), 'wb' ).write(by) if dh == h else None; print('Error validating download (got %s instead of %s), please try manual install' % (dh, h) if dh != h else 'Please restart Sublime Text to finish installation')
After that you will see the Package Control menu by going to Preferences > Package Control.