Web App Developer Resources
A few friends and acquaintances have asked me for some pointers and resources for learning how to become a web app developer. Since this has started to become a rather frequent request, I thought I'd share some thoughts here. I'll probably update the links as I come across more, or decide I don't like some of the ones I have. I'm pretty picky about where I send people, so expect changes and/or additions.
Being a Software Developer
There is more to creating Web sites and applications than just drawing them. The creative vision may, and most likely, not originate from the developer who brings it to life. It's our job, as developers, to take an idea and build it. Many times, the vision brought before us is just that: an idea. We have to take it and architect the structures and logic, to turn the idea into reality.
Under the pretty layer of the final product is a collection of technologies and languages that, when brought together, make some serious awesome. One cannot compose a fugue without understanding scales and chords. A poet cannot create a sonnet without knowing syntax. We cannot develop an application or Web site without at least some basic fundamentals.
First and foremost, I think you should have a very good grasp of symbolism. If you cannot think abstractly, or apply symbolic scenarios then this will be a fairly complicated venture. Programming is chock full of text that symbolizes structures, instruction and math. A background in mathematics is highly recommended but it is not required.
I would also recommend knowing how the physical components you intend to interact with work. Such as the processors, memory, storage, and the network stack down to the physical layer. Not required but makes life easier, in my opinion. Don't let it deter you.
There are many elements available but most are left unused because for the fact that we use CSS to define meaning and presentation. Beyond the obligatory doc-type, root, title, meta, link, style, script and body tags, the vast majority of web application user interfaces almost exclusively use: div, span, ol, ul, li, img and a tags.
There are a lot of tutorials over HTML and making static web pages. Making WebApps depends on the foundations of that knowledge, though Web Applications are dynamic and have different design constraints. Keep that in mind and always think for yourself.
Remember: HTML is XML. Treat it as such. Do not mix presentation with data/content. If you are using formatting and presentational HTML tags (such as font, br, p, b, i, s, u, strong etc) you are doing it wrong — or at least making it too hard. With CSS, any element can look/be anything.
CSS is what you will use to make it pretty. It's crucial to know and master this. Web App User Interfaces that don't fully utilize this will suffer. There are even some behaviors and interactions that are nothing but CSS rules.
Note: Most of the information on the w3schools site is correct, but there have been very public errors from time to time. Any resource could have errors. If you try something and it doesn't work, cross check it. I personally love Stack Overflow (and all related stack sites) as well as QuirksMode.org - a great cross-browser compatibility resource.
Sep 22 2015: caniuse.com has become my goto resource for cross-browser data.
Generaly Awesome Links: