Sankho Mallik's Web Log

Yes, it is, my bad.

I’ve recently migrated servers.

Things will change soon!

One of my favorite bits of HTML5 is browser storage. LocalStorage and sessionStorage allow you to store data on the client’s browser, as opposed to hosting it on a database and pulling data from a server.

Alas, it’s only supported in the “good” browsers, and IE8+. That’s a pretty solid base of support, but not enough to really build an app around – people still use IE7. So as for using the storage options to base an app’s architecture in production, localStorage and sessionStorage are still a nogo, despite some cross browser options.

So what’s it good for? Lately, I’m thinking one thing: web app prototyping.

Continue reading →

Two days, two blog posts? I may just have too much time on my hands!

Speaking of which, I took some time off today to make a simple todo list.

The inspiration / idea is that when it comes to getting things done, nothing’s happening past today. The use case is that we often come to a computer in the morning, boot it up, and leave it on throughout the day. So this is an active todo list that only saves data for the current day.

It uses HTML5′s localStorage and some other neat stuff. It’s also another venture into designing for me. If people start using it for whatever reason, I’ll probably make this cross browser’ed with the good ‘ol USTORE.js.

Here’s the app, and here’s the code on github. Enjoy!

“I’m going to write more often.”

Check. I’ve actually been writing a lot. Just not blogging. So 2011, like every other year, must start off with a few strong weeks doing everything I say I’m going to do for a year, such as:

1. Eating healthy.
2. Working out regularly.
3. Paying bills on time.
4. Blogging more.

So here’s the latest beginning of a run at blogging more often. And what better to blog, how else to display both my knowledge of both web development and writing… than to list links to shit I think is rad! Enjoy.

Continue reading →

Just a little something I’ve been wasting my time with lately. Don’t feel much like writing a long winded entry explaining things – it’s still very young. All the code’s on my Github; but for now I’ll post some neat examples:

1. A single circle (color blending)
2. A few objects
3. Easing options
4. Basic image animations
5. It’s colorful

The code on Github.

Happy new years!

So like a lot of people, I’ve been getting into Node.js. It’s been fun, and the best part is the fact that I’m only writing one language on all sides of the application. It makes for quicker development as you don’t have to “shift gears” between two types of logic, IMO.

But it wasn’t until my friend Dan pointed out to me that you could share code on both ends of the application. While putting together a small project using Node.js, we’re sharing a settings file on both ends to quickly change features in the app. It’s simply an object literal in the global namespace:


var settings = {
grid : 'false',
key : 'value',
...
};


Notice it’s an object – that makes for easy transport in the backend of Node.js via the CommonJS module system, which we’d usually do like so:


exports['settings'] = settings;


Except for the fact that if we combined the above two samples into one, it would work fine on the server side but return an error on the client side for exports being undefined.

How to solve? Easy! If you require this file correctly in the browser and aren’t privy to cross scripting attacks (seriously, are you?), and can bear with not calling any variable window on the server side, then this addendum will work out fine!


if (typeof window === 'undefined') {
exports['settings'] = settings;
}


Again: you can’t define a variable as “window” on the server side. Also, this is assuming that you won’t set “window” to undefined on the client side as well.

You can probably do a lot more than pass object literals back and forth as well… but I’m not sure why you’d need to seeing as this is being shared on both sides. Anyway, hope this helps.

Cheers!

As a freelance web developer I’ve met tons of entrepreneurs with great ideas. Unless I end up working with them, their ideas are typically forgotten amidst the deluge of rapid fire modernity that is the world of web development.

However this is not the case of my former client Bartek Ringwelski, co-founder of SkillSlate.com. While I didn’t work with him on it, I actually ended up using the site. Furthermore, I actually was pleased by the end result.

My apartment was a mess, my parents were coming to visit the upcoming weekend. Being a unique combination of lazy and busy, I knew I was going to hire a maid service. I began my search through my usual means (google), and was frustrated from the onset. My search turned up all sorts of results that weren’t even close to maid services, weren’t in my area, and offered little relevant information to me. The sites that had the best information were most often expensive companies, and not accessible individuals.

So then I tried SkillSlate.com. SkillSlate is like match.com for services, with a heavy emphasis on personal fit in additional to professional fit. Basically, they highlight the important details of WHO the service provider is and WHAT he/she provides. Finally, the SkillSlate directory puts all this together, allowing consumers to search for high quality, trusted individual service providers in their area. Individuals get more business and consumers feel secure that they have received high quality, less expensive work.

There is a huge need for this type of service in cities. I like hiring local service providers as opposed to larger companies because it’s a lot cheaper. I really think SkillSlate.com will pick up steam in big cities; I know it helped me out.

One of the hot topics in our industry these days is the technique of Responsive Web Design via the use of CSS3 Media Queries. The term Responsive Web Design was first coined by Ethan Marcotte in A List Apart. It revolves around the use of CSS3 Media Queries to deliver different CSS properties dependent on the browser’s dimensions. This allows us to create one unified stylesheet that will deliver a unique experience to all browsers; regardless of dimension and device. It’s flawless in application because it only affects devices that understand it, those that don’t fall back to the usual CSS properties they do understand.

But don’t take my word for it. You should really read Ethan Marcotte’s article. And then read Smashing Magazine’s tutorial of how to use CSS3 Media Queries. And then maybe play around with it a bit yourself – check the source code here, I’ve started to myself. I’m not here to teach you the technicalities of using CSS3 Media Queries, so definitely check out those links if you are still confused about the nature of the properties or Responsive Web Design.

So far, there are three really great examples of Responsive Web Design out there, and each reveal a different design approach.

Continue reading →

“Useless” is of course, in the eye of the beholder.

Just wrote a small, dumb plugin to mimic a typewritter effect for text in jQuery.

Check the demo out here, get the plugin here, and check out the github page here.

If you’ve developed an ajax site, at some point you may have ran into the problem of not being able to make ajax requests across different domains or sub-domains. And if you haven’t run into this problem yet – don’t worry, it’s coming.

Fortunately, my buddy Kenny whom I work with at HUGE wrote a quick PHP class to solve this problem. Basically, rather than routing requests directly to the other domain, you route them to a PHP file hosted on your local domain with the ajax-proxy class instantiated. The class then visits the URL on a separate domain and saves the response text via PHP, which has no cross domain limits. This response is then returned by the PHP class, and finally to your Ajax function!

There are a few other attempts at proxies out there, but as far as I know Kenny’s ajax-proxy is the only one that also sends cookies along with the request. So if the domain you are requesting to requires a cookie which is set on your original domain – no worries. Ajax-proxy takes care of it for you!

Don’t take my word for it. Read Kenny’s blog post for better details. Or just check it out at HUGE’s github account!