background preloader

JavaScript Patterns

JavaScript Patterns
A JavaScript pattern and antipattern collection that covers function patterns, jQuery patterns, jQuery plugin patterns, design patterns, general patterns, literals and constructor patterns, object creation patterns, code reuse patterns, DOM and browser patterns (upcoming). Patterns collected while developing 喜感网.

http://shichuan.github.io/javascript-patterns/

Related:  HTML/CSS/JS

Functional Programming in Javascript This is an interactive learning course with exercises you fill out right in the browser. If you just want to browse the content click the button below: This is a series of interactive exercises for learning Microsoft's Reactive Extensions (Rx) Library for Javascript. So why is the title "Functional Programming in Javascript"? Well it turns out that the key to learning Rx is training yourself to use functional programming to manipulate collections. Functional programming provides developers with the tools to abstract common collection operations into reusable, composable building blocks. All About Floats What is "Float"? Float is a CSS positioning property. To understand its purpose and origin, we can look to print design. In a print layout, images may be set into the page such that text wraps around them as needed. This is commonly and appropriately called "text wrap". Here is an example of that.

Continuous Integration for Javascript Jenkins is a CI tool that is often used for running tests and code analysis after every code push. There are a lot of benefits that we as a community are not taking advantage of for our web (CSS, JS, etc) code. In this article I’m going to walk you through setting up automated building and testing for a JavaScript project. NOTE: The steps outlined are generally Linux/Mac centric, I don’t go into depth on Windows setup, but it shouldn’t be much different using Cygwin. CI Your JS? Aside from the traditional benefits you see from your compiled code, there are some very compelling reasons:

20 Useful CSS Graph and Chart Tutorials and Techniques Usually, Graphs and Charts are mainly used for representing and organizing a set of numerical data with a graphical representation such as pie chart, line charts, bar graphs and many more. The static images would be reduced using these techniques and enables more access to the contents of the charts and the graphs. The Cascading Style Sheets (CSS) is a language that is used to describe the format of a document that is written in the markup language like HTML, XHTML, etc. Underscore.js Underscore is a JavaScript library that provides a whole mess of useful functional programming helpers without extending any built-in objects. It’s the answer to the question: “If I sit down in front of a blank HTML page, and want to start being productive immediately, what do I need?” … and the tie to go along with jQuery's tux and Backbone's suspenders.

Javascript Tips for Non-Specialists By: Charlie Fiskeaux II Wed, 22 Aug 2012 This article reviews a fundamental concept or principle This article reviews an intermediate concept or principle Continuos Integration (CI) for JavaScript – Jasmine and Teamcity Web applications are using more JavaScript than ever before. The following image (thanks to Gineer) shows the shift in the architecture types of web applications from simple thin clients to thicker clients driven by rich presentations and client logic. Since most of the newer web applications include business logic embedded into the client using JavaScript, we must put assurances to make sure the quality of the application is not compromised over time. In most cases, the JavaScript side of the applications goes untested or is not automated which is a bad idea. I have selected the following tools to be able to provide Continuous Integration to Rich Internet Applications:

Useful HTML5 Frameworks, Template Generators and Tools Web designing needs consideration of a few facts before starting with a particular project. Clients will never allow you to take ample time to end up the project and you have to be efficient enough to run parallel with your clients. Uses of technical applications can ease the task which again takes in account the right choice of the designing medium. Using designing template is thus important to deliver a project at the stipulated time. HTML5 frameworks help to cut short the CSS step along with increasing the visibility of the site. Let me discuss in brief why it is inevitable to use frameworks while working with HTML5.

validate.js Lightweight JavaScript form validation library inspired by CodeIgniter. No dependencies, just over 2kb gzipped, and customizable! validate.js (development - 16kb) validate.min.js (minified - 2.1kb) JavaScript Garden Although JavaScript deals fine with the syntax of two matching curly braces for blocks, it does not support block scope; hence, all that is left in the language is function scope. function test() { // a scope for(var i = 0; i < 10; i++) { // not a scope // count } console.log(i); // 10} There are also no distinct namespaces in JavaScript, which means that everything gets defined in one globally shared namespace. Each time a variable is referenced, JavaScript will traverse upwards through all the scopes until it finds it. In the case that it reaches the global scope and still has not found the requested name, it will raise a ReferenceError.

Related:  webSingle Page Application ( SPA )HTLM5