Component Folder Pattern in React JS

Recently, while working with React I came across this scalable ‘Component’ folder structure and since then my app is well organised and looks un-cluttered. Let’s consider we have different components in our app as follows:

| – src/
++| – App.js
++| – SearchLoader.js
++| – SearchInput.js
++| – SearchError.js
++| – Button.js
++| – index.js
++| – TextField.js

The major problem I faced in the above directory structure is that as and when I kept adding components in my app, my src folder kept filling up. This created an issue when I had to find files related to a particular component. This gave me a hard time to find what I was looking for and cluttered my root folder. So I found the following approach which made it easy to organise my components.

Read More »

React Native – Up and Running your first App

Hi there, now that React JS has been around for a quite long time with its marvelous performance and one this is one of the reasons that today it is been used on a wide basis to develop Single Page Applications. It became more exciting with the coming of React Native to develop your mobile apps. As you know, React Native lets you build your app in JavaScript. And yes, this is a complete mobile app, not some hybrid app or mobile web app.

The reason I am writing this article is that, as a tech enthusiast with a curious mind, I started to learn React Native by building a small app. It is a new technology, it was a bit difficult at the beginning to set up the entire environment and get my app running. So for the new bees who are trying their hands on, in this new technology, I would like to share some steps to help you set up your dev environment and successfully run your first React Native app. This entire article will be a very basic to the point with reference to the Android app.Read More »

Quick guidance to build a Node.js API

Node.js seems a bit frightening to beginners, but it is not complicated at all. Here is a small tutorial which will help you to build your own node.js API within a fraction of an hour. This is a very quick and simple guide to Node.js, express framework and MongoDB.

You can access the entire code on GithHub.

Before you start building your API, you should know the basics of JavaScript, CRUD operations and REST APIs. Here you will be creating an API for a simple todo application where you will perform CRUD operations like create, read, update and delete on your todos.Read More »

Building ES6 JavaScript for the Browser with Gulp and Babel.

“ES6” which stands for ECMAScript 2015(6th Edition) is the current version of the ECMAScript Language Specification standard. It is the most recent update to Javascript and it has brought many changes to the language which makes it simpler to use and understand. As it is the latest update, you might want to use it in your browsers because obviously you want to be updated with the latest trends.

Read More »