On my commute today I was listening to React Podcast with Michael Chan hosting, episode titled “Develop in the Cloud with Christina Holland.” Many tech podcasts I listen to are fantastic but often the subject matter is quite new to me and I tend to wish I could be looking things up as I listened or taking notes on things to check later, but driving doesn’t exactly cater to that behavior.
This podcast episode, however, had me nodding enthusiastically because it spoke about a topic that Christina gave a talk about at React Conf 2018: the cloud development process, and particularly React development in AWS Cloud9. I enjoyed the show thoroughly because I too have benefited from the beauty of developing in the cloud – in fact, AWS Cloud9 was really my true introduction to the cloud ecosystem. That’s right – it wasn’t EC2 or S3 or any other widely popular Amazon Web Service (although Cloud9 is backed by EC2.
What is AWS Cloud9?
Any person who has had significant restrictions in productivity because they could not access their development environment at key moments could probably benefit from Cloud9. Cloud9 began as a standalone cloud solution for developers that needed an IDE on-the-go; you can use the IDE on any machine that allows you to login to your AWS Console. For me, there were significant portions of time when I would have to wait until I was with my personal desktop before I could be productive with my software projects, which was one thing that pushed me towards cloud solutions. I stumbled on a Ruby course that suggested using Cloud9 to follow along with its tutorials, which I dutifully did. I soon discovered that this IDE supported not only Ruby but also a ton of other languages, like Java, PHP, Haskell, C++, Node.js, and especially relevant to this post, JavaScript and therefore React (plus even more). Within minutes, I was able to install create-react-app via Cloud9’s console and get rolling with my React learning vehicle, a weather app.
As you can see above, Cloud9 has an attractive coding environment as well as a way to preview your application as you work. As with localhost on your local development setups, this preview window will update as you make changes. If you don’t like the preview in your AWS Console, you can click that icon on the top right of the preview window to open it in your browser (a feature I often use, because who only needs a single code file displaying at any given moment?)
And like any great IDE, Cloud9 features direct access to your EC2 instance via a terminal at the bottom of the application (or wherever you tell it to go). This makes for especially productive work; any person who has developed with multitudes of terminal windows all over the place knows what I’m talking about. Terminal windows was one reason I added monitors to my own setup, but with Cloud9, you have them handy with tabs for as many as you need.
You can do pretty much anything you’d generally need to do in a terminal, most notably for me: installing npm packages, doing git pushes/pulls/etc., running create-react-app, and your typical fun bash-y things.
AWS Cloud9 Costs
You can use Cloud9 using one of Amazon’s free-tier EC2 instances (t2.micro), and if that’s the only free-tier product you’re using you’ll probably never go over your allotted monthly usage, but I recommend upgrading to t2.small if you aren’t too strapped for cash. You’re only charged while you’re using it and you get a huge performance boost. With t2.micro I was routinely running low on memory, a problem I haven’t had with t2.small. And as for the cost, I personally haven’t gone over $0.75 per month; I’d say that’s pretty good! (Disclaimer: I’m not doing all of my development on Cloud9, so don’t necessarily expect similar numbers if you use it, but I’ll bet it remains very reasonable). In fact, I’ve found AWS in general to be very reasonably in terms of price, not just its Cloud9 service.
What’s So Great About React in Cloud9?
That’s really a trick question. Honestly, there’s nothing particularly unique about developing React applications in Cloud9. Part of Cloud9’s beauty is that it delivers identical experiences regardless of the language or frameworks you’re choosing (so long as it is supported by the IDE, which statistically it probably is). As I said above, you can quickly install your npm modules, churn out some React components, push to your Git repository, and preview your application all in one window, which is pretty great. One thing I didn’t mention is that because the terminal is just your typical terminal, I was even able to deploy my app to Heroku with the Heroku CLI I installed onto it.
Limitations
Of course, AWS Cloud9 is not perfect. Being a cloud service, your experience is limited by your internet connection. Most of my experience has been pretty smooth, but I have had times where there was some latency while typing out terminal commands. I haven’t experienced anything that made it impossible to work, but your performance demands may be different than mine.
One other area of concern is that you can’t drag a code window out to a different browser window; you’d have to open up a new one manually. You can split the pane and have multiple windows open, of course, but depending on the monitor you’re using, that may not be sufficient. I like to have code open on multiple screens if I have them available. I did try just duplicating the tab but for some reason that felt wrong; that could just be me.
Finally, Cloud9’s attractiveness is in its convenience factor. It isn’t specialized for any particular language. It isn’t going to serve your Java development better than IntelliJ or Eclipse; it’s not going to offer you the same customization features as Atom or Sublime Text; it will never replace Jupyter Notebooks or PyCharm for Python developers. What it will do is give you an avenue of productivity on machines that may otherwise not provide it due to local software limitations.
Conclusion
Developing with AWS Cloud9 has been a delight and I definitely recommend any developer who hasn’t tried it to do so. Pick up a t2.micro free instance a try out some of the features, write a couple Hello Worlds, use the terminal; I don’t think you’ll regret giving it a shot! Thanks to React Podcast, Michael Chan, and Christina Holland for inspiring this blog post.