Posts

Showing posts with the label React Native

React Native - GridView Layout - Mobile Application development

Image
  Congratulations! You are standing in the right place!  In this article, w e are engendering a customized GridView for both android and iOS applications. We are going to create a mobile app like below, Implementation: 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. Next, we are going to edit the  App.js  file and write the below code. Import AppRegistry, StyleSheet, FlatList, Text, View, Alert and Platform component in your project. import React, { Component } from 'react' ; import { AppRegistry, StyleSheet, FlatList, Text, View, Alert, Platform } from 'react-native' ; Engender constructor in your project’s class and inside that constructor define super( ) method with props inside i

Display Image in React Native - Mobile Application - Example

Image
  Congratulations! You are standing in the right place! In this article, we will discuss h ow to exhibit image in react native application utilizing online URL. We are going to create a mobile app like below, Implementation: 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. Next, we are going to edit the App.js file and write the below code. import React, { Component } from 'react' ; import { AppRegistry, Image } from 'react-native' ; export default class App extends Component { render() { let Image_URL ={ uri: 'https://raw.githubusercontent.com/knowledgefactory4u/ Javascript/master/photo-1611337449232-e3183e932494.jpeg' }; return ( <Image source = { Image_URL } style =

React Native - Rest API calls using Axios - Mobile App development

Image
  Congratulations! You are standing in the right place! In this article, we will discuss how to use  Axios  to access the Rest API within a React application. We are going to create a mobile app like below, Implementation: 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. Next, we are going to edit the App.js file and write the below code. import React, { useEffect, useState } from 'react' ; import { FlatList, Text, View } from 'react-native' ; import axios from 'axios' export default App = () => { const [isLoading, setLoading] = useState( true ); const [data, setData] = useState([]); console.log(data); useEffect(() => { axios( 'https://raw.

React Native - Rest API calls using Fetch - Mobile App

Image
Congratulations! You are standing in the right place! In this article, we will discuss how to use Fetch to access the Rest API within a React application. We are going to create a mobile app like below, Implementation: 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. Next, we are going to edit the App.js file and write the below code. App.js import React, { useEffect, useState } from 'react' ; import { FlatList, Text, View } from 'react-native' ; export default App = () => { const [isLoading, setLoading] = useState( true ); const [data, setData] = useState([]); console.log(data); useEffect(() => { fetch( 'https://raw.githubusercontent.com/knowledgefactory4u/Javas