Gabe Harris

That was a neat use of JavaScript

Wednesday, May 11th, 2011

I’ve been intrigued by JavaScript templating lately, enough so that I did a little bit of playing with a few options (mustache and I Can Haz JS). I made this page from I Can Haz JS, and it was very easy to implement.

In a nutshell, here’s how it went:

1. Link to all the right JS files
2. Create a <script> block with the template for my data
3. Use Google Feed API to snag an RSS feed
4. jQuery voo-doo to make these JavaScripts render something on the screen
5. Muck with the look/feel to make it entertaining

I don’t believe I have hardly scratched the surface with what is possible. It seems to me these templates would be very useful in pages with lots of Ajax calls to the server sending/receiving/updating data. Of course I have no projects going right now that need any of that action, so I put together a super-simple quick-hitting test page. Go look at the page and view the source, and have fun at the rest of the playground, too.

The hardest part was thinking of some (almost useful) data source to use and then remembering that I couldn’t violate any security measures (ahem, must implement Google Feed API to pull an RSS feed.) I’m potentially biased, but I dig the color scheme and design I’ve put together here. Additionally, I was stoked to see all the new fonts the Google Font API has now! It had been a while since I checked them out, been sticking with Font Squirrel.

Anyone want to help me think of a project where we can use this templating? I don’t have a lot of free time, but would love to build something. Ping me here, or on the Twitters!

• tagged: ajax, css, Google APIs, html5, icanhazjs, jQuery
• categorized: css, javascript
• no comments »

Coolest Javascript Library Name

Wednesday, July 28th, 2010

How can you deny ‘Dojo’ as the coolest Javascript library name? People that use it seem to love it, so I’m giving it a go. Check it out at the playground. I haven’t done a whole hell of a lot with it yet, but it’s a start, and I expect it to keep growing over the coming days/weeks.

First impressions – it feels like the jQuery a little bit, but I do miss the jQuery $ sign. I’m not used to it at all yet, it seems long-winded after writing so much jQuery. It certainly doesn’t appear to have the faithful following I’ve grown accustomed to with jQuery, but that can have its positive connotations as well. It could push me to write my own custom ‘plugins’ which in theory should lead to more power and usefulness. Plus it absolutely will push me to be a better front-end developer. I am excited to keep pressing forward with it.

• tagged: dojo, javascript, playground
• categorized: css, development, javascript
• no comments »

In-line style? PLEASE DON’T

Thursday, July 22nd, 2010

Besides the more obvious reasons for not using them (if no reasons come to mind, stop reading and go play some place on YouTube), in-line styles suck on another level. Keep reading…

• tagged: class, css, id, in-line, style, styling
• categorized: asp.net, css, development, javascript, php
• no comments »

Just for fun

Friday, July 9th, 2010

I like fun things, but getting tattoos all the time is rather cost prohibitive. So I have built a little playground area, for learning and trying new stuff. Some of it is just following along through tutorials I’ve seen online, and some if it is testing out new things as I read about them. Most of it is front-end related (CSS(3), HTML(5), and JavaScript/jQuery), but there is some coding going on as well (CodeIgniter) that you won’t see. At any rate, check out the playground for some good times.

BE WARNED: if you’re using IE, you probably won’t love it so much… sorry?

• tagged: css, design, development, front-end, javascript, jQuery, playground
• categorized: css, design, development, javascript, php
• no comments »

Redesigned Another Site

Wednesday, March 10th, 2010

I redesigned my wife’s web site, MelissaHarrisPhotography.com. It was built with Photoshop, Illustrator, jQuery, CodeIgniter, CSS3, and tender loving care. You will want to look at it in a browser that understands CSS3 to get the full effect (Firefox, Chrome, or Safari – sorry Opera, I did not check on you, but I’m guessing it’s much better than good ol’ Internet Explorer.) You can’t tell by looking – but it does have an entire custom built back-end for administering the portfolio and proofing sections of the site. The blog portion of the site will be updated very soon to match the new style.

She’s happy with it, so I’m happy with it. If you need a photographer – get in touch with her!

Leave me a comment to let me know what you think of the new design!

• tagged: codeigniter, css3, jQuery, php
• categorized: css, design, development, javascript, php
• no comments »

Another Update

Tuesday, March 9th, 2010

This new version of my site is done for now. More importantly, I have partnered with some great people from Virid to launch a new venture: Citrus Design Group. Holler at us for all of your creative needs!

• tagged: business, citrus, citrus design group, professional
• categorized: css, design, development, javascript, personal
• no comments »

New j-o-b

Friday, August 14th, 2009

Took a look at my site and noticed I hadn’t posted anything in pert near 2 months. Saw that I’ve only tweeted about twice in the past month, too. Busy guy. Or has it lost some of it’s luster? Keep reading…

• tagged: job, professional, work
• categorized: asp.net, css, development, javascript, personal
• no comments »

Quick jQuery Lesson – Events

Thursday, April 2nd, 2009

Just learned a quick lesson about jQuery events (think .focus, .blur, etc.) while talking through an issue with a new twitter friend. In order to make an event work it has to be inside your $(function(){}); (also known as $(document).ready(function() {}); also known as “once the DOM is ready”). So if you’re pulling your hair out because an event isn’t firing, make sure you’ve got it in the right place. Keep reading…

• tagged: jQuery
• categorized: development, javascript
• no comments »