Front end web development involves many different technologies, and the landscape is constantly changing. In this course you will learn the basics of all of the different aspects of front end web development, and how to hone and keep your skills up to date.
Joe has been a web developer for the last 13 of his 16+ years as a professional developer. He has specialized in front end and middle tier development . Although his greatest love is writing code, he also enjoys teaching and speaking about code.
Learning and Solving Problems Hello, I'm Joe Eames. In this module, we're going to look at different ways to learn about front-end technologies, try out solutions, and solve problems that you may have. We'll start this module by learning about the Mozilla Developer Network, a website that should be a go-to resource for any web developer. Then, we'll look at the browser console and how to use it to try out things. After that, we'll look at four different online coding utilities, JSFiddle, JSBin, CodePen and Plunker. These utilities will enable you to try out more complex problems than a console will but will also keep you from having to worry about dealing with files in your hard drive and eliminate the time it takes to set up a new project in your favorite code editor. Finally, we'll talk about staying up to date with front-end web technologies.
HTTP and Interacting with the Server Hello, I'm Joe Eames. In this module we're going to take a look at HTTP and how we interact with the server. Front-end programming almost never relies solely on the client. Communication with the server, in one form or another is almost always a part of building a front-end solution. Our applications receive their initial data and display from the server, and operate based on that. At some point we will need to send data back to the server, either for persistence or as part of a request for more data or display information. This module will look at some important aspects of that communication. We will cover four areas that every front-end developer should have a reasonable understanding of regardless of the nature of their application and which third party libraries they use. First is the basics of the HTTP protocol itself. In this section we'll discuss some important concepts to understand about how HTTP works. After that we'll look at the XHR object which allows us to make AJAX calls and is a critical piece of the functionality that we have come to expect from modern web applications. Next we'll look at JSON. JSON is the de facto communication format for front-end development. Other formats can certainly be used, and occasionally have to be used, such as XML. But in general, JSON is the preferred format. We'll look at why that is and cover some commonly misunderstood points about it. And lastly, we'll look at the page request life cycle, to make sure that we understand how a browser processes a page. As this is important in many aspects of maintenance and performance in a web application.
The Browser Hi, I'm Joe Eames. In this module, we will be looking at the browser which is the runtime environment of our applications. As the the track is to the race car driver, so is the browser to the front end developer. The browser is where our code executes and it is the rendering engine which determines how your HTML and CSS are displayed. Understanding this environment and how it enables or limits your development, maintenance and the features of your application can be critical. In this module, we will start by looking at browser capabilities and have different browsers limit what we can do and discuss this as not as a limitation to be considered but also a constantly moving target. Then we'll look at browser development tools and how to best take advantage of the browsers we are using in our development. Finally, we will look at multiple browser testing and how to leverage different tools to give us increased confidence in the applications we build.
Performance Hi, I'm Joe Eames. In this module we're going to be learning about the basics of performance with web front ends. We'll start by looking at where to place our style and script tags in our HTML page and why it matters where they go. We'll also look at the use of content delivery networks and the benefits they have on performance. After that, we'll talk about minifying our code and how and why to do it. And lastly, we'll look at concatenation, what that is and why we should do it.