This post is part 81 of 92 in the series Programming by Stealth

So far in our exploration of promises we’ve learned the core concept — a promise is an object that represents the status and/or result of an asynchronous task. Asynchronous tasks are inherently parallel, but we’ve learned how to use .then() and .catch() to create so-called promise chains, allowing promises to be executed in series. What we’ve not looked at yet is JavaScript’s native Promise class. This class is primarily used to create promises, but it also provides some useful utility functions. For now at least, we’re focusing on using promises rather than creating them, so we won’t be digging into how the Promise class’s contractor works. However, some of the utility functions are designed to help developers use promises in more powerful ways, so those will be our focus for this instalment. The most powerful of these utilities is Promise.all(), a function that allows us to create promise chains that perform some tasks in series, and others in parallel, allowing us to efficiently manage our asynchronous tasks.

You can download this instalment’s ZIP file here.

Read more

Tagged with:

This post is part 80 of 92 in the series Programming by Stealth

In the previous instalment we got our first introduction to the concept of promises in JavaScript. By the end of the instalment we’d learned how to use promises to deal with single asynchronous tasks, but not how to use promises to deal with multiple interdependent asynchronous tasks. That’s what we’ll be focusing on in this instalment. In the previous instalment we looked at the arguments to .then(), but we ignored its return value. It’s the return value from .then() that this instalment revolves around. That return value is the key to dealing with interdependent asynchronous tasks by combining multiple promises into so-called promise chains.

You can download this instalment’s ZIP file here.

Read more

Tagged with:

This post is part 79 of 92 in the series Programming by Stealth

Finally, after much teasing, we get our first taste of JavaScript Promises! This will just be a taste though, Promises are simultaneously really simple and really counter-intuitive. In many ways teaching promises reminds me a lot if teaching recursion — there is a tipping point where the concept goes from infuriatingly mind-bending to obvious and logical. Getting to that tipping point can be quite the challenge though.

So, we’re going to take it slow with promises. They will provide us with a way out of callback hell, but that path to salvation is unlikely to be obvious to you by the end of this instalment. It will take one or two more instalments until we get that far. All I can ask is that you please trust, me, how ever bumpy the journey gets, the destination is worth the struggle!

You can download this instalment’s ZIP file here.

Read more

Tagged with:

This post is part 78 of 92 in the series Programming by Stealth

For boring real-life reasons this instalment is a bit of an intermission. In the previous instalment we learned about so-called call-back hell, and were all set to learn how Javascript Promises would be our liberation, but that’s going to have to wait until next time. Promises are a very important concept, and I don’t want to rush them.

What we’re going to do in this instalment is focus entirely on my sample solution to the challenge set at the end of the previous instalment, which I’ve used as an opportunity to demonstrate two new tools to add to our programming tool belt — the micro-checking library is.js, and Bootstrap Popovers.

You can download this instalment’s ZIP file here.
Read more

Tagged with:

This post is part 77 of 92 in the series Programming by Stealth

My plans for this instalment were to quickly demonstrate so-called callback hell, and then move on to the solution, JavaScript Promises, but in light of some listener feedback I changed my plans a little. There was some confusion in the community about what callbacks really are, so, now seemed like an opportune moment to spend a little time re-familiarising ourselves with some callback basics. This sets things up for a bit of a teaser-ending because we’ll get as far as demonstrating callback hell, but not as far as using Promises to get back out of hell, that will have to wait until the following instalment!

You can download this instalment’s ZIP file here.

Read more

Tagged with:

This post is part 76 of 92 in the series Programming by Stealth

Having laid a very strong foundation in the previous instalment, we’re now ready to learn how to make HTTP requests with JavaScript using a technique known as AJAX.

We’ll start our journey into AJAX using more traditional JavaScript techniques, i.e. we’ll use callbacks to handle HTTP responses. As we’ll discover, this works very well for single AJAX requests, but the model really starts to get complicated when you have multiple inter-dependent requests. We won’t complicate things in this instalment though — we’ll start with just simple stand-alone requests this time.

You can download this instalment’s ZIP file here.

Read more

Tagged with:

This post is part 75 of 92 in the series Programming by Stealth

Having wrapped up our introduction to Mustache templates we’re going to spend the next few instalments learning about AJAX, a very powerful JavaScript technique for loading information from a given URL. In future instalments we’ll use this technique to load external templates and data for use with our Mustache templates.

AJAX is a mechanism for making a HTTP requests via JavaScript, so before we’re ready to learn about AJAX we need to take the time to learn about the HTTP protocol itself. Unless you understand the mechanics and the terminology of HTTP, AJAX-related documentation simply won’t make any sense.

Read more

Tagged with:

This post is part 74 of 92 in the series Programming by Stealth

In the previous instalment we got our first look at Mustache templates. In this instalment we’ll finish our look at this handy little third party library with a look at some of Mustache’s more advanced features. This will set us up perfectly to finally introduce AJAX into this series. This is an extremely common technique for fetching external resources with JavaScript. We’ll learn how to use AJAX to fetch both Mustache template strings and JSON data from URLs.

You can download this instalment’s ZIP file here.

Read more

Tagged with:

This post is part 73 of 92 in the series Programming by Stealth

In the previous instalment we took our first look at using templates with JavaScript to create cookie-cutter content like Toast notifications more easily than building them up piece-by-piece with jQuery. We started our exploration of the topic with a look at HTML5’s new <template> tag. In this instalment we’ll introduce a third-party templating tool, Mustache, and see how it can take our templates to the next level with concepts like conditional and looped sections.

You can download this instalment’s ZIP file here.

Read more

Tagged with:

This post is part 72 of 92 in the series Programming by Stealth

Templating is a very important concept to get to grips with as you move from web pages to web apps. You need the ability to design some generic HTML and then easily inject data into it. Every UI popup has a standard form, but the information being displayed changes each time its invoked. Similarly, apps often use some kind of card interface to show a collection of similar items, those are basically the same piece of HTML being re-used with different data over and over again. Clearly, you want to be able to easily create a template for one card, and then re-use it over and over again.

I’ve been trying to find the perfect moment to insert this topic into the series, and it struck me that Bootstrap Toasts would make a simple but informative example around which to introduce the topic. So far we’ve been generating toasts by building them up piece-by-piece with jQuery, starting with a tag, setting the text, setting some attributes and properties, adding some classes, appending tags together, and so on. The code works, but it’s cumbersome to write, and worse still, difficult to debug and maintain. Hopefully you’ve been thinking to yourself ‘there must be a better way?’, because if you have been, you’ll be very well motivated to ingest this instalment!

You can download this instalment’s ZIP file here.

Read more

Tagged with:

« go backkeep looking »