Quick Tip: Rails Escaping Database Values and Storing/Inserting with Multi-Insert SQL Query

In this quick tip we’ll see how to escape values in Rails before passing them on to an SQL query (preventing injection attacks) and then also look into how to do multi-inserts (at the DB level). Let’s first see how to escape values to prevent SQL injections in Rails:

Continue reading

Single Sign On (SSO) for Multiple Applications with Devise, OmniAuth and Custom OAuth2 Implementation in Rails

Recently I had to implement Single Sign On (SSO) for one of the Rails app I’d been working on. Since Devise is already fairly popular to integrate an authentication system in Rails app, I was more inclined towards using it to achieve SSO. So essentially what was required is a single user manager app that can act as a Provider (OAuth2 ?) and different applications (or Clients) that can authenticate themselves using this same user manager. An important part of SSO is, once you sign in to one of the client, you should automatically be authorized to access all the other clients (their login-protected sections/modules). Similarly, logging out from one service should log out from all other services.

Continue reading

Passing Data Across Components with Contexts in ReactJS

Using React Contexts we can communicate across a hierarchy of Components. To understand this, think of a widget represented by a View component which has lots of child view components. You might use/re-use this component and want to pass certain properties or attributes that are relevant to different child components affecting the overall state (look and behaviour) of the main component in combination. Now one way to achieve this is by using props. But imagine passing an attribute all the way down from the parent to a child at the 5th level in the hierarchy. At every component level the property passed from the parent will have to be accessed (this.props.propName) and further passed down. This can get really messy. So let’s see how contexts can be used to pass data across components in a much elegant manner.

Continue reading

An Overview of OOCSS, BEM, SMACSS (CSS Methodologies/Practices) with References

Writing CSS is really simple, we’ve been doing that since many years. But the problem is, in larger projects where the CSS code grows over thousands of lines, whether you’re alone or it is a team maintaining and building on the code, it gets really unwieldy (spaghetti code). Code gets hard to maintain, harder to debug, unoptimized leading to poor performance and highly inefficient. New team members start adding more code (classes, IDs, etc.) and start using them leading to a lot of redundant and unoptimized code here and there. Basically it gets hard, really hard. You end up into too many issues.

Continue reading

React Integrating Routing to Material UI’s Left Nav (or Other Components)

Working with the React Material UI and trying to make routing work (or even understand how it works) with clicks on the LeftNav item items ? It’s actually quite simple once you get a hang of it. I’ll show you the code and explain the logic behind how on clicking navigation links in LeftNav you navigate to different pages/URLs in your app/website (in a snap). We’ll be using React Router, Material UI and obviously, ReactJS itself. I’ve also uploaded the code to Github.

Continue reading