Long ago, we briefly brushed upon the topic of what has made jQuery such a valuable part of the web developer’s toolset for such a long time – namely, a cleaner interface for interacting with the DOM, and the $.ajax abstraction over XMLHttpRequest.
These days, I would go a step farther and discuss how it has positively influenced browser APIs. jQuery offered a way to find elements using their css selectors, and this eventually gave us document.querySelector and document.querySelectorAll. More recently, browser developers have taken another page from jQuery’s playbook and introduced a new, Promise-based API for making asynchronous requests, and so much more – Fetch.
This tutorial is Part 2 in a multi-part tutorial exploring interactive SVG charts. We will pick up where we left off in Part 1 by adding tool-tips to each data point in the chart which become activated when a mouse hovers over a point. (more…)
This is the first of a series of tutorials on using Bootstrap radio buttons in the wild to filter real datasets in concert with other commonly-used UI components like DataTables and jQuery UI.
Part 1: Converting a classic input radio to the Bootstrap label
Filtering tables of data is the central task of many a business web-app. DataTables are searchable by default, but records often beg to be batch-filtered into several status modes like: current | archived | all.
Bootstrap Radio Buttons provide a nice, clean look, but many developers shy away from them due to unfamiliarity with their CSS label-based class manipulation and/or compatibility issues with other component libraries like jQuery UI.
Bootstrap checkbox and radiobtn-groups work ‘out of the box’, but the simple activation of a default button decouples active button highlighting from the input tag checked state. In this case, the active label class must be handled manually, but the docs don’t explain how, so a stack-overflow of posts for dev-help ensues. (more…)
This tutorial is a single-page app requiring a modern browser (tested on recent chrome, firefox, IE). Because this tutorial explores zooming, you will need to be using a computer with a wheel mouse. This tutorial can be run live in your browser at the wonderful bl.ocks.org site. If so inclined, you can also clone the tutorial from gist and run it locally on your computer.
Regardless of how you view the tutorial, you can leave comments about it here.
You’ve built the web application of the century, and the users have rightly flooded to it. Cat pictures for everyone!
But alas, while your users indulge in cat-induced bliss, the cold hard reality of server costs cannot help but harsh your mellow. What is to be done?
Maybe, you could get the users to… pay for access to your incredible web application in all its multivarious splendour?
Braintree is a payment processor (now a subsidiary of PayPal), which boasts of a "simple, robust way to accept payments", and with features like a drop-in payment ui and libraries for various programming languages enabling fairly easy integration, is a solid choice for accepting payments via credit card or PayPal.
While Braintree’s developer documentation is blessedly detailed, it’s possessed of a potentially confusing bevy of options, and its various implementation examples are spread out amongst a number of pages and platforms. So today, rather than reiterate any particular section of the docs, we’re going to take a look at an end-to-end example of a specific, straightforward scenario – accepting and processing a one-time, immediately settled payment in a web application.