Tag Archives: Resources

5 Must Reads to understand AngularJS Service and Factory difference

As a beginner or intermediate, a lot of JavaScript developers tends to get confused between two most vital components of AngularJS – Service and Factory.

Reason, both tend to do kind of similar job, well it looks like initially when we can’t really distinguish the proper usage. I too had these confusions and few of my colleagues happen to ask me this particular question often and often. So here I am, compiled the list of very good writings – this will give you a perfect answer on what are AngularJS Service or Factory, how to use them, what are the differences etc.

  1. Answer by Doug T on StackExchange
  2. Usage example by Gil
  3. A StackExchange Community Wiki 
  4. AngularJS: Factory vs Service vs Provider by Tyler (He has got a cool website, check that out)
  5. AngularJS Service vs Factory – video by DevelopMentor

I hope, after going through those Q/As and the video if you were still in doubt – you have a clear picture of what Service and Factory are made for in AngularJS.

Top 5 Articles on HTML5 Audio Video

Learn HTML5 Audio Video

1. Everything you need to know about HTML5 video and audio

Here, Simon Pieters, from Opera, will walk you through everything basics you needed to know about HTML5 Audio & Video features. He says:

This article aims to provide all the nitty-gritty details of HTML5 media, the DOM API, events, and so forth, so you can implement your own HTML5 player with fallback to old browsers.

2. HTML5 Audio and Video: What you Must Know

Bruce Lawson talks on Nettuts+ about must know facts regarding HTML5 Audio/Video.

3. Getting started with the HTML5 Audio Video API

Very quick & a short article to get you started on making your own media players on HTML5 Video.

4. Using HTML5 Video and Audio in Modern Browsers

This time, in-depth learning on API, learn about browser fall back & how to handle those legacy browsers – from SitePoint.

5. How to Make Your Own Video Player On HTML5 Video

Once again very depth article. This article will take you thoroughly on how you can create your very own media player using HTML5 Audio & Video.

That’s it. Hope you will learn from very basic to creating your own full functional media players. Happy coding!

PS: Image used in this post banner is taken from 356PSD.com

Learning Gamification

Learning Gamification

Applying game design principles & techniques to non-game elements to increase user engagement is Gamification.

Wikipedia says:-

Gamification is the use of game design elements, game thinking and game mechanics to enhance non-game contexts.

The very best example of Gamification is FourSquare app & Nike+.  It is very very new concept so it’s a kid in our era.

Here are lists of very good place to learn more about Gamification, how you can use it today & what is the future of Gamification.

  1. Gamification –  Coursera Class
  2. Gamification & UX – Smashing Magazine article.
  3. Gamification by Designbook
  4. The Purpose of Gamification – O’Really
  5. Five Rules of Gamification – Forbes
  6. Fun is the Future – Mastering Gamification – Google TechTalks video

Hope the list above going to help you readers get more insight & details on Gamification. Have you come across any good  articles similar? Comment it down below, I will read it.

10 Best Articles to Learn PSD to HTML Conversion

This list article contains links of good resources where you can learn very best ways and methods of coding up a PSD into workable HTML/CSS templates. Target is for novice folks. Articles listed below will help you master in HTML/CSS crafting with industry best practices.

PSD to HTML

  1. Converting a clean magazine-style PSD template to HTML/CSS

  2. Converting a Design From PSD to HTML

  3. Brilliante Blog Layout – Coding The PSD File Into CSS and HTML

  4. From PSD to HTML: Building a Set of Website Designs Step by Step

  5. How to Code up a Web Design from PSD to HTML

  6. PSD/HTML Conversion: Code a Clean Business Website Design

  7. Minimal and Modern Layout: PSD to XHTML/CSS Conversion

  8. Slice and Dice that PSD

  9. Building a Website (2 of 3): HTML/CSS Conversion

  10. From PSD to HTML the easy way – Using Ultimate CSS Framework

Top 10 Best Tools to Test your Mobile & Responsive Websites

Top 10 Best Tools to Test your Mobile Websites

Mobile Web Design, Responsive websites are the hottest trend in the Web industry now. Experts have made forecast that future is Mobile Computing. Luke’s infographic says more iPhone are sold in one day than babies born in the world.

Considering the trend nowadays we are working more on mobile websites, which is great. But do you have enough resources to check you work across multiple devices? I don’t have much. Here I have listed top 1o best tools to check mobile and responsive websites.

  1. Ripple

    Ripple
  2. iPhoney

    iPhoney
  3. Mobilify

    Mobilify
  4. Iphone4Simulator

    iphone4simulator.com
  5. The Responsinator

    The-Responsinator
  6. Mobilizer

    Mobilizer
  7. Opera Mini Simulator

    Opera-Mini-Simulator
  8. dotMobi Emulator

    dotMobi
  9. Nokia Mobile Browser

    Nokia-Mobile-Simulator
  10. Test iPhone

    TestIphone

That’s all for today. Any one of your favorite? Or any good one I missed? List them in comment below or RT us @CSSJunction