Sunday, June 11


Below are notes from the React tutorial I took from safaribooksonline.

Installation and Setup
1) Make sure you have node and npm installed.

2) Create a directory "public/img"

3) Run command "npm init"

4) Create a file "index.html" inside your public directory.
If you are using VSCode, it has emmet plugin already installed. By typing "!" and pressing tab, you will get the basic html ready to get started.

Setting up Webpack and WebPack-Dev-Server
1) Install webpack

Notice the parameter "--save-dev". It means that we want the the package to be installed for development purpose. Also this parameter will add an entry to our package.json file, so anyone who wishes to run our application on their local environment will just have to "npm install" and it will download the package automatically instead of performing installation of webpack explicitly.

2) Next step is to configure webpack. The best way to do is by creating a js file. Create a file "webpack.config.js" in parallel to "package.json".

3) To start the webpack server, go to "package.json" and add a your server to the scripts parameter as shown in screenshot below. Note the name of the script is "start".

Thus, to start a webpack server, go to console and run the command "npm run start" or "npm start" because "start" is a common keyword, "npm start" will work fine.

Wednesday, November 16

Angular JS Presentation

I was to give a presentation about Angular JS to my team, but due to my miscommunication, it got cancelled. I had spent a lot of time, first learning angular JS and then also working on some demo project which I planned to showcase to the team.

*Rants about me.. blah blah blah...*

Note to Self : People don't understand your sarcasm, don't effing try to be Chandler bing. You live in a developing country. *More Rant... blah blah blah... *

Anyways, I've uploaded the presentation on github pages. I loved using Reveal.js library for making presentations. It is one of the best library and I enjoyed working with it.

P.S: This post will not be complete without plethora of hashtags so here we go
#dontbestupid, #yousuckatsarcasm, #liveinindia, #idioticcommunicationskills, #ISUCK, #whocares, #livelife

Monday, June 27

What "if"

What "if" I had put in just a little extra efforts? What if I had solved that question paper again? What if I had...

The "If" is very subjective and whatever follows after "If" decides your fate.

Scene 1: What "If" I don't get selected even after putting so much efforts?
Scene 2: What "If" I had put in that extra efforts, I would have not missed that cut off.

It is the before and after scenario, but you get the gist.

So what is this post? Well, I recently answered this exam and when I saw my results, I had this "If" moment. What "If" instead of watching that FRIENDS episode which I had already seen umpteen times, I had solved that Maths problem? I could have got better rank, "If" I had prepared a little extra. I would have secured that Seat in my first round, I would not be left at the Mercy of the reserved categories. I cannot blame the Government or the reserved category candidates for my mistakes. I am sure they have their own reasons for their existence.

Well before giving the exam, I knew there was 50% reservation. Instead of thinking there are 60 seats, I should have concluded that there are 30 seats and work hard enough that I be in top 30. Not even top 30, work so hard that I am topping the list.

What went wrong?
Everything, and my Attitude. My attitude towards my goals. What makes me procrastinate, why I cannot get things done? May be I need help and the biggest change I need is in my Attitude.

Go get things done, you.

Life is just once, why waste it cribbing about your failures.

Thursday, June 16

Github - Pushing your code to Github

Lets say you have a project you want to upload to github for versioning. You can take following steps to get started.

1) Login to your account in and create a new repository

2) Navigate to your project folder via the command prompt and run
    >> git init
    This will initialize a repository in your file system.

3) Now we need to add all the files into local repository, which will stage it for commit.
    >> git add .
    The "." or "dot" at the end of command is to add all the files in the directory.

4) Next, commit the files and add a message to the commit
    >> git commit -m "Initial Commit"
    Commits the tracked changes and prepares them to be pushed to a remote repository.

5) We are now ready to push the changes of local repository. However, we should first make a pull request so that our local repository is up to date. Usually this step should be taken before we add any files to the repository.
    >> git pull <your_repository_url>

6) If there are no conflicts or issues, you can now push your local repository changes to the remote repository.
   >> git push
   You will be asked for your username and password of github, after successful validation your code will be deployed to github.

Thursday, June 9

Introduction to TypeScript

What is Typescript?
It is superset of Javascript. EcmaScript 5, EcmaScript 6 are javascript specification, however they are not widely available across browsers. What Typescript allows us to do is transpile our ES6 code to ES5 so that it works on all browsers. It also allows us to leverage some ES7 future features.

Benefits of Strong Typing
- In Javascript you can create a varialbe and assign a number or string as per your usage. However in Strong Typing, you can strictly assign a variable of certain type and if the type changes, during compile time it throws an error. Thus Strong Typing catch errors at compile time vs. runtime.
- There is better tooling (refactoring, autocomplete, etc) and hence you can avoid several classes of errors. Example of autocomplete would be when you have a method with three arguments, it would specifically give you autocomplete for only three arguments and warn you if you pass a fourth argument.
- Strong typing allows you to explicitly intent i.e it allows you to write code for humans. For example
 var x: number = 3;
 var y: string = x; //Error
In Typscript you also have dynamic type (using any) i.e
var x: number = 3;
var y: any = x //Works!!! 

In Typescript, you can have Object Oriented Javascript.

Installing TypeScript
1) Install node
2) Install npm
3) npm install -g tsc