Importing data from json file into Checkbox and get multiple of them when adding new data

What I am trying to do is import my JSON data into the Checkboxes i made and not use text.

As you can see i have now multiple checkboxes but there needs to be only one that fetches the data from my json file to make multiple.

And everytime I add data to the json file a new checkbox needs to appear. I am still new to react native so all help would be appreciated.

import React from 'react';
import { StyleSheet, Text, View, TouchableOpacity } from 'react-native';
import {CheckBox} from "native-base";
import { globalStyles } from '../../../styles/global';
const GLOBAL = require('../../assets/Globals');
const lessondata = ("../../assets/json/" + global.currentLesson + ".json");
import jsondata from "../../assets/json/1.json";

export default class App extends React.Component {
  state={
    selectedLang1:false,
    selectedLang2:false,
    selectedLang3:false,
    selectedLang4:false,

  }

  
  render(){
    const {selectedLang1,selectedLang2,selectedLang3,selectedLang4} = this.state
    return (
      <View style={styles.container}>
        <View style={styles.item} >
            <CheckBox checked={selectedLang1} color="#fc5185" onPress={()=>this.setState({selectedLang1:!selectedLang1})}/>
            <Text style={
              {...styles.checkBoxTxt,
                color:this.state.selectedLang1?"#fc5185":"gray",
                fontWeight:this.state.selectedLang1? "bold" :"normal"
              }}
              >Python</Text>
        </View>
        <View style={styles.item}>
            <CheckBox checked={this.state.selectedLang2} color="#fc5185" onPress={()=>this.setState({selectedLang2:!selectedLang2})}/>
            <Text style={
              {...styles.checkBoxTxt,
                color:this.state.selectedLang2?"#fc5185":"gray",
                fontWeight:this.state.selectedLang2? "bold" :"normal"
              }}
              >Javascript</Text>
        </View>
        <View style={styles.item}>
            <CheckBox checked={this.state.selectedLang3} color="#fc5185" onPress={()=>this.setState({selectedLang3:!selectedLang3})}/>
            <Text style={
              {...styles.checkBoxTxt,
                color:this.state.selectedLang3?"#fc5185":"gray",
                fontWeight:this.state.selectedLang3? "bold" :"normal"
              }}
              >Php</Text>
        </View>
        <View style={styles.item}>
            <CheckBox checked={this.state.selectedLang4} color="#fc5185" onPress={()=>this.setState({selectedLang4:!selectedLang4})}/>
            <Text style={
              {...styles.checkBoxTxt,
                color:this.state.selectedLang4?"#fc5185":"gray",
                fontWeight:this.state.selectedLang4? "bold" :"normal"
              }}
              >C#</Text>
        </View>
        <TouchableOpacity style={styles.submit}>
          <Text style=>SUBMIT</Text>
        </TouchableOpacity>
  
  
      </View>
    );
  }
  
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#f6f6f6',
    alignItems: 'center',
    justifyContent: 'center',
  },
  header:{
    fontSize:25,
    fontWeight:"bold",
    color:"#364f6b",
    marginBottom:40
  },
  item:{
    width:"80%",
    backgroundColor:"#fff",
    borderRadius:20,
    padding:10,
    marginBottom:10,
    flexDirection:"row",
  },
  checkBoxTxt:{
    marginLeft:20
  },
  submit:{
    width:"80%",
    backgroundColor:"#fc5185",
    borderRadius:20,
    padding:10,
    alignItems:"center",
    marginTop:40
  }
});