Becoming a Web Developer – First steps.

16 Feb 2017

Over the last few months I have utilised the allocated 10% training time to start the transition from Desktop GUI engineer to a hopefully Full Stack Web developer.

While a loop is a loop and an If statement is an If statement, the basic constructs of programming remains the same whatever technology you use, albeit syntactically different. And whilst slogging through tedious Pluralsight videos of basics for HTML, CSS, Javascript, Bootratrapper etc. is a necessary evil to lay down a good basic foundation for the transition process and very helpful, it does not really give you the full picture of a complete Web architecture, how to start a new project, design aspects, planning, and the different aspects of hosting, deploying etc. - which requires a bit of a paradigm shift from the desktop model.

There are several other training resources available, often references to alternative resources are given in the different video courses on Pluralsight, and my favourite by far for now is MDN. Not only does it give you very good guidelines on how to get started – from the beginning… for both the front end and server side, but it also gives helpful advice on structure, layout and useful tools to use and where to find them, and various other hints and tips that could make you a start web developer. And the training material is very well structured, easy to navigate between different topics and follow at any pace.

From a front end development side, the material I have learned so far is easily relatable to my existing knowledge and experience in C# and WPF. The HTML fundamentals course was useful to revisit an ancient skill which I have not utilised for many years. And though the constructs are different, the syntax and arrangement is not that different from WPF, the DOM of an HTML page also has a hierarchical layout similar to any WPF Window or usercontrol, though more limited in your basic HTML, a problem solved in the more advanced HTML5 – a topic I still need to explore in more detail.

When it comes to styling, again there are several similarities which I learnt from the CSS introductory course. I find the CSS way of styling more concise, and easier to target specific items but also apply blanket styles. But when it comes to inheritance it was easy to pick up the hierarchy, from most specific to general styles. Similarly to WPF, when there are conflicting styles, or a hierarchy of styles, it’s the last one, or the one closest to the control that will be used. In WPF this also applies to Triggers etc.

Bootstrap makes managing the layout and easy and hassle free. The beginner course to for Bootstrap 3 was very useful to learn about the different layout patterns and how to apply them, not just for Web but also mobile. It still requires a lot of customization and workaround to get Bootstrap together with CSS and HTML and javascript to get what you want from it especially for a full blown web application, but with the help of readymade themes available i.e at WrapBootstrap etc., you can have your application up and running to your customer’s satisfaction in a relatively short time without needing the expertise of a talented graphic designer.

JavaScript is at the heart of it all, and though without it you can easily create and publish your very first website, for real web application development it will be necessary to develop a deep knowledge of JavaScript. The Basics of Programming with JavaScript will take you from a complete beginner (without even prior development knowledge) to a Hello World level. And though not nearly enough to start developing high end web applications it’s a good start. Having free access to the book written by the course instructor where you will get an in-depth experience of JavaScript is useful, and can be followed at any pace.

The journey has just begun, it’s a marathon, not a sprint, but the results should be evident in the quality applications we aim to deliver in the not so distant future.