Thursday, June 29


Once the setup is complete and you are ready to rock and roll, the next step is to learn ReactJS framework. So lets get started.

1) Get the Bootstrap css file and import it in your index.html file.

2) Configure webpack to take an input file and convert to output file. Basically that is required because we would be using ES6, JSX etc which requires compilation into plain javascript. Thus webpack is required to do the necessary compilation for us.  See below screenshot.

3) Common way of writing in React is to add support for ES6 and JSX with Babel.
We would be using ES6 but with help of Babel using loaders that will transcribe to ES5. Babel polyfill will ensure support for older browsers.

Common way of building react component is using ES6. Some common packages that are required for development are Babel packages.
1) babel-loader - Webpackage library that helps convert code from ES6 to ES5
2) babel-preset-es2015
3) babel-preset-react  - Takes JSX and convert code for easy development.
4) babel-polyfill - For browsers that are older and don't support ES5, it ensures some polyfill.

Add in package.json

Add an entry in the webpack.config.js file for loader. We want all the .js files to be transpiled to ES5 excluding the node_modules folder. See below screenshot

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.