Wakefly BlogThe Skills Needed to be a Web Developer Part One

I started out thinking that this would be a guide to help someone break into the field of Web Development, but I think much of what is here can also be used by existing web developers to further hone their skills. This is also a good carry on from my previous post about Keeping Your Web Development Skills Current.

Rather than focusing on how to stay current, here are the key skills to possess to be a successful Web Developer, Part one.

HTML/HTML5

Hypertext Markup Language simply referred to as HTML is the core to displaying text and laying out content on a page, whether it is simple text, links, images, form elements, videos, etc. Just as you would mark up your text in a word processor document, HTML enables you to add limited formatting to your text (bold, italic, headers/titles, lists, etc.).

Having a solid understanding of HTML is important as you will be working directly with this markup when creating any page for a website.

CSS

In the early days for web development, we only had HTML to format our text and to layout, our pages, often resorting to breaking the page out into tables, rows and columns. Tables were (and still are) great for displaying tabulated data, but for laying out complex page designs, they were a mess, unwieldy and often prone to errors – back then it would not be uncommon to have nested tables within table cells.

Thankfully along came CSS (Cascading Style Sheets) to help up separate out our content (HTML) from formatting and styling. CSS allows us to simplify the page markup, using classes and styles referenced, ideally, from a separate file and apply specific styles from the CSS sheet to each element on a page.

CSS not only allows you to stylize your content (font, font size, weight/bold, italic, etc) but it also allows us to control the layout of our page. Gone is the practice of using tables, now we can create (in our HTML markup) regions on the page and with CSS control where it will appear and how it will react to different dynamic content.

Most importantly, especially recently, CSS allows us to tell a website how it is to react to different screen & windows sizes so the site works seamlessly across devices from the desktop to your mobile phone.

JavaScript

HTML and CSS allow us to create a webpage, add content to it and control how it will look, JavaScript allows us to make our web page(s) work as a program unto its self, leveraging the power of the browser as its host.

JavaScript in it simplest form can be used to pre-validate a form field but JavaScript as a programming language can be used to bring full interaction to our pages. It brings desktop program behavior and performance to our webpage enabling us to load content on the fly without having to post back to the server, eliminating the need to refresh the screen. It also completes and submits forms without us having to wait for the next screen to load – this is known as a single page web application.

JavaScript is very powerful and can be daunting to learn, especially since all browsers are different and will read your code differently. Luckily, there are a plethora of great libraries that abstract away the differences in browsers that allow us to write code that will function the same on all browsers or degrade gracefully. jQuery is probably the most well known of these libraries. There are also many great JavaScript frameworks that can be leveraged to make your page interactive, dynamic and easier to create, such as AngularJS.

Whether leveraging a library like jQuery or a framework like AngularJS, JavaScript allows us to interface with data from disparate systems, some data may come from our own back end database(s) and other data may come from other sources and websites, we can then manipulate that data and display it how we like all within the browser using JavaScript.

Having a strong understanding of JavaScript is going to make working with one of the great libraries or frameworks much easier and enable to you troubleshoot issues more effectively.

SQL

Structured Query Language (SQL) is the language used for storing, retrieving and manipulating data in a relational database management system (RDBMS), there are also NoSQL databases but that is a topic for another time

With HTML, CSS and JavaScript we can create amazing dynamic pages, but we need to get the content from someplace and store what we collect from our users. This is where SQL comes in and why a web developer needs to have a good understanding of the core concepts and schema (design) of the database(s) they are using.

Some developers are not fans of SQL and its syntax and so ORM’s (Object-relational Mapping) have been created to help bridge the divide between programming (especially Object-Oriented Programming) and the data, effectively giving the programmer a familiar syntax to the data that they need.

However, one downside to ORM’s is often inefficiencies, especially when working with large datasets. Having a sound understanding of the key elements of SQL will help you decide when and where an ORM can be efficiently used and when (especially with more complex data) they should be avoided.

So far I have talked about the four main technologies used to create a dynamic, content-rich and authentically pleasing web page or site. HTML, CSS, and JavaScript are probably the first 3 technologies that a Web Developer would think of first as they are there daily bread and butter, but there are other languages, frameworks and tools that a Web Developer should be well versed in and I will cover those in my next post.