A Super Sweet Linux-windows Development Environment Setup
Sat, Apr 16, 2011
Note: This is not about development based on windows platforms (.NET, etc) but using a windows machine as your primary operating system when doing web development.
Programmers and other geeks love to talk about the tools they use. I won't go into the languages, databases and what have you, but I want to explain a little bit about the setup I use to develop on and hopefully some of it can help someone out there facing the same issues.
My Windows "Stack"
Even though I use Windows as my primary operating system, I'm pretty dedicated to open source software and I primarily develop using PHP on nginx/apache and MySQL, amongst other newer tools.I don't care about the naysayers. I know I could probably fix something up using wine or another windows emulator and I know I use OSX instead (I even have it set up on VirtualBox for browser testing) - but I actually like windows. Sure, it's ugly. It's prone to viruses and what not, I know. But as I use Photoshop a lot, I also hobby around in music using Cubase and a lot of VST-based software, Windows is just nice for me.
Though I may use windows as my primary OS, I still spend a decent amount of time out of the windows ecosystem, lurking in a Linux shell.
This is my setup:
- Windows host machine - This is my primary operating system - I use both Windows 7 and Windows XP (laptop & desktop).
- Virtualbox 4.0.4 running Ubuntu Desktop - Actually, I hardly ever access the desktop, so I could also use the server version, but it's still nice to be able to view sites using FF/Chrome since there are different fonts on Gnome etc.. https://virtualbox.org/
- Amazon EC2 instances - I've just recently started using them. They're really useful for getting some weird setup going and testing with minimal cost. I'm also using a development environment on an EC2 instance now, which is proving to work out pretty nicely, though I host all my stuff on Linode (for applications) and Dreamhost (for more "regular" hosting tasks) https://aws.amazon.com/ec2/
- I use a tiny tool called RBTray to put the Virtualbox window and the guest OS in the system tray. It adds the ability for you to right click on the close-window-button (the X) on windows to put the application in a tray - it works for any applications. That way the extra virtual windows don't get in your way and you can focus clearly on what you're doing. https://rbtray.sourceforge.net/
- I ssh into the ubuntu guest os using PuTTy - Putty is my ssh client of choice when using windows - though I usually ssh from within the putty window to other hosts if I need to - all my keys are set up on a Virtualbox instance - I could just as well use the guest os window, but it's annoying that you can't alt-tab out of that window very easily. And putty is fast and flexible. https://www.chiark.greenend.org.uk/~sgtatham/putty/
- I use a tool called ExpanDrive to mount a drive on Windows. I usually mount my main projects folder ~/proj/ to the drive letter P: - That way I can access all the project files like they were windows files. I used to use VirtualBox's shared folders, but this setup is better since it's quicker to access a drive letter using windows' run dialog. It's not very cheap relative to the actual usefulness of it, but it's still a good product. It's not very fancy and the UI isn't very nice, but it's very stable. https://www.expandrive.com/
- I primarily use Notepad++ as my main text editor of choice. I used to use E-TextEditor but I found the reliance on CygWin to be annoying - like each tool I use to be as simple as possible. I miss a lot of E-TextEditor's features, but the most useful features were all reliant upon CygWin. https://notepad-plus-plus.org/
- I use Chrome for all web browsing, but when I'm doing development I like to use Firefox. The extensions I love are:
- Firebug - Everybody should be using this tool. Chrome sort of has a Firebug plugin built in as well in the developer console, but it's not as nice (and I believe Firebug is available for Chrome now). Debugging ajax requests, javascript, examining javascript objects, monitor all the networking that's going on within your page - this plugin just helps in so many ways. https://getfirebug.com/
- Web Developer toolbar extension. A lot of people use Firebug, but not as many use this extension. You can use this plugin to quickly find out a class/ID of an element or any of it's parents (without turning on firebug, so it's a bit faster) - It also allows you to easily resize your window, view all css in one page, all javascript in one page - disabling caching, disabling redirects, disabling javascript, etc. It just gives you much more control over what you're seeing. https://chrispederick.com/work/web-developer/
- ColorZilla - It's an eye dropper that allows you to sample the RGB value of any pixel on a page - it also has a nice color picker and shortcut menu to copy a color in a few formats. https://www.colorzilla.com/firefox/
- YSlow for Firebug - It's a plugin from yahoo that lets you know which parts of a website should be made faster, which ones are fine, etc. https://developer.yahoo.com/yslow/
- pixelperfect for Firebug - A great tool when you're doing HTML/CSS renditions of PSDs. It overlays an image of your choice fixed on top of the page, but you can control the opacity etc. It allows for you to see right away which things are in the right place and which ones are not etc. If you respect the designer's work, you should use this plugin. https://www.pixelperfectplugin.com/
- MeasureIt - A ruler or measurer for measuring the size of elements on a page. https://www.kevinfreitas.net/extensions/measureit/
- Git is my favorite source control and I have private git repos on github for the stuff I really don't want to miss. But most of my projects reside locally. I don't actually use the windows version, I just use it on linux, so it's always available in a package manager. If you want to learn more about source control using git, I would advice you to visit: https://gitimmersion.com/
- Dropbox plays a big role in my setup. I try to not be reliant upon any single machine - so if a hard drive crashes, I will still have all my data and my configuration etc. That's why I store configuration files in dropbox and make symbolic links to them. https://www.dropbox.com/