Asking a rhetorical question such as: “What skills do you need to be a good web developer?” is like asking the question: “What attributes do you need to be a good person?”. Ten people will give you twenty best answers to the question.
One of my roles at Microsoft was to be a “developer evangelist”; that is, to espouse Microsoft technologies as the best for any given purpose. By listing the following tools, I freely admit to my personal bias developed over several decades of web development work. I will also admit that I do not keep current and I’m positive that there are other, perhaps more current and/or better tools that every developer should have in their toolkit. However, the goal of this web site is not to give you a concrete list of tools or skills you will need; but instead, it’s to provide you with a cookbook of recipes that you can easily follow to get your started.
I strongly encourage you to read and understand the underlying technologies so you know their strengths and weaknesses.
So here is my incomplete list of technologies every beginning web developer will want to learn. Note that I will offer a quick start for each of these in future lessons. So let this be an introduction.
So now you are going to ask: “Hey Bruce, did you spell that correctly? Most “10 skills…web developer” sites say your primary skill is HTML and not HTTP. Is that a typo?”
Not a typo. As I mention in the sidebar above, it’s important to understand the background and internals of your application before you can write a great application.
You plan to develop this great web application, but you should start with: “how is the application and content served?” The answer for web apps is: HTTP or HTTPS.
What are some reasons to learn the protocol and what things might you focus on?
- You will want to debug your application but to do so, you must understand the protocol delivering the application.
- You want to make your application performant but you need to understand web caching (both client and server) and how it impacts your application.
- You should understand what a GET is; and then a POST and why you care as a developer.
- You should understand the communication pattern and why the protocol is stateless (and what that means).
- What are Host Headers and how are they handled?
- What is a cross-domain call and why do you care?
- What is content type and how does that apply to a developer?
I put the “S” in above since you will have special challenges when trying to debug web applications or services over an encrypted pipe. You must understand how HTTPS works in order to be able to debug these applications.
Domain Name Service – “DNS”
OK, about now you are probably thinking I’ve totally lost my mind – that it’s time for me to pull out the cane and take a long walk. DNS? Really? Really!
Again, I list these things and organize these lessons based on the pain I’ve experienced and see hundreds of web developer experience. My goal is to provide the tools and knowledge to help novice web developers ramp up more quickly.
Understanding the basics of DNS is a critical skill for web development because it’s such an integral part of the framework.
HTML – HyperText Markup Language
Well, it all started with SGML, or Standard Generalized Markup Language back in 1986. HTML, as was XML, is a document format derived from SGML. As this IBM article observed: “…HTML is an application of SGML, whereas XML is a subset of SGML”.
The thing a novice developer should focus on are the rules of the markup language. For example:
- How to open and close tags; e.g.: <myTag>stuff</myTag>;
- How tags are nested: <myTag><myInnerTag>stuff</myInnerTag></myTag>
- Remember that stuff in SGML, HTML, and XML are case-sensitive
- Understand attributes and how to use them
Although HTML started out as an SGML application, it has evolved away from SGML now with the advent of HTML5. The basics still apply; but there are non-SGML constructs and rules that are valid in HTML5.
Therefore, the developer should focus his attention on HTML5 and learn all the goodness it has to offer.
As I write this, Adobe announced that they were killing Flash. There are many reasons for this but I think the primary one is that HTML5 eliminates the needs for Flash (and all the terrible security issues it has had and continues to have).
I have to admit, I hated trying to learn Cascading Style Sheets or “CSS”. It didn’t make sense at first and I still have to refer to my cheat sheet from time to time. However, as the embedded debugging tools in the browsers have improved so that we can: a) identify the objects we want to look or act differently; and b) make changes right in the browser and see how they will look once implemented; I’ve come to really like CSS and the power it has.
We’ll later look at CSS and some tools to play with and learn; but for now, just accept that it’s the tool that delivers the exact “look and feel” for your web application.
- A text editor with a web browser can be your primary development tools. In other words, it doesn’t take much to get started.
- It’s a very forgiving language and you can make many rookie mistakes and things will still work.
- It runs just about everywhere.
- The vendors (Google, Microsoft, etc.) are constantly improving the compilers or interpreters and so you don’t have to worry much about your code or skills becoming obsolete. For example, here’s a snip about V8 from Google:
I just love the way Google will “opensource” their tools!!! Thank you G.
Back in the day, even old Microsoft would let you compile js into .NET code. Pretty cool (but not very useful).
Design Skills or Knowledge
OK, I admit it freely, I’m terrible at user-interface (“ui”) work. However, even as a grunt developer, we must have basic understandings of what makes a great user interface.
A terrible mistake that novice web developers often make are to mix and match colors, fonts, etc. Time spent reading up on basic best practices for good web design is time well spent. The best web sites are designed by graphic artists who then hand off the art work to the web developers. Their job is to implement the design using their skills.
A good way to learn good web design is to visit professional sites; that is, those designed by graphic artists and see how they look. How many colors? Fonts? Whitespace? Look at them on mobile and see how interactive they are there.
One thing I discovered early in my development career – people focus on what they can focus on.
This lesson summarized some of the technologies you will want to study before you start writing code. In future lessons, we’ll dig into each of these a bit; but first, we need to get our development environment up and running.