background preloader

AngularJS and scope.$apply — Jim Hoskins

AngularJS and scope.$apply — Jim Hoskins
If you’ve written a non-trivial amount of code in AngularJS, you may have come across the $scope.$apply() method. On the surface, it may seem like just a method you call to get your bindings to update. But why does it exist? And when do you need to use it? To really understand when to use $apply, it’s good to know exactly why we need to use it, so let’s dive in! JavaScript is Turn Based The JavaScript code we write doesn’t all run in one go, instead it executes in turns. Instead, whenever there is a task that takes some amount of time, such as an Ajax request, waiting for a click event, or setting a timeout, we set up a callback function and finish our current turn. Let’s look at an example JavaScript file: var button = document.getElementById('clickMe'); function buttonClicked () { alert('the button was clicked'); } button.addEventListener('click', buttonClicked); function timerComplete () { alert('timer complete'); } setTimeout(timerComplete, 2000); How do we update bindings? $scope.

node-inspector/node-inspector jkrems/bugger How to build and test your Rest API with Node.js, Express and Mocha | thewayofcode If you need to build an API, you want it done quickly and simply and you love JavaScript, then this article is for you! I’m going to show a simple, quick and effective way to build and unit test your API and your routes, using Node.js, Express and a few amazing test libraries: Mocha, SuperTest and should.js that integrate very well together in a natural fashion. The API style is Rest, that is it leverages URLs and HTTP verbs, but I won’t go much into details in this tutorial. If you ever used technologies such as WCF, you will be amazed at how much quicker it is to build your API with Node, there’s virtually no machinery to put in place, no service references to update, no WSDL… it’s pretty much just logic to implement! From words to code: A nice and free dev environment where to start coding is cloud9 ( as it offers everything you need and maybe more: a text editor with syntax highlighting, a Node.js environment, a debugger (!) config.js routes.js server.js index.js $ mocha

DevTools Extensions For Web App Developers The past year has seen many leaps made to improve developer productivity through better tooling. We're paying increasing attention to our workflow and many of us have spent time optimising our usage of tools like Grunt, Bower, Yeoman and the terminal. Another important area worth spending time on is your debugging workflow – if you're like me, this starts with the Chrome DevTools. When building an application with a specific framework or language abstraction, there's actually some additional tooling available to you in the form of recent DevTools extensions. In this post, I'll share a quick summary of the latest developments in this area, ranging from the recent Ember extension Yehuda Katz presented at EmberCamp through to less well known extensions for Backbone and KnockoutJS developers. Note: Canary DevTools disables icons in the toolbar by default, but I've re-enabled them via the Settings cog to aid with visualisation. Ember Inspector Backbone DevTools Angular Batarang Thorax Inspector

Really simple file uploads with Express Static Version Few days ago I was working on a fairly typical web application and I faced the challenge of implementing a fairly typical web application feature - file uploads. It was the first time I was implementing file uploads with Node (and Express) and I did what anyone else would do - I googled it. Unfortunately all the articles / posts out there are either outdated, too complex or plain wrong. So I did the next most obvious thing - post a question on the mailing list. The upload form This is the most obvious part of the challenge. You will need a form in your browser for the file upload. form(action=" The form.action will point to a route that handles the file upload. Accessing the uploaded file If you're using recents versions of Node and Express, file uploads are a piece of cake. Okay, now let's justify the "piece of cake" claim. The file object contains the type, size and name properties for your server side validations. Saving the uploaded file That's all there is to it.

yeoman - Generate Angularjs app with latest unstable branch Geolocations Geolocations is a sample application that demonstrates how you can use Parse to display a list of items, store location data, and query for objects near a location. The source code for this application is available on GitHub. It is recommended that you download and open this project in Xcode to use as reference while reading this tutorial. 1. Geolocations Overview This section will cover the general architecture of the Geolocations sample app. 2. 3. 4. The Geolocations sample app will show a list of all the locations where the user has been. 1.1 Architecture Geolocations consists of three view controllers. When the user taps a row in the MasterViewController table view, the DetailViewController will be presented and the location will be visualized in a map view. The main view also has a loupe button that brings up our SearchViewController when tapped. 1.2 Storyboard All of these view controllers and their interactions are initially set up in a Storyboard called MainStoryboard. 2.1. 2.2.

Better CoffeeScript Testing With Mocha Recently, I’ve been doing a considerable amount of CoffeeScript work. One problem I ran into early-on was testing: I didn’t want to manually convert my CoffeeScript to JavaScript before I could test it. Instead, I wanted to test from CoffeeScript directly. How’d I end up doing it? Republished Tutorial Every few weeks, we revisit some of our reader's favorite posts from throughout the history of the site. You’ll need to have Node.js and Node Package Manager installed. Before we continue on, I'll point out that you need to have a decent knowledge of CoffeeScript for this tutorial; I won’t be explaining the bits and pieces here. Additionally, you’ll need to have Node.js and the Node Package Manager (npm) installed for this tutorial. We’ll be building the beginnings of a todo list application (cliché, I know). Why both Mocha and Chai? You can easily test asynchronous code.You can watch for especially slow tests.You can output the results in a number of different formats. And on, and on.

Related: