What is an “Immediately-Invoked Function Expression” (IIFE)? is a JavaScript design pattern which produces a lexical scope using JavaScript’s function scoping. “Immediately-invoked function” expressions can be used to avoid variable hoisting from within blocks, protect against polluting the global environmentRead more…
My notes about @brad_frost workshop: “Reasons to be Responsive”
Reasons to be Responsive LONDON – JUNE 3rd, 2013 A reason to be Responsive is a full-day workshop with Brad Frost (@brad_frost). Brad will take a deep dive into the world of responsive web design, covering broad concepts, strategy designRead more…
It’s not pixel-perfect it’s proportion-perfect
Going beyond simple pixel-width conditions: I’m making this post in response to the @brad_frost article: The post-psd era In the past designers sold websites like pieces of art, but they are more than that. These are software engineering masterpieces, not justRead more…
The way of the Front-end developer: My tiny story
The Front-end development: I used to be a back-end developer working with Java and PHP last 10 years (I still remember that boring purple color from PHP website), :P. I was looking for something else, something to get exited to do.Read more…
Fluid fonts, a pre-prossesor solution
RWD Typography Lasts days I have been working in another interesting Responsive Web Design and Mobile First project where the client required to create a fluid font to auto adapt to the environment, problem was they have like 10Read more…
Responsive Web Design Chrome Extension Testing Tools
I have been working on Responsive Websites for the last two years, and one of the most tricky things is test the layout. We need to test on Remote Debugging using real devices , simulate is always the final real way,Read more…
JavaScript Unit Tests: testing built-in jasmine.Matchers
Jasmine is a testing framework for JavaScript. It’s framework agnostic and does not require a DOM. There are few matchers we built-in matchers helping us. Get a full control of them is essential to understand the basic functionality.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
describe('Testing all Jasmine built-in matchers', function() { it("equal to", function(){ expect(t).toEqual(t); }); it("toBe", function(){ expect(n).toBe(n); }); it("not.toBe", function(){ expect(t).not.toBe(Array); }); it("not.toContain", function(){ expect(a).not.toContain('Pepe'); }); it("not match to", function(){ expect(t).not.toMatch(f); }); it("is defined", function () { expect(n).toBeDefined(); }) it("is not defined", function () { var n; expect(n).toBeUndefined(); }); it("is null", function () { expect(nul).toBeNull(); }); it("is true", function () { expect(t).toBeTruthy(); }); it("is false", function () { expect(f).toBeFalsy(); }); it("contain an element", function () { expect(a).toContain('leo'); }); it("is lower than", function () { expect(f).toBeLessThan(t); }); it("is higher than", function () { expect(t).toBeGreaterThan(f); }); it("throws exception", function () { expect(function(){fn();}).toThrow(); }); }); |
Detect your viewport using “widthDetector”
This “widthDetect” is a very simple but effective js library to @media target your grid design. It works cross-browser, cross-device, cross-library with a debounce method thats returns a function which wraps your callback, limiting its execution rate to the limit specified inRead more…
Vanilla Responsive Web Design Framework
Be Responsive: a vanilla responsive web design grid About the vanilla responsive grid This is Vanilla. No js (unless required). Mainly inspired by 320 and UP Mobile First Framework View DEMO Demo : Let’s rock Want to use it?Read more…
A search box
Wondering about how to make a better simple search box without including external libraries, I found that is very complicated find something nice if you want to to implemented for Mobile Web or Responsive Web Design. So I created aRead more…