React js or react-native with Asp.net Web API – User Registration, Login and Logout Operations part1

1. Install and Configure Required Modules for React.js We need additional modules for navigating the views, accessing RESTful API and styling the front end. Type this commands to install the required modules. npm install --save react-router-dom npm install --save-dev bootstrap npm install --save axios Next, open and edit `src/index.js` then replace all codes with this. import React from 'react'; import ReactDOM from 'react-dom'; import.

React.JS — Component Data Transfer

In React JS, there’s often a need to pass data from one component to another. If you are passing data from somewhere in a component, to somewhere else inside the same component, this can be done through state. So what is state? The heart of every React component is its “state”, an object that determines how that component renders & behaves. In other words, “state” is what allows you to create components that are dynamic and.

show hide divs in react js method 2

class App extends React.Component { constructor(props) { super(props); this.state = {text: '', inputText: '', mode:'view'}; this.handleChange = this.handleChange.bind(this); this.handleSave = this.handleSave.bind(this); this.handleEdit = this.handleEdit.bind(this); } handleChange(e) { this.setState({ inputText: e.target.value }); } handleSave() { this.setState({text: this.state.inputText, mode: 'view'}); } handleEdit() { this.setState({mode: 'edit'}); } renderInputField().

Server-side paging and sorting in React JS

Introduction This is the 3rd article of the series "React.js with asp.net MVC application".In the previous post, I have shown you Displaying tabular data from database in react js Today I am going to show you server-side paging and sorting  using React.js, ASP.NET MVC and entity framework.In the previous article, we fetched all the data from a server at once which can be a performance issue fetching a large.