Good Technology Blogs I Follow

I wanted to share some recent blogs I discovered with great content:

BADASS JAVASCRIPT - A showcase of awesome JavaScript code that pushes the boundaries of what's possible on the web.

codeascraft - technology blog from Etsy.

html5 doctor - awesome HTML5 examples.

Mozilla Hacks - technology blog from Mozilla.

Tech Slides - Awesome lists of really good free resources for web development and design.

ImageNab - An Advanced Image Search

I have been frustrated lately by a lack of a good image search on the internet. Google use to be best and it is still the best in terms of finding photos from websites but these days, there are many more images out there on social media sites like Instagram, Tumblr, Pinterest, etc... Image upload sites like ImgUr or Minus also have a ton of photos and let's not forget websites like 500px and Flickr. I have seen some attempts to provide a better image results but I love the simplicity of ImageNab, there are no ads, the image results are in large format, and it covers a lot of good image websites. It's also super alpha and I am looking forward to see how it expands in the future.

How to Import Blog Content to Blogger via XML

Have you ever used the Blogger import functionality? It is designed to only import XML that you have exported from Blogger, like if you wanted to move a blog from one domain to another. But, what if you want to just import a blog post to your Blogger blog? It would be nice to have the capability to create blog articles using XML and just import. Unfortunately, its not that simple and you will probably get a lot of errors on import. So, I did some research, and I have figured out a way to do it, you just need to have specially formated xml.

If you want to just import a simple blog post to Blogger via xml you can use the following xml code, just replace "test" with whatever you want:

<?xml version='1.0' encoding='UTF-8'?>
<ns0:feed xmlns:ns0="http://www.w3.org/2005/Atom"><ns0:generator>Blogger</ns0:generator><ns0:entry><ns0:category scheme="http://schemas.google.com/g/2005#kind" term="http://schemas.google.com/blogger/2008/kind#post" /><ns0:id>test</ns0:id><ns0:content type="html">test</ns0:content><ns0:title type="html">test</ns0:title></ns0:entry></ns0:feed>

If you want to import an article and give it a particular category, then you can use this code:

<?xml version='1.0' encoding='UTF-8'?>
<ns0:feed xmlns:ns0="http://www.w3.org/2005/Atom"><ns0:generator>Blogger</ns0:generator><ns0:entry><ns0:category scheme="http://www.blogger.com/atom/ns#" term="test" /><ns0:category scheme="http://schemas.google.com/g/2005#kind" term="http://schemas.google.com/blogger/2008/kind#post" /><ns0:id>test</ns0:id><ns0:content type="html">test</ns0:content><ns0:title type="html">test</ns0:title></ns0:entry></ns0:feed>

Finally, if you want to import a blog article via XML with time and category you can use this code:

<?xml version='1.0' encoding='UTF-8'?>
<ns0:feed xmlns:ns0="http://www.w3.org/2005/Atom"><ns0:generator>Blogger</ns0:generator><ns0:entry><ns0:category scheme="http://www.blogger.com/atom/ns#" term="test" /><ns0:category scheme="http://schemas.google.com/g/2005#kind" term="http://schemas.google.com/blogger/2008/kind#post" /><ns0:id>test</ns0:id><ns0:content type="html">test</ns0:content><ns0:published>2011-09-26T20:16:54Z</ns0:published><ns0:title type="html">test</ns0:title></ns0:entry></ns0:feed>

It might be also useful to check out the Blogger API information from Google. Finally, if you are looking for a way to post XML code in Blogger as I have done in this post, just use this Encode / Decode HTML Entities Tool.

Get Travelzoo Top 20 Before it's Published

I love to travel and I travel often. I really like Travelzoo Top 20 to get some ideas on cheap destinations or travel deals and today I have realized that you can get Travelzoo Top 20 before it is available to the public. It isn't all too useful as it's usually incomplete before Wednesday, when Travelzoo publishes the Top 20, but you can get to it before it's published through the Newsletter Archive url:

http://www.travelzoo.com/top20/?w=10-2012

That link will take you to the Top 20 Newsletter Archive from March 7, 2012, which is today, but if you go to:

http://www.travelzoo.com/top20/?w=11-2012

you can see the Top 20 Newsletter Archive from March 14, 2012 and today is still March 7, 2012. You can't actually click on the deals, obviously, but you can see a bit into the future which might help you out. I thought this is worthy of sharing. Some other tips that are might be useful to others:

1. While sites like Orbitz or Travelocity are great for research, you will generally always get the same price on airfare or better by buying directly from the Airline.

2. Tuesday and Wednesday is the best time to buy airfare, it could be good on other days but it is generally worse on the weekends.

3. If you are traveling from US, the fall is pretty much the best time to buy flights and summer is the most expensive.

