server.js 
const express = require('express');
const axios = require('axios');
const cors = require('cors');

const app = express();
const port = process.env.PORT || 3000;

app.use(cors());

// Define a route to fetch Instagram user data by username
app.get('/api/user/:username', async (req, res) => {
  const username = req.params.username;
  try {
    // Make a request to the Instagram URL to fetch user data
    const response = await axios.get(`https://localhost:3000/api/v1/users/web_profile_info/?username=${username}`);
    
    // Extract the relevant user data from the response
    const userData = response.data.graphql.user;
    
    // Send the user data back to the client
    res.json(userData);
  } catch (error) {
    console.error('Error fetching user data:', error);
    res.status(500).json({ error: 'An error occurred while fetching user data.' });
  }
});

app.listen(port, () => {
  console.log(`Server is running on port ${port}`);
});


app.js
import React, { useState } from 'react';
import { View, TextInput,Text, Button, Image } from 'react-native';
import axios from 'axios';
import './index.css';

const App = () => {
  const [username, setUsername] = useState('');
  const [profilePicture, setProfilePicture] = useState('');
  const [error, setError] = useState('');

  const fetchProfilePicture = async () => {
    try {
      const response = await axios.get(
        `https://localhost:3000/api/v1/users/web_profile_info/?username=${username}`
      );

      // Extract the profile picture URL from the response.
      const profilePictureUrl =
        response.data.graphql.user.profile_pic_url_hd;

      // Update the state with the profile picture URL.
      setProfilePicture(profilePictureUrl);
      setError('');
    } catch (error) {
      console.error('Error fetching data:', error);
      setError('User not found or an error occurred.');
      setProfilePicture('');
    }
  };

  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>Instagram Profile Viewer</Text>
      <TextInput
        placeholder="Enter Instagram Username"
        value={username}
        onChangeText={(text) => setUsername(text)}
      />
      <Button title="Find Profile" onPress={fetchProfilePicture} />
      {error ? (
        <Text style={{ color: 'red' }}>{error}</Text>
      ) : (
        profilePicture && (
          <Image
            source={{ url: profilePicture }}
            style={{ width: 200, height: 200 }}
          />
        )
      )}
    </View>
  );
};

export default App;