Getting start with React Native


Bookmark and Share

React Native lets you build mobile apps using only JavaScript. A React Native app is a real mobile app. It uses the same design as React, letting you compose a rich mobile UI from declarative components.

Installation

Using Create React Native App we can start building a new React Native application easily. It allows you to start a project without installing or configuring any tools to build native code – no Xcode or Android Studio installation required.

Assuming that you have Node installed, you can use npm to install the create-react-native-app command-line utility:

Try creating a new project:-

This will start a development server for you, and print a QR code in your terminal.

To run your app,

Install the Expo client app on your iOS or Android phone and connect to the same wireless network as your computer. Using the Expo app, scan the QR code from your terminal to open your project.

Basic App

In the App.js file you can see:-

import, from, class, extends, and the () => syntax in the example above are all ES2015 (also known as ES6)  features. The unusual thing in this code example is.<Text>Hello world!</Text> This is JSX – a syntax for embedding XML within JavaScript. <Text> is a built-in component that just displays some text. This code is …

Read More

Observer Design Pattern in Ruby


Bookmark and Share

Observer design pattern (also known as Publish/Subscribe) is a software design pattern, used when we are building a system where the state of one object affects the state of other objects. It is a key part of model-view-controller architectural pattern.

In a traditional MVC ( Model-View-Controller ) architecture, a model is a subject and a view is an observer. A view is notified when a model changes and responds accordingly. When the subject sends observers detailed information about what has changed, indiscriminately, this is known as the push model of the Observer pattern. When a subject sends only minimal information to its observers must ask for details explicitly, this is known as the pull model of the Observer pattern.

Observer Design Pattern

Ruby provides a simple mechanism to implement this design pattern using the Observable module. In this mechanism, the Notifier class uses the Observable module, which provides the methods for managing the associated observer objects.

The observable object must:

  • assert that it has #changed
  • call #notify_observers

An observer subscribes to updates using #add_observer, which also specifies the method called via notify observers. The default method for notify observers

Read More

Getting started with Angular 4


Bookmark and Share

Angular is a most popular platform for building applications with the web. Angular empowers developers to build applications that live on the web, mobile, or the desktop. The AngularCLI is a command line interface tool that can create a project, add files, and perform a variety of ongoing development tasks such as testing, bundling, and deployment.

As compared to the older versions of Angular, there are many new things added to the list. Not only new features but also some twists are there that enhance old features. Forget Angular 3, Google jumps straight to Angular 4 after Angular 2. Angular4 applications are much faster and less space consuming.  Angular4 is compatible with TypeScript’s newer versions 2.1 and 2.2. Components are the basic building blocks of your application. Every component has an associated template, style sheet, and a class with logic.

Prerequisites

1. NodeJS ( 6.x.x or greater )

2. npm (3.x.x or greater )

Installation

1. You have to install AngularCLI globally.

2. Create a new project.

3. To serve the application, get into the project repo and run :

For launching our server and for rebuilding our app …

Read More

Rails Generators


Bookmark and Share

Rails generators are used to create many files for models, controllers, views, unit tests, migrations and more. It will do some of the manual work for us. So it saves time. They can also be used to set up some basic specs for the application test suite.

Running rails generate(or rails g) by itself gives a list of available generators:

The main generators that rails offers are:

  • controller: The Rails controller coordinates the interaction between the user, the views, and the model.
  • helper: Code in helpers is included in the corresponding view. We can move big loops, method calls or other logic into a method in the helper.
  • mailer: It allows for sending and receiving emails from and to your application.
  • migration: Rails Migration allows you to use Ruby to define changes to your database schema.
  • model: It is Ruby class that talk to the database, store and validate data, perform the business logic.
  • scaffold: It refers to the auto-generation of a simple set of a model, views and controller usually for a single table.

Following is the list of options, which can be used along with generators:

-h, [–help] # Print generator’s options and usage
-p, [–pretend] # Run but do not make any changes
-f, [–force] …

Read More

Getting Started with Vue.js


Bookmark and Share

 

Vue.js

What is Vue.js?

Vue.js is yet another JavaScript framework getting popular considering its simplicity praised a lot these days. There are a lot of JavaScript frameworks among which React and Angular are popular among web developers. Vue.js pronounced as “view.js”  is a much flexible and less opinionated framework than Angular. It’s similar to React but much simpler.

Vue.js gives you more freedom in designing your app, unlike Angular. So that you are not forced to do everything in their way. It can be adapted very easily to your existing application. You don’t need to know JSX, unlike React. All you have to do is to drop the link into your HTML page header and you are up and ready.

Overview

This is the basic folder structure.

– index.html

This is the main HTML template for your application. You can link your static assets inside the head tag while your processed assets will be auto injected in the body.

– src/router/index.js

This is the file which initiates vue-router with the given …

Read More

to_json vs as_json in Rails API


Bookmark and Share

Recently we have been working on Rails API. During that time, we were curious about the difference between as_json and to_json. In this article, we are sharing the difference we learned.