4. If you are using miles to redeem a flight, like let's say on AA, and you don't care about connections, research outside of your city as the connection flight will usually be free.

5. When you are researching flight prices, make sure to look at Airlines (like SouthWest, for example) that do not work with travel websites like Orbitz.

6. If you are booking a ticket on a foreign Airline, make sure you pay in local currency because the prices will be drastically different.

7. Kayak Explore is a great place to start your research for where to fly on your next travel trip.

I rarely book vacations, I just want some cheap airfare and then I will figure it out, that is the adventure, the fun part of travel in my opinion. If you just want to go to Caribbean and chill at a nice resort, then there are many great tools to find good deals. But, if you don't really care about destination (there are so many places in the world I want to see) and you don't care about connections, then how do you figure out how to get the cheapest airfare to your dream destination?

It's actually not that easy and there is definitely an opportunity here for a better travel website or application, in terms of international flights (Google Flight is doing some great things for domestic flights). Here is the issue:

Let's say I live in NJ and I want to travel to Brazil, and I don't really care about connections and where I land in Brazil (I plan on going to a couple places in that huge country). So, what do I search for on Orbitz (or Kayak, Expedia, or Travelocity)? First of all, do I say I am departing from New Jersey or Philadelphia or New York? That part is sort of taken care of by the "search 80 miles around" button, but maybe I don't care about driving down to Baltimore if it will save me a couple hundred dollars too.

In reality, the departure city just does not matter. Also, the destination city does not really matter. What I really want is to select a couple cities from my destination country and see where (and how much) are the direct connections going to my country. This will tell me exactly from what city in my country is the best deal to a city in my destination country. This is generally the most expensive part of the flight and often when you actually book the flight, the connection fare is waived (depending if its treated as same flight). Maybe you buy the connection with another airline, whatever comes out to be least expensive.

No one does this, and it would save me countless hours of researching to get a great deal for my trip. What do you think?

Fast YouTube Video Downloader Chrome Extension

It has been a while since I have written anything here but I have been super busy working on a bunch of projects. I have been messing around with a lot of HTML5 and canvas and YouTube. I never understood why these "YouTube video download websites" use back-end code to download videos when everything is available on the front-end. Same thing applies to the actual YouTube website. For example, if you are watching a YouTube video (it has to be queued up or playing) you can run this in your console and get the url paths to all the different video files available: yt.player.playerReferences_.player1.api.getVideoData().url_encoded_fmt_stream_map

But, you don't even have to do that because the embed tag that has the video, its flashvar attribute, also has the url_encoded_fmt_stream_map data. It needs to be decoded, a couple of times, but after that you have all the urls to the video files that you need. So, I decided to write a chrome extension that is really fast, simple and user friendly: Fast YouTube Downloader Chrome Extension

Here is how it works: you go to any YouTube video, and you click on the YouTube Downloader Extension in Chrome which will put a link on the page that takes you to the best quality version of the video file. I only show a link to the highest quality format because who cares about low quality if you are downloading the YouTube video to your computer? If you do care, let me know, and I can provide all the links. Here is the extension, just a couple of lines in JavaScript:


YouTube DL

UPDATE: New version of YouTube Video Downloader below does not require a double-click and it will right away open a new tab with the HQ youtube video for download.

YouTube DL

Fast Guide for Small Talk Success

I am pretty much introverted and I hate small talk. I have felt this way for a while so going to corporate events or even just talking to strangers is usually uncomfortable. But, you can't just isolate yourself from society, well you can, but that is not what I want. So, it's time to get better at small talk.

I think a good place to start is just thinking about small talk in general, I just said I hate it above, that is based on my thinking that small talk is stupid because it is so superficial, but the truth is that small talk is really powerful and important skill set that you should learn to love and develop. Why?

How else will you find new friends and start meaningful conversations with random strangers? Something has to break the ice, initiate the convo, and yes, if all you talk about is the weather, than small talk is useless. But small talk should lead to a more deeper and interesting subjects, that is the goal, nobody really wants to be stuck in just small talk all night.

Now, what are you going to small talk about? Can't think of any topics or subjects? Well, let me just add some criticism, and this is directed to me. You suck! Get a life! You can't think of any subjects? really? I had to say this to myself a bunch of times, seriously, this criticism is the most significant part of small talk success.

The point is that a rich lifestyle creates content and it helps you engage others. So if you do not have a life, a rich lifestyle, you just suck and you should change, create it, get a life: read more, travel more, try new things everyday, take on various hobbies, do some charity work, and definitely socialize more.

The other big piece of advice is that you should care about the vibe of the conversation and not the topic. It's just small talk in the beginning so focus on energy, make sure you smile, joke around, be spontaneous and silly. The point is that in the beginning of any conversation the way you say things is much more important than what you say.

