Mobile to web - where to start?

Discussions
#1

My development origins are actually with the web - coding straight HTML and Javascript in the late 90’s - but things are quite different these days. It seems that to be a modern web developer, you really need to be a polyglot. Many different languages, frameworks, tools - from the perspective of a relative newcomer, it’s fairly daunting.

I’ve been out of the web space for a while - still writing code, but on the hardware/embedded side of things mostly in C/C++ - which I can tell you is a completely different world. As a hobby, I picked up mobile stuff - primarily Objective-C and Cocoa Touch/UIKit, etc for iOS (Cocos2D for games). Getting started with that, I found an abundance of information, tutorials, etc readily available online. The barrier to entry is a compiler and a target device. Debugging is as simple as setting a breakpoint. Xcode/Visual Studio provide things like autocomplete and real-time syntax error tracking.

So I ask - where does a competant developer start to make the jump into web development? Are there any resources you can recommend that aren’t either directed at complete coding newcomers or seasoned veterans? Any tools/IDEs you can recommend that aren’t named VM?

Thanks.

1 Like
#2

I can recommend the JetBrains IDEs, they’ve got one for all the main languages you’d be interested in (Ruby, Python, PHP, JS, Java) and they work a treat. The JS support especially is great, the autocomplete is pretty solid (although far better if you annotate your code.)

Seems like the main choices I hear about in terms of server side are:

  • Rails (of course)
  • Laravel (php)
  • Express (Node gets addictive… at first I couldn’t understand the fuss, it’s hard to use anything else now).

I’d say you could select either Rails or Laravel and be happy. Express/Node - well - how much do you like JS?

Front end is where it gets much, much harder. It took me only about a year to work out what I should use :smile:

I’m not aware of any good resources to help you make this selection, actually. FWIW:

  • I used BackboneJS for about a year. I wouldn’t recommend it for anything major, gets really hard to keep everything under control.
  • Now using AngularJS - it’s really good, sometimes very hard to wrap your head around. Unlike with Backbone, where I felt like I had a mess with no hints on how to fix it, the longer I use Angular the tidier I’m able to make my code. Occasionally, it’s been incredibly painful, but the pain is usually worth it in the end.
  • Ember & Knockout are in my blind spot. There are people as passionate about Ember/Knockout as Angular, so - grain of salt.
  • I also use BreezeJS to handle models client side. It provides a lot of functionality, but it’s written from a .Net perspective, so it can be a bit awkward and sometimes feels bloated. Plus its more difficult to use if you’re not using .Net, and their support model is weird (found a bug? Great! There’s no way to raise an issue unless you pay us money!) Still, despite all that, it has no rival.

If you do use Angular, then egghead.io has great intro videos. Master Web Application Development with Angular JS is good once you’re a little further along, but it’s already feeling a little outdated, such is the pace of development for Angular. Still, lots of great advice.

In terms of tools, for front end, you’ll want to use:

  • Check out Yeoman, which will point you towards:
  • Bower for dependency management
  • Grunt for build
  • SASS/Stylus for CSS (I like Stylus, seems more forgiving, but SASS has more uptake.)
  • Jasmine or Mocha for unit testing (I use both, slight preference for Mocha)

The learning curve is steep, because there’s just so many tools and frameworks to choose from. I think the list above are pretty mainstream and have good communities. Actually integrating it all into your workflow & learning all the tools still takes a while.

Happy to help if you’ve got questions!

#3

I was in a similar situation myself: a back end dev wanting to learn web app dev.

You’ll need a learning project so you can really dig in. Do you have a project in mind already? If not, just make something up that interests you. For example, I wanted to learn how to implement voting and infinite scrolling a few years ago, so I did winningpic for fun.

Daniel’s recommendations are good ones. JetBrains stuff has worked well for me (I use WebStorm for js/css/html dev)

I think trying to use all the new whizbang js frameworks and tools right at first is overwhelming, and you won’t have a good understanding of why they’re necessary. One idea is to start really simple (it’s what I did). It’s not a fast path, but effective I think.

  • You have a project in mind.
  • Pick a server side tech based on the language you are comfortable with. I’d say node, rails, or .net. Whatever you think is easiest to get your html/css/js served out to the browser. Serve out some plain old, “dumb” html with alot of ids that you’ll hook up to later with jquery.
  • On the client, start with no javascript framework other than jquery. Concatenate html strings in your js code. Manually attach event handlers to those ids with jquery. Manually update the dom when your ajax calls finish. These are the easy ways to get started and simple to understand. Yes, they’re the wrong way. But, as your learning project grows, you’re going to experience the pains for real: “html in strings is a pain in the ass”, and “Crap, this sucks updating the dom from all these places manually… oops I forgot one!”

Now you’re in a position to really understand why you might need some of these modern frameworks. You’ll see why you want some kind of html templating and especially why you’ll want some kind of real view model support, so your dom can update by itself based on your model changes.

This is what happened to me and I’m not sure I’d really get it if someone would have just told me to use frameworks x, y, and z.

It turned out that the day job ended up using kendo where I first learned to use templates and models. Now I’m ready to go research the other solutions available and I think the choices will more understandable.

Hope that helps some,
Ryan

2 Likes
#4

I had a similar time, insisting on making all the basic mistakes myself, rather than learning from those who’ve gone ahead. If you can at all avoid that path, I’d recommend it. You’ll have plenty of opportunities to hone your skills without deliberately driving your app into the weeds.