Archive for category: Front End

Using Bower + Grunt in existing python projects


by
07 Jan
January 7, 2014

When I set out to integrate Bower and Grunt into our current Python projects I wasn’t looking to upset the balance, but instead improve the process for front-end development. Integrating these tools allows us to lighten our repository by moving third party dependencies to Bower, along with giving us easier access to build tools like Require.js and Sass. Ultimately these tools give us the ability to deploy optimized assets without the need to check them into git and manage changes to built files across branches. Read more →

CSS background-size and background-position


by
18 Dec
December 18, 2013

It feels like I come back to this awesome Pen at least once a month, so I wanted to share. It’s a great way to see how the different properties for background-size and background-position affect the image. At first, I went here to figure out which option it was that I wanted, now I use it to quickly illustrate the differences to others. Enjoy!

http://codepen.io/herihehe/pen/aLwGt

Default javascript object sorting across browsers


by
01 Nov
November 1, 2013

Today I was presented with puzzling issue that I had never encountered before. When accessing an item from a javascript object using underscore’s _.first() method I was getting two different items in Chrome and Firefox.

My object is an object with a string keys. The key is a numeric string (’01234′ ’12345′ etc) because javascript will trim off the leading zero if converted to a number.

Read more →

console.log(’8 Javascript Debugging Tips’);


by
21 Mar
March 21, 2013

The webkit developer tools are the single most helpful front-end development resource I have. I use them every day, and wanted to share a few tricks I use to track down bugs or unexpected behaviors in my javascript code. My browser of choice is Chrome,  so all examples and screenshots below will be pulled from the Chrome console.

First, if you’re still using Alerts to give yourself feedback, please stop. The unobtrusive console.log statement will give you feedback that can be much more descriptive, and sticks around for as long as you want it to. To get started, use the shortcut CMD+Option+J (Windows: CTRL+SHIFT+J) to pull up the Chrome console any time. Alternatively, you can right click the page and hit ‘Inspect Element’ to bring the panel up, then select the ‘Console’ tab.

Logging All HTTP Requests Automatically

Screenshot of the javascript console right-click options

Right click in the console to bring up these options

This one is simple, but can save a lot of manual logging, and potentially reveal some unwanted/unexpected/unnecessary network calls. You can right click in your Console to reveal the option to “Log XMLHttpRequests.” This will show you a twirl-down stack of calls that resulted in the sending, and finishing of an XMLHttpRequest (like a jQuery $.ajax() call). Read more →

Why the best tool for the job isn’t always the right tool for the job


by
09 Nov
November 9, 2012

We started our #hackaway with some lofty goals for hearquotes. I spent the day working with the team focused on developing the web application, and learned a lot in that 24 hours about javascript, web applications, my coworkers, and myself.

Early in the day, I made the decision to use Backbone to drive the web application. I knew that Ron, the other front end dev working with me, had some experience with Backbone, and I had been tinkering with it in a side project. There has been a really steep learning curve for me with backbone, and I still didn’t feel completely comfortable it, but felt like it was the best tool for the job. Plus, this was meant to be a day for learning, stepping out of my comfort zone, and working with a technology that I wasn’t necessarily familiar with, so I thought, “Let’s go for it.”

Read more →

© Copyright 2017 Findaway. All rights reserved.