React is a very popular and growing JavaScript library. When we think in the context of MVC architecture, React comprises the View in MVC architecture. For managing application state, we may need to rely on other JavaScript state management libraries like Redux or if you are using React v16+, so you can use React's Context API in combination with useReducer hook to serve our state management purpose. Good architecture makes the system easy to understand, easy to develop, easy to maintain, and easy to deploy. The ultimate goal is to minimize the lifetime cost of the system and to maximize

Hooks introduced in React 16.8, allow us to use stateful logic, lifecycle methods, and side-effects in Functional Components. React's official doc on Hooks is the best way to get you started with them. useRef is one such very helpful Hook that returns a mutable ref object having current property initialized with the value passed as the argument. This mutable object's value persists across multiple renders in the lifecycle of the component and can have various applications based on use-cases. In this blog, we'll understand different scenarios in which the useRef Hook can be helpful with the aid of examples.

As a Frontend developer and working on React for several months, one of the topics I have paid close attention to is Design Patterns. In this article series on React design patterns, I will share my learnings. This blog is completely about the design patterns which are widely used in React app development. So before diving deep directly into design patterns, we will look into a short introduction of React and JSX. React React is a JavaScript library for building user interfaces. It lets you compose complex UI from small and isolated pieces of code called Components. Component in React

This blog illustrates how we can easily setup a ruby on rails application with ReactJs as a front-end framework

There are many ways you can style react component you can use are Inline CSS and there are many React Libraries like typestyle which is good but there have some other flaws in it like it forces you to write CSS in javascript object means if you want to write CSS as background-color:red you would have to write as backgroundColor:'red' like this which seems very weird but if you use styled component is very simple and also it allows use style react in plain CSS First, we gonna create new project by using create-react-app CL which allows us

PreactJS is a fast 3kB alternative to React with the same ES6 APIFirst, some background…PreactJS is developed by Jason Miller — one of my programming heroes. The framework was developed with a goal of providing high performance, memory efficiency and close compatibility with React API with an aim to keep the footprint as small as possible i.e 3kb. Preact is increasingly getting adopted in the community with a bunch of high load websites already using it successfully in production. Housing Go is now powered by preact. 🔥 🎉 Thanks to @_developit and @brian_d_vaughn for their help. pic.twitter.com/

Server side rendering need lots of configuration to get up and running if you choose to use boilerplate which is filled with package that you may not need, well next.js is developed to solve this problem and it makes server-side rendering in React a breeze What you will learn in this article Get up and running with Next.js Add Client-side transitions between routes How to do handle Ajax in Next.JS create reusable component for rendering Layouts To get started with you need two things Nodejs and yarn installed  you can do that by typing npm install -g