Remmeber to always ask open questions, not questions that end with a yes or no. You want the responder to talk about themselves. Some examples could be "What sort of books do you like?", "What did you study at university?", "Which is your favorite season? Why?", "Where's your usual watering hole?", etc. Finally, you should always have an exit line like "I have to go get another drink."

Okay, now the real content:

Here are some quick general small talk topics:

weather, hobbies, sports (current matches, favorite teams), current events, entertainment, compliments on clothing or fashion trends, media (films, books, magazines), hometown (where do you come from, how is it different), etc

Here are some Icebreakers:

current mutual situation (are you excited about the conference?)
have you tired this beer or that food?
did you hear about that news event?
do you have any kids?
travel (how was your flight down here? when are you heading back? favorite vacations spots?)
food: talk about the food being served
technology: talk about android phone, ipad, Facebook, computers, etc (do you think the win8 tablet will challenge the ipad?)
beer preference
holidays: there is always one coming up so you can ask about plans for holidays?
So have you had a busy day?
WORK: where do you work? how long have you worked for your company? have you always done this work?
Entertainment: seen any good movies lately?
Recreation: what do you do for fun? any hobbies?
what do you think about this place?
where did you grow up?
What do you do when you are not working?
once a topic comes up, like a book, u can say things like: if you wrote a book (made a cd, directed a movie) what would it be about?


When you are stuck, just think about some good books you just read, articles, your hobbies, etc. Remember to say a persons name now and then to memorize it and because it is a sign of respect and mutual like. Finally, make sure your response are meaningful, if someone says the weather is crappy, don't just nod or say "yeah" which will end that conversation. Respond by telling them how you cannot wait for summer, beach, etc. Keep it going.

Web Developer Interview Questions

HTML, CSS, JavaScript, and jQuery Interview Questions

If you are looking for a job these days as a front-end developer, ui developer, ux developer, or web developer then these questions, answers, and resources should be very useful. Some of them are real questions from interviews. These are mostly intermediate and advanced questions, and I added some library specific questions (jQuery is most popular) as well as general questions that you might encounter.

General Interview Questions for Developers

You should be prepared to talk about your strengths, weaknesses, goals, etc. If you currently have a job you will probably asked why you are leaving your current employer. You should generally have an idea where you want to be in your career in 5 years from now. You might be asked questions about your daily activities and what you like about your job. Often, you will be asked what is one thing that you dislike about work. You might also encounter questions about working on teams vs working alone, communication, culture, Agile methodology, etc. Here are some sample questions:

Do you have any experience in HTML5 or CSS3?

Employers want to hire developers that are passionate about their work and developers that are up to date on emerging technologies and best practices. Even if you have not done much in HTML5 or CSS3 you should know what they are all about. Most importantly, you should know that only modern browsers support CSS3 methods and HTML5 tags, and support differs for each browser. Thus, if your code needs to support old browsers like IE6 you might not have much experience with HTML5 or CSS3.

But, that is no excuse. You should know about the new popular HTML5 tags, like audio, video, canvas, placeholder, etc and their pros and cons. The video tag in HTML5, for example, allows native browser support for videos without the need for something like Flash, however, different browser support different video formats so a big downside to the video tag is that you need to convert your videos into different formats. Finally, you should know that even if you need old browser support, you can still use HTML5 and CSS3 with the help of a JavaScript library like Modernizr that will allow you to detect lack of support in certain browsers and give you a way to implement the missing functionality with your code.


Do you have any exposure to Mobile Development?

Mobile is hot right now and if you do a lot of reading on the industry you should at least be thinking about Mobile Development. Even if you have never done much with Web ToolKit or Android OS, you should at least have some understanding on the difference between Desktop and Mobile design and development. In terms of design, there are many challenges as your viewable area is significantly reduced. In terms of development, looking at jQuery for mobile is a good start. Take some time to read about Mobile development.


What websites or blogs do you read?

This is another question where the employer wants to make sure that you are well read on industry's best practices and emerging technologies. Even if you do not read blogs, there are some websites that should stand out. I would think it is kind of weird if you have never heard of TechCrunch, A List Apart, or Stack Overflow.


What is the difference between progressive enhancement and graceful degradation?

Both are important user experience strategies in web development. The older one, graceful degradation, aims to provide an alternative version of your functionality to users with older browsers. Users on IE6, for example, can still use the website but with more basic functionality. The newer one, progressive enhancement, starts with a baseline of usable functionality available for all browsers and increases the richness of the user experience in more modern browsers.

Here is a great quote from a good article on the differences between these two techniques:

In other words, graceful degradation starts from the status quo of complexity and tries to fix for the lesser experience whereas progressive enhancement starts from a very basic, working example and allows for constant extension for future environments. Degrading gracefully means looking back whereas enhancing progressively means looking forward whilst keeping your feet on firm ground.

