2012 in review

The WordPress.com stats helper monkeys prepared a 2012 annual report for this blog.

Here’s an excerpt:

600 people reached the top of Mt. Everest in 2012. This blog got about 8,700 views in 2012. If every person who reached the top of Mt. Everest viewed this blog, it would have taken 15 years to get that many views.

Click here to see the complete report.

ConsoleBitly – A thin wrapper around the bit.ly

bit.ly, the web service that offers shortening of long URL’s was something that I was quiet frequently using all the, because it was easy for me to remember some of the long URL’s. So I often used to visit their service, paste in my long URL and get a short URL. So, I just thought of checking out their API methods because I was really bored of visiting their website every time and their API documentation was in fact helpful to me. The API did not just only include shortening of URL’s, but also expanding them, looking up for a bit.ly URL associated for a specific URL and much more.  And, hence I decided to write a class that would wrap around most of the useful methods of the bit.ly API.

I am a beginner to the Python programming language, and I am just loving every bit of Python. So, I decided to write the class in Python, that would display me the results in my Linux terminal.

The below link, consists of all the necessary documentation of using this API.

https://github.com/swaroopsm/Console-Bitly

Display JSON data using jquery/ajax

JSON -  Javascript Object Notation, is one of the beautiful techniques for parsing data. It’s beautiful primarily because it is light weight!

Here, I’m going to demonstrate how to display JSON data using ajax and jquery.

Let’s read some sample json data that is available in a file called json.test.js


[
 {
 "LinuxID":"1","LinuxDist":"Debian","Company":"Debian Project"<br>
 },
 {
 "LinuxID":"2","LinuxDist":"Ubuntu","Company":"Canonical Ltd."<br>
 },
 {
 "LinuxID":"3","LinuxDist":"Fedora","Company":"Fedora Project"<br>
 }
]

Now let’s write the html and javascript to display these results:

We call this file called displayjson.html:

<!DOCTYPE html>
<html>
<head>
<title>Display JSON data</title>
</head>
<body>
<div id="results"></div>
</body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$.post("json.test.js",
function(data){
var obj=jQuery.parseJSON(data);
for(var i=0;i<obj.length;i++){
$("#results").append("Linux ID: "+obj[i].LinuxID).hide().fadeIn(500);
$("#results").append("<br>Linux Distribution: "+obj[i].LinuxDist).hide().fadeIn(500);
$("#results").append("<br>Company: "+obj[i].Company).hide().fadeIn(500);
$("#results").append("<br><hr>").hide().fadeIn(500);
}
});
});
</script>
</html>

 

Check out examples at Fun with JSON.
That’s it folks, enjoy!

Web Design made easy – Twitter Bootstrap

Do you really think you are bad at web design, but excellent working with the backend and have sound knowledge web development? Do you always search and spend most of your time designing a web page layout or browse for web templates? Well not to worry! Twitter has introduced Bootstrap that is a css file with excellent styling and layouts where in you can modify the code and ou are free to use. It also includes essential javascripts like popup boxes, tool tips etc that you often use in your website.

You are free to use bootsrap and modify the source.

Image

This is available at http://twitter.com/bootstrap

You can also pull my project code from my github repository designed in twitter bootstrap. You can get it from https://github.com/swaroopsm/cellbay/

Adding your website to google

You have hosted your website online and you search it in google…. You will be really surprised if u do not find it on google… Right??…. Then what you do….

Your site has to be registered in google search engine if you wish to see the result…. You can do this by specifying it in the google webmaster tools provided by google…

Just sign in with your google account and go to http://www.google.com/webmasters/ and add your site….. Once you add it you are required to verify whether that website belongs to u or not… There are several instructions provided such as adding a meta tag to your webpages or by adding a file provided by google webmasters such as: [googlee2cf84c6de39a3e2.html] or similar and visiting this particular page… for eg., http://www.mysite.com/googlee2cf84c6de39a3e2.html

Once you visit this your website has been verified and successfully added to search results of the google search engine….

Now your website is registered, and in the webmasters tools you can find a couple of tools for optimizing the searches and much more…….

That’s it…

Installing LAMP on ubuntu

LAMP – Linux Apache Mysql Php

If you are thinking of web development and you are a free and open source software lover, then LAMP is the ideal tool for you in developing high-ended dynamic web applications…

Here, i’ll show you how to install LAMP on a Linux system that is running the Ubuntu flavor OS…..

So let’s get started…….

  • Install Apache 

We install Apache first – which is the web server.

Open the terminal by: ctrl+alt+t and copy, paste the following command in your terminal:

sudo apt-get install apache2

Enter the password to grant administrative privileges and press enter….

In order to test whether apache is running or not open your web browser and type:

http://localhost/

You will see a default folder, open it and you’ll see the message: It Works!  Continue reading

Creating a simple web page for smart phones using jquery mobile

Android, iPhone, blackberry etc…, these are the things that you often hear when some speaks about phones.. And moreover you spend more time browsing for mails and accessing some web applications on your mobile phones rather than your PC’s… Also as a web developer/designer you always keep the cross-browser constraint in your mind… And when it comes to accessing web applications on your mobile devices it’s a much more pain.. You always think of having something that is more light-weight and is both cross-platform and cross-device…
Well with jquery mobile framework, these constraints are resolved…

jquery mobile is a framework that provides a rich user interface for all popular mobile device platforms and most of all, it is light-weight and flexible.. it also has a rich set of widgets and styling that are easily made available for users… All you have to do is to include the jquery mobile library and a set of stylesheets are available at http://jquerymobile.com/download/… Alternatively you can also specify.,

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>

</pre>
So that’s what you are required to include in your webpage…. Now let’s get started by creating a simple ui webpage…

Since jquery mobile is an HTML-5 based user interface, much of the traits are derived from HTML-5…

Consider Mr. Swaroop would like to have a small web app on his phone which shows him a summary of his To-Do lists and some of his weekend plans and he wants it in the following format….

Let’s design this using our jquery mobile now….  Continue reading

Why use Dropbox

The world is saying “Cloud Computing!!”. Today you always carry a pendrive in your pocket.. Data is a very valuable thing, and having a mechanism to port that data is even more necessary… Consider you are a student and you have stored some important notes  in your pendrive and you want to show it to your teacher.. You leave your pendrive at home… An option would be going back to your home and get the pendrive… On your visit back home which is some miles away from your college, you get to know that your cousin who is at home has formatted your pendrive and as a result all your data is lost…. And unfortunately you do not have a copy of this data in your PC.. You also haven’t uploaded these files into your mail because you did not have the patience to upload it…. But right now the odds are against you!!! Your data is lost!!

You also would have saved your files in multiple computers and in order to fetch these data you’ve got to insert your pendrive each time as you operate these systems and get the data which is pretty time consuming….. Well, you don’t have to worry for all these problems caused!! DROPBOX is the solution to all of these…

So what is Dropbox??


Dropbox is a service that gives you cloud storage that allows you to store and share files on the internet that uses file synchronization… It’s very simple to use… Continue reading