to_json in Rails API

Let’s discuss how we started out building our APIs using ‘to_json’. to_json will return JSON string representing the hash. Option are passed to each element.

In to_json without any option,  the returned JSON string will include all the model attributes

to_json had some great options of ActiveRecord objects. We could just tell the method to only render certain attributes, or to include association or method calls. We had:

  • only – Only show column names in the output as specified in the list
  • except – Show all column names except the ones specified in the list

to_json works fine and seamlessly ok, as long as the database schema is deeply coupled with the API output.When it takes the next level where we want to render a certain attribute in json it start to break.

This will start to generate a bit load to controllers. Such methods of generating json don’t feel quite right and begin to break down. This is because the to_json is interested in ‘serializing’ a …

Read More

Setup your rails application with one command


Bookmark and Share

Generally setting up a rails app is running some same set of commands, for example installing gem, creating database, loading schema and start rails server.

We can create a script and run it to setup our application since Rails 4.2 a bin/setup file is generated by default.

Here is the example of setup script.

Setup script sets your rails application for development environment instantly.  This is helpful when a new developer trying to set up your application or when setting up an application on a new machine. We should keep the setup script updated.

Let’s understand the setup script step by step and modify according to our requirements.

First setup basic required library and path of our application in APP_ROOT

Now system! method here execute the commands passed to it and shows the backtrace of error in case of command fails.

system will execute the given rails command and abort will stop script execution and will show us the backtrace of failed command, we can modify it if we don’t want to stop the execution of the script and get some custom error messages.

In the below snippet of the script, we are going to our application root and performing operations.

To create config file …

Read More

Authorization with Pundit gem


Bookmark and Share

 

Security is an important aspect of application development. Two main components of security are Authentication (Who are you?) and Authorization (are you supposed to be here?). Authentication verifies the user’s identity while authorization verifies whether that user has access rights on certain resources to perform actions on them.

Two popular gems for authorization in the rails world are CanCanCan and Pundit, we at Red Panthers prefers pundit over CanCanCan we get to write Pure Ruby Objects and keep the logic for each part separate.

The gem CanCanCan isolates (encourages) all authorization logic into a single class. It is a drawback when the complexity of application increases. Pundit gem provides object oriented design patterns to build our own authorization system that meets project’s requirements. It enables us to keep the models and controllers free from authorization code and allows to keep the resource logic separately. This flexibility and simplicity of Pundit gem help to use it with ease.

To start with Pundit

Add Pundit gem to your gem file and run bundle install.

Integrate Pundit to Rails application by adding the following line to ApplicationController.

If you run the Pundit’s generator as below, it will generate app/policies folder which contains …

Read More

Taking screenshots of webpages using Ruby


Bookmark and Share

 

Recently we have been working on taking screenshots for web page while generating reports based on that website. During this endeavor, we came across some tools to achieve that. We are sharing the information we gathered here.

The tools that we will discuss for screencapture, in  Ruby,  are:

  • PhantomJS
  • Screencap gem
  • Webshot gem

Screencap and webshot are gems in Ruby that depends on a tool called PhantomJS. It is basically a web browser without a user interface, primarily used for testing websites. Such type of browsers are generally referred to as headless browsers,

Screenshots with PhantomJS

PhantomJS is quite easy to install and is multiplatform, available on major operating systems.

To start, our script must require a reference to the webpage module then use it to create an instance:

Use the instance.open() method and pass it the arguments, the url of the webpage that we want to capture screenshot.

instance.render() method captures the screenshot and saves it to the file specified in the argument.
Run the script as,

Screenshot is saved in the  directory where we run the script.

Now what we have above is all JavaScript, but to use the phantom JS in our rails application we have gems that provide us with an easy interface to acheive the …

Read More

Difference between Date, Time and DateTime


Bookmark and Share

Date and time are one of the most important aspects which every coder has to deal with in Ruby. Well, let’s get to know how we keep it up alive and functional.
There are 3 different classes in Ruby that handles date and time. They are Date, Time and DateTime. Date and DateTime classes are both from date library. And Time class from its own time library.

In this article we’ll see how Date and Time works. Let’s have a look at each one of them.

Date

When you need a string format of year, month and day, you have to go through Date class.

  • Has date attributes only (year, month, day)
  • Based on integer whole-day intervals from an arbitrary “day zero”
  • Can handle date arithmetic in units of whole days
  • Date object is created with ::new, ::jd, ::ordinal, ::commercial, ::parse, ::strptime, ::today, Time#to_date etc.
  • Takes 4 bytes to store.

Eg:

Time

If you need both date and time values, we can make use of Time class.

  • Has date and time attributes (year, month, day, hour, min, sec, subsec)
  • Can handle negative times before unix time
  • Can handle time arithmetic in units of seconds

Eg:

Also rails provide a really good time class called ActiveSupport::TimeWithZone. It contains all the features the Time

Read More