These articles go even more in depth: Understanding Progressive Enhancement and Graceful Degradation & Progressive Enhancement


What are some CMS and/or Frameworks that you know?

Most developers work in a certain framework or CMS and you should definitely know some of them. WordPress and Drupal are probably most popular Content Management Systems. There are many more. Two popular frameworks are Symfony and Django. Many e-commerce companies nowadays use Magento, which is an eCommerce software platform. If you know any of these, be prepared to talk about some pros and cons of each CMS or framework.


Tell me something about the http protocol?

HTTP stands for Hypertext Transfer Protocol and it is the foundation of data communication for the world wide web.

Here is a good article from Wikipedia:

HTTP functions as a request-response protocol in the client-server computing model. In HTTP, a web browser, for example, acts as a client, while an application running on a computer hosting a web site functions as a server. The client submits an HTTP request message to the server. The server, which stores content, or provides resources, such as HTML files, or performs other functions on behalf of the client, returns a response message to the client. A response contains completion status information about the request and may contain any content requested by the client in its message body.


For more general interview questions for web developers check out these links: 20 Interview Questions for Web Developers and General Interview Questions.

HTML Interview Questions

Here are 5 questions to start:

1. What is the W3C and what does it do?
2. When do you use a HTML table?
3. How can you improve the accessibility of an online form?
4. What are meta tags and why are they used?
5. What are some differences between a DIV and a SPAN?

For more general HTML questions for web developers check out these links: HTML interview questions and 55 HTML Interview Questions.

JavaScript Interview Questions

What is the main difference between window.onload and onDocumentReady?

Both functions are used to perform tasks when the page is loaded in the browser but they have important differences. Most importantly, "window.onload" will execute code when browser has loaded the DOM tree and all other resources like images, objects, etc, while onDocumentReady allows you to execute code when only the DOM tree has been built, without waiting for images to load. Thus, you can start scripting agains the DOM much quicker with onDocumentReady. Another important difference is that window.onload is not cross-browser compatible while using something like jQuery's document.ready() will work nicely on all browsers.


What is the difference between undefined value and null value?

In JavaScript, undefined means that a value has been declared but has not yet been assigned a value, such as null, which can be assigned to a variable as a representation of no value. If a value is null, it was assigned programmatically, as JavaScript never sets a value to null on its own. Also, undefined and null are two different types: null is an object while undefined is a type itself (undefined).


Explain the difference between synchronous and asynchronous JS request?

Most importantly, synchronous request blocks JavaScript engine until the interaction with the server is complete. The user cannot click away, cancel request, or go to another tab during this time. It is bad for user experience and that is why we have AsynchronousJAX.


Explain briefly the difference between normal array and associative arrays?

This kind of a question could be rephrased as "explain the difference between a['one']='dog' and a[one]='dog'" because the main difference between a normal array in JavaScript and associative arrays is that associative arrays use Strings instead of Integer numbers as index. But this is also kind of a trick question as JavaScript does not support associative arrays, they are objects and not really an array. More information about JavaScript arrays can be found by reading the following articles: Objects as associative arrays and Mastering Javascript Arrays.


Here is a link to more JavaScript Interview Questions: Advanced JavaScript Interview Questions

CSS Interview Questions

What is a z-index?

Z-index is a CSS property that sets the stack order of specific elements. An element with greater stack order is always in front of an element with a lower stack order.


Explain how you solved some css problem?

You should be able to explain a CSS bug that you worked on and how you went about solving it. You could talk about IE issues, take a look at these CSS problems that often need solutions for Internet Explorer.


Explain the benefits of CSS sprites?

Most importantly there is a performance benefit as CSS sprites reduce page load time by minimizing HTTP requests for different images. Usually there is also an accessibility benefit as the code degrades gracefully and shows text to screen readers, search engines, and browsers without CSS. I also think that CSS sprites are easier to manage as you are working with one image instead of many small images. Finally, you should also know how to implement CSS sprites.

jQuery Interview Questions

What are some benefits of using jQuery?

You should be able to vocalize the benefits of jQuery. It is lightweight, open source, has lots of plugins, and jQuery has a great community and user support. It is incredibly good at matching CSS selectors, it supports chains of actions, and it has many useful AJAX methods. These are just some basic reasons. You could also add that jQuery fixes many JavaScript cross-browser issues.


Name some jQuery methods.

There are so many, so you definitely should know some from your memory. How about hide(), show(), or toggle().


Here is a link to more jQuery specific interview questions: jQuery Interview Questions

More Resources for Interview Questions

1. Commonly asked JavaScript questions
2. Many JavaScript Interview Questions
3. JavaScript Quiz4. Another JavaScript Test
5. JavaScript Functional vs Object Oriented Programming
6. Building an Object Oriented JavaScript Framework
7. Web Developer Interview Questions
8. Interviewing Developers