Dropbox For Developers

Dropbox has become an indispensable tool for almost everything I do on my computer as well as my mobile devices. Dropbox is also one of the most powerful dev tools I use. One of the best features of using Dropbox is the ability to sync your code projects across multiple computers. In the following post, I will describe my Dropbox setup and go through the pros and cons of using Dropbox to keep all your projects in sync.

First off, let’s talk about my computer setup. I have three main computers that I use on a daily basis: my desktop (27" iMac), my laptop (11" MacBook Air) and my work computer (15" MacBook Pro). On these computers I am constantly switching between OS X and Windows 7. In addition to these three computers, I also have several different phones, that I use personally as well as for testing, and my iPad. Finally, I have a Windows 8 tablet, which I also do development and testing on. As you can see, I have a lot of computers I use daily, and trying to keep everything in sync would be a daunting task if it wasn’t for Dropbox.

After realizing how valuable Dropbox was to my workflow, I upgraded to the Pro account to get 50 gigs of space.

Also, between getting other people to sign up to gain free referral space and taking advantage of a few other offers, I was able to end up with 62 GB, which is more than enough for any dev you may be trying to do. If you haven't signed up for Dropbox yet, you can use my referral link to get extra space when you sign up.

The biggest limitation for me is the fact that my MacBook Air can only hold so much due to its small SSD drive space. While you can limit which folders sync on your computer, I have noticed that, for the most part, my development files don’t take up that much space. You can probably just get by with the 2 GB of free space you get when signing up.

Once I was signed up and installed the software I just used the default folder location. I set up three main directories inside the Dropbox folder:

• design – This is where I keep all my design work for my project, ideas I am sketching out and space to store images I like from the web for inspiration.
• development – This is where I do all my development from. I’ll talk about this folder structure next.
• writing – This is where I keep all my writing. Everything from posts like these (if I am not using Google Docs) to ideas I have, game design docs and even the book I wrote.

I also have a lot of other folders in Dropbox since I keep a lot of my files in there, but these are the main development folders I have set up.

Let’s talk about how I set up my development directory. Here is a screenshot:

As you can see, I work on a lot of different platforms. Here are the most important folders to note:

• sdks – This is where I keep installers, code libraries such as APIs for other services and any dependencies I would need to install to get my development environment to work on another computer.
• tools – These are installers for tools or additional apps I would need to install on other computers.
• web – This is the root of my web server for any HTML, PHP, JS, etc. work. Basically, anything that needs to run on a server, with the exception of node.js, which has its own folder, is hosted from here.

Outside of these core folders, I simply create a new folder named after the platform I’ll be working on. The goal of my development folder in Dropbox is to have quick access to all my projects on any computer as well as all the SDKs and tools I would need to set up a new computer if I had to.

From here I can work directly from any of these folders in my IDE of choice. I’ve tested lots of these IDEs and not had any problems moving between different computers or across each OS. Here is a list of some of the editors I use:

• IntelliJ – For Android/Java dev.
• Web/PHPStorm – For HTML, JavaScript and PHP dev.
• Sublime Text – An excellent lightweight code editor.
• Visual Studio – For Windows Phone 7 and Windows 8 dev.
• Xcode – For iOS development.

As I have mentioned, I’ve not had a single problem working in any of the above IDEs from within my Dropbox folders. The only thing to be careful of is to make sure your IDE saves its project resource files within the project. You may have noticed directories such as .idea or .eclipse in the root of your project like this:

As long as your editor keeps its settings in with your project, even if the folder is invisible, Dropbox still syncs them.

You may also notice from the above screenshot that if you are using Git, or even SVN/CVS, for version control those directories are also part of your project folder, so Dropbox can keep those in sync as well. This is great because I always have the most up-to-date version of my code, regardless if I remembered to check the code in before I left for work or wherever I need access to it. Then I can commit my changes when I am ready from any computer. This solves one of my biggest issues with multi-computer development, which is keeping my version control commits in sync.

Next up, I want to talk about how I handle running local servers and testing from my web folder. On the Mac I use MAMP and on windows I use XAMP, which are great one-click Apache, PHP and MySQL solutions. Normally you would use the default web server directory on your computer to host your files. I have actually set my Apache’s root to my Dropbox’s development folder’s root like so:

Now you may be thinking, why not set this to my web directory in my development folder? If you remember back to how I break up my dev projects by platform, I tend to keep my Impact game dev in its own folder along with any Flash projects or, if I am doing PhoneGap in Xcode, I can launch any web content from within my entire dev directory from the browser. So when I launch MAMP, I am automatically taken to my localhost, which exposes all my projects:

So now my entire dev workspace is navigable via the browser, and when I navigate to a project with web content in it I can test it in the browser. This is critical for doing any kind of PhoneGap or Windows 8 dev where the entire project is all done in HTML/JS, and you can use your computer’s browser to debug as you work much faster than trying to recompile the app on the simulator or device each build.

Here is an example PhoneGap app I was working on called Room112 and wrote about on my site here.

As you can see, I keep all my PhoneGap code in www/ and, if I open the directory, I can test it out right in the browser:

When I am done testing, I simply go into Xcode and compile it to the simulator or my device. When I need to debug I do it all in the browser. I have found this to be one of the best workflows around and, to top it off, all my work is synced thanks to Dropbox.

Now, before I talk about some of the limitations of Dropbox, I want to talk about how I use my development directory to quickly install and share Android APKs to all my devices. Since I do all my Android work in my Dropbox directory, and Android allows you to install APKs from the Android Dropbox app, it’s incredibly easy to immediately test new builds of your application without having to connect your device. Simply install the Android Dropbox app on your phone, navigate to your Android project folder and when you compile a new APK it is right there waiting for you:

This is also helpful if you are doing a lot of AIR for Android development. I even set up my Ant builds to generate output folders for each platform and can share that folder with other people who want to test my game so they always have the latest build:

I have covered a lot of advantages of using Dropbox, but I want to cover a few of the issues I have had and some mistakes to avoid as you get used to this new workflow. Here are a few things to keep in mind:

• While I have never had any issues with missing files or sync conflicts, this setup is not ideal if there is more than one developer working on a project at a time.
• I would also avoid sharing a folder you are actively doing development in since the people you share it with have access to all your files but have to download every change you make. If you want to share compiled apps like APKs or IPAs for testing, just share the output folder for these themselves and only push out updates when you are sure they are stable.
• Dropbox is not a backup solution or version control replacement. Once you delete stuff it’s usually gone forever. You can pay for backup history but IDEs do lots of different non-destructive and destructive modifications to files and directories, so it may be a mess to try and sift back through any changes via Dropbox. Always use version control on top of your Dropbox solutions.
• When conflicts do arise, Dropbox is smart enough to give the files the same name, but one will have a conflict identifier added to the filename so you can tell there was an issue. If you feel like some file has not correctly updated, make sure you check the folder in the OS and not in your IDE. Most project-based IDEs like Visual Studio and Xcode don’t automatically add new files unless you manually include them in the project, so always check in the folder itself first.
• Remember that in order to keep your projects in sync Dropbox needs time to download all the changes when you move to a new computer. Don’t leave your IDEs open or in sleep mode on multiple computers then turn them on expecting all your changes to be there. Always make sure you give yourself enough time to download the latest files before doing any edits.
• Some IDEs such as WebStorm do not store global settings like servers in the project folder. I have had issues moving from computer to computer and WebStorm not being able to remember the default server for uploading web files. This is usually an easy fix but frustrating if you move around computers a lot.
• Pay attention to file paths, especially when doing cross-platform development like moving from Mac to PC because if your project has hard coded library dependencies there will be corruptions in your project. In IntelliJ, I tend to add Mac and PC paths to the project settings so if one fails it can still generally find the right library for the OS it is on. I also just group my project dependencies in the project itself since most IDEs use relative paths for files inside the project and that cuts down on most of the file system conflicts.

While this may have been a long list of things to watch out for, and not a complete list by any means, I have found Dropbox for my development to be an invaluable tool that has mostly solved my biggest problem of keeping my projects in sync across all my computers and devices. I would make sure you start small if you want to give this a test and work your way up. I have done a lot of trial and error perfecting my workflow and, when something does blow up, it’s not fun. As long as you go in knowing that something could happen if you are not careful you will do fine. Plus, there is nothing more gratifying than being able to turn on a computer, wait for all your changes to sync then pick up coding right where you left off. In some IDEs even your last open window and all your code history is saved into the project and synced automatically by Dropbox, which is truly amazing that one time you need to remember what you did at 1AM on the computer you left at home and you are in another state, which happens to me more times than I care to talk about.