Posts

Showing posts from January, 2021

React Native - FlatList - Mobile App Development

Image
Felicitations! You are standing in the right place!  In this example, we provide hardcoded elements to the data prop. Each element in the data props is rendered as a Text component. Our screen will look like this − Implementation First, You must set up your local development environment. Follow the below link to set up your local environment.   https://www.knowledgefactory.net/2021/01/react-native-environment-setup-create-demo.html After executing the commands mentioned in this  link , a folder with a specified name is created with the following contents. Import  StyleSheet, FlatList, Text, View, and Alert  component in our project. import React from 'react' ; import { StyleSheet, FlatList, Text, View, Alert } from 'react-native' ; Engender constructor in our main class. Using this.state   we are defining the FlatList items array with key constructor(props) { super(props); this .state = { ListItems: [ { key: 'Javacsript' },

Building Reactive Rest CRUD APIs Using Spring Boot, WebFlux, and MongoDB

Image
Hello everyone, today we will learn how to use Spring Boot, Spring WebFlux, and Spring Data to create a reactive web service that interacts with MongoDB. Reactive APIs are non-blocking and tend to be more efficient because they’re not tying up processing while waiting for stuff to happen. Reactive systems adopt asynchronous I/O. Reactive apps allow us to scale better if we are dealing with lots of streaming data.  If we are going to build a reactive app, we need it to be reactive all the way down to your database. Use a blocking JDBC driver with Spring WebFlux, and we will be displeased with its performance. Use a reactive NoSQL database like Cassandra, MongoDB, Couchbase, and Redis – and we will be satisfied with its performance. Spring WebFlux uses a library called Reactor for its reactive support. The Reactor is an implementation of the Reactive Streams specification. The Reactor Provides two main types called Flux and Mono . Both of these types implement the Publisher interface p

React Native - Switch - Mobile Application Development

Image
Felicitations! You are standing in the right place! In this example , we initially set the Switch value to false and exhibit a Text with 'No'. When the value of Switch change to true by calling onValueChange the Text component is reset to 'Yes'. Our screen will look like this − Implementation First, You must set up your local development environment. Follow the below link to set up your local environment.   https://www.knowledgefactory.net/2021/01/react-native-environment-setup-create-demo.html After executing the commands mentioned in this  link , a folder with a specified name is created with the following contents. Import StyleSheet, Switch, View, and Text  component in our project. import React from 'react' ; import {StyleSheet, Switch, View, Text } from 'react-native' ; Declare State The state is generally initialized in the constructor and then call setState when we want to change it. state = { married: false }; Engender a Root

React Native - SectionList - Mobile Application Development

Image
Felicitations! You are standing in the right place! Today , we engender a SectionList with title and data. The section prop is utilized to engender the list of title and data values. The renderSectionHeader exhibits the header section of the list view. Our screen will look like this − Implementation First, You must set up your local development environment. Follow the below link to set up your local environment.   https://www.knowledgefactory.net/2021/01/react-native-environment-setup-create-demo.html After executing the commands mentioned in this  link , a folder with a specified name is created with the following contents. Import SectionList, StyleSheet, Text, and View component in our project. import React from 'react' ; import { SectionList, StyleSheet, Text, View } from 'react-native' ; Engender a Root View in render’s return block. render() { return ( <View style={styles.container}> <SectionList se