ENTRIES TAGGED "javascript"

What is that upside-down tree doing in my browser?

Start using JavaScript to create dynamic web pages by updating the DOM.

The secret to getting your web pages to do your bidding with code is to use JavaScript to manipulate the Document Object Model, or DOM. The DOM is an upside-down tree-like structure that the browser uses to represent your web page internally, and it’s by getting and setting values in the DOM that you can modify your web page in response to users doing things like clicking a button, moving the mouse, or dragging an element around.

Getting started with the DOM is easy once you understand how the browser translates your HTML into this internal structure made of objects. Once these objects are created, then you can manipulate them using a wide variety of properties and methods, to change the content of an element, to add a style to an element, or even remove an element from the page completely.

Read more…

Comment: 1
Four short links: 7 May 2014

Four short links: 7 May 2014

Internet Broadband, Open Radio, Excel Formulae in JS, and Block Chains

  1. Observations of an Internet MiddlemanFive of those congested peers are in the United States and one is in Europe. There are none in any other part of the world. All six are large Broadband consumer networks with a dominant or exclusive market share in their local market. In countries or markets where consumers have multiple Broadband choices (like the UK) there are no congested peers. Relevant as competition works for gigabit fibre to consumers.
  2. Open TXopen source firmware for RC radio transmitters. The firmware is highly configurable and brings much more features than found in traditional radios.
  3. formula.js — Excel formulae in Javascript. Waiting for someone to write a Apple 1 emulator in them.
  4. Minimum Viable Block ChainThe block chain is agnostic to any “currency”. In fact, it can (and will) be adapted to power many other use cases. As a result, it pays to understand the how and the why behind the “minimum viable block chain”.
Comment

Wait, where is my variable defined?

Learn JavaScript scope so you always know where your variables are defined

You may have noticed that Head First JavaScript Programming is released! Now that the book is done, we’ve got a few more Head First JavaScript Programming teasers for you. The book is aimed at those of you who are learning JavaScript from the ground up, and our goal with these teasers is to tease out a few characteristics of the language that might surprise you, trip you up, or that you might want to pay special attention to as you learn.

Whether you’re coming to JavaScript from another language, or you’re learning JavaScript as your first language, the way scope works — that is, when and where your variables are defined — might surprise you. Scope in JavaScript isn’t always intuitive, and it’s easy to make some simple mistakes that can cause your code to work in unexpected ways.

Read more…

Comment
Four short links: 30 April 2014

Four short links: 30 April 2014

Critical Making, Torrent Filesystem, Testing Infrastructure, and Reproducible Research

  1. Critical Making — essays from 70 contributors looking at the politics, choices, and ethics of a lot of the makery going on.
  2. torrent-mount — mount a torrent as a filesystem in real time using Javascript. (via Joe McCann)
  3. Continuous Integration for Infrastructure — slides on the emerging tools for large-scale automated testing integrated into development and deployment workflow.
  4. Implementing Reproducible Research — book by Victoria Stodden and Johanna Cohoon on tools, practices, and platforms for making science that others can verify (another step in improving velocity and quality of scientific research).
Comment
Four short links: 25 April 2014

Four short links: 25 April 2014

IoT UX, Tilty Library, Local Govt Dashboard, and SF Dreams

  1. UX of the Internet of Things — a Pinterest board of IoT designs and experience.
  2. parallax.js — Javascript library for tilt, shake, etc. interactivity on iPad. NICE demo.
  3. Gov.UK Local Government Dashboard Prototype is Live — not glorious, but making the move from central to local government is super-important. (via Steve Halliday)
  4. How America’s Leading Science Fiction Authors are Shaping Your Future (Smithsonian) — SF writers create our dreams. “Techno-optimists have gone from thinking that cheap nuclear power would solve all our problems to thinking that unlimited computing power will solve all our problems,” says Ted Chiang, who has explored the nature of intelligence in works such as The Lifecycle of Software Objects. “But fiction about incredibly powerful computers doesn’t inspire people the same way that fiction about large-scale engineering did, because achievements in computing are both more abstract and more mundane.”
Comment
Four short links: 22 April 2014

Four short links: 22 April 2014

In-Browser Data Filtering, Alternative to OpenSSL, Game Mechanics, and Selling Private Data

  1. PourOver — NYT open source Javascript for very fast in-browser filtering and sorting of large collections.
  2. LibreSSL — OpenBSD take on OpenSSL. Unclear how sustainable this effort is, or how well adopted it will be. Competing with OpenSSL is obviously an alternative to tackling the OpenSSL sustainability question by funding and supporting the existing OpenSSL team.
  3. Game Mechanic Explorer — helps learners by turning what they see in games into the simple code and math that makes it happen.
  4. HMRC to Sell Taxpayers’ Data (The Guardian) — between this and the UK govt’s plans to sell patient healthcare data, it’s clear that the new government question isn’t whether data have value, but rather whether the collective has the right to retail the individual’s privacy.
Comment

5 ways developers win with PaaS

Powering your app with open source and OpenShift

Getting Started with OpenShift As a software developer, you are no doubt familiar with the process of abstracting away unnecessary detail in code — imagine if that same principle were applied to application hosting. Say hello to Platform as a Service (PaaS), which enables you to host your applications in the cloud without having to worry about the logistics, leaving you to focus on your code. This post will discuss five ways in which PaaS benefits software developers, using the open source OpenShift PaaS by Red Hat as an example.

No More Tedious Config Tasks

Most of us don’t become developers to do system administration, but when you are running your own infrastructure you end up doing exactly that. A PaaS can take that pain away by handling pesky config and important security updates for you. As a bonus, it makes your sys admin happy too by allowing you to provision your own environment for that killer new app idea you want to tinker with, rather than nagging them for root access on a new VM.

On OpenShift, it goes like this: let’s say you decide you want to test an idea for a Java app, using Tomcat and PostgreSQL (yes, we could argue about the merits of those choices, but work with me here). You can spin that up with a one-line terminal command:

That -s on the end is telling the platform to make the app auto-scaling, which I will elaborate on later; yes, that’s all it takes. RHC (Red Hat Cloud) is just a Ruby Gem wrapping calls to the OpenShift REST API. You could also use the OpenShift web console or an IDE plugin to do this, or call the API directly if that’s how you roll. The key technologies in play here are just plain old Git and SSH — there’s nothing proprietary.

Read more…

Comment

5 ways to improve battery life in your app

Tips and tricks to squeeze the most out of your mobile UI

mobile_html5 Editor’s Note: Mobile HTML5 is a book by front-end engineer and frequent speaker Estelle Weyl. It is packed with hands-on examples to make you a stronger web developer–including best practices for SVG, Canvas, and CSS3 tailored to fit mobile devices. In the excerpt below, Estelle walks you through five easy things you can do to improve battery life in your mobile web apps. As throughout the book, the tips she provides come from her own real-life experience with these technologies.

Unlike desktop computers that are tethered to the wall at all times, and even laptop computers that are generally used by stationary users, mobile users do not recharge their devices throughout the day. Mobile users expect their devices to last, at a minimum, 24 hours between recharging.

Your users do realize that calls and GPS usage consume battery power. However, if they think they’re just using their browser to surf the Web, they don’t consider that different websites will drain their battery faster than other sites. It is our job, as developers, to manage the power consumption of our code. Read more…

Comments: 2
Four short links: 18 April 2014

Four short links: 18 April 2014

Interview Tips, Data of Any Size, Science Writing, and Instrumented Javascript

  1. 16 Interviewing Tips for User Studies — these apply to many situations beyond user interviews, too.
  2. The Backlash Against Big Data contd. (Mike Loukides) — Learn to be a data skeptic. That doesn’t mean becoming skeptical about the value of data; it means asking the hard questions that anyone claiming to be a data scientist should ask. Think carefully about the questions you’re asking, the data you have to work with, and the results that you’re getting. And learn that data is about enabling intelligent discussions, not about turning a crank and having the right answer pop out.
  3. The Science of Science Writing (American Scientist) — also applicable beyond the specific field for which it was written.
  4. earhornEarhorn instruments your JavaScript and shows you a detailed, reversible, line-by-line log of JavaScript execution, sort of like console.log’s crazy uncle.
Comment
Four short links: 16 April 2014

Four short links: 16 April 2014

Time Series, CT Scanner, Reading List, and Origami Microscope

  1. morris.jspretty time-series line graphs.
  2. Open Source CT Scanner — all the awesome.
  3. Alan Kay’s Reading List — in case you’re wondering what to add to the pile beside your bed. (via Alex Dong)
  4. Foldscope — origami optical microscope, 2000x magnification for under $1.
Comment