How The Web Works (And How It Is Changing) 2013-01-01

When I started web development, I frequently heard other developers talk about the client, the server, and the database. At the time, I had no idea what that stuff was all about. And I frequently hear questions from other newbies as to what they are talking about. So, I decided to write an article that explains the web, the way developers see it -


The web is made up of four components - (1) the server, (2) the client, (3) the database, and (4) the code.

The Client -

The client is the computer on which the user visits a web page. Your computer is being a client right now, as you're seeing this web page. Every web page lives on a server. When you visit a web page, the client sends a request to the server. The server responds by sending a web page to the client, and then you can see the web page.

The Server -

The server is the machine on which the web page lives. As described previously, when a client tries to visit a web page, the client sends a request to the server. The server responds by sending back a web page. If you use a framework like Rails or Django, the server is also where most of the code is run. For example, when a user clicks on a button (the click is registered as an 'event') on a web page, the client sends a message to the server. Based on this, the server may run some code (sometimes called 'event handler' code), and send some output to the client.

The Database -

A database is used to store site-related data. For example, Facebook uses a database to store information about their users, and their users' posts. Twitter uses a database to store users and their tweets. The database lives on the server, and sites interact with their databases via their code.

The Code -

The code generally lives on the server. It does things like modifying the database, and making a site more interactive. For example, when a user creates a Twitter account, the client sends a message to the server. The server then runs some code, which adds the user to the database, and sends the user's profile page to the client. The next time the user tries to login, the client tells the server, the code on the server checks the database for the same user data, and if it exists, the user's profile page is sent back to the client.


How The Web Is Changing -

Code On The Client -

Since the introduction of Javascript, code that web sites use has been moving to the client.

Database Cache On The Client -

As sites are trying to be more and more interactive and responsive, it has become necessary for them to start using a database cache on the client. This allows them to perform database actions faster, because they don't have to wait for the server.

Latency Compensation -

This might be a Meteor-only thing, but I decided to cover it anyway. As mentioned previously, sites have started using a database cache on the client. But, they still maintain a database on the server. Why two databases? With a database cache on the client, when a client performs an action, they get to see it completed immediately, without waiting for the server. Later, when the client and server have synchronized, if the server doesn't agree with the client's data, the client's data is patched up. This lets a site be interactive, and be synchronized between clients.

Responsive Design -

As more and more smartphones and tablets are capable of web-browsing, sites are required to be mobile browser friendly. By designing a site responsively, it can change its layout based on screen size and orientation.

What This All Adds Up To -

Since code is moving to the client, this means sites can be more interactive. They can respond to events faster, because they don't have to send messages to the server and wait for a response. Latency compensation allows users to see their database actions completed immediately, and still be in sync with the server and other clients. Since both the database and code are on the client, we can say apps are moving to the client. And this means the web is becoming more interactive.

Intro To Markdown 2012-12-03

This is Markdown

And it's awesome

Markdown is a text-to-HTML converter that is easy to write and read. You don't have to use HTML tags anymore. You just use some simple symbols to signify different HTML elements, and you write your content. But, this doesn't mean Markdown isn't powerful, or that Markdown has limits. Anything you can create with HTML, you can create with Markdown.

A quick overview of some of the basic stuff you can do with markdown -

Lists

Unordered lists -

  • List item 1
    • Sub list item 1
    • Sub list item 2
  • List item 2
  • List item 3

Ordered lists -

  1. List item 1
    1. Sub list item 1
    2. Sub list item 2
  2. List item 2
  3. List item 3

Tables

Here's a basic table (the table doesn't appear right on my blog) -

Table Header Table Header
Table Data Table Data
Table Data Table Data

Meteor, The Awesome New Web Framework 2012-11-11

When it comes to web frameworks, there are a reasonable amount of options. Django and Rails are two of the more popular frameworks. I've tried both of them and didn't really like any of them. In fact, they really put me off web development for a while. That was, until I found Meteor. Meteor allows people to write interactive, Javascript based applications that can run code on the client. It uses Node.js and is written completely in Javascript. One of the really cool features of Meteor is that it does something called a 'hot code push'. This means that, if you change some code while running your app, it will automatically push those changes to the browser, without you having to reload. And another feature that is really unique is Meteor's concept of 'smart packages'. In an app, you can use multiple smart package. A smart package can do things at and before runtime. Things like compiling preprocessors, or restricting the client from accessing data. Smart packages such as the 'accounts-google' smart package allow users to sign in to your app using their Google accounts. By default, Meteor uses a MongoDB backend for all apps. Meteor is fully open source, and you can check it out at http://meteor.com. You can also see a chatting app I recently coded with Meteor at http://chattr.meteor.com. The source code for the app is at http://github.com/AjayMT/chatter-new. To see lots of other cool apps look at http://madewith.meteor.com.

First Post 2012-11-10

This blog is a continuation of my previous blog (http://ajay-madhusudan.blogspot.com). I chose to switch to ruhoh because it offers a higher level of customizability. Please tell me what you think!