class Content extends React.Component { 
    constructor(){ 
        super(); 
        this.state={ 
            json: { 
                categories: []           
            } 
        }; 
    } 
    componentWillMount(){ 
         
        var _this = this; 
        var loc = window.location.pathname; 
        var dir = loc.substring(0, loc.lastIndexOf('/')); 
         
        this.serverRequest =  
            axios 
            .get(dir+"/data.json") 
            .then(function(result) {     
            // we got it! 
                console.log(result); // So you can check it against your image 
                _this.setState({ 
                    json:result.data 
                }); 
            }); 
    } 
    render() { 
        var title =  <a>{this.state.json.title}</a>; 
        return ( 
            <div> 
                <h2>Content</h2> 
                <h3>{title}</h3> 
                 
                {this.state.json.categories.map(function(item) { 
                    return ( 
                        <div key={item.categoryID} className="category"> 
                            <div> {item.categoryName} </div>   
                            <div> {item.categoryDescridivtion} </div>  
                            <div> {item.videosCount} </div>  
                        </div> 
                    ); 
                })} 
            </div> 
        ); 
    } 
} 
 
const data = { 
    "config": { 
        "some": "stuff" 
    }, 
    data: { 
        "categories": [{ 
            "categoryID": "294", 
            "parentID": "304", 
            "subjectID": "7", 
            "categoryName": "Apps and Side Dishes (Laura)", 
            "categoryDescription": "Learn to make amazing appetizers and side dishes with Laura in the Kitchen.", 
            "videosCount": "101", 
            "forumCategoryID": "163" 
        }, { 
            "categoryID": "285", 
            "parentID": "304", 
            "subjectID": "7", 
            "categoryName": "Side Dishes", 
            "categoryDescription": "Side dish recipes for salads, vegetables, sauces with Hilah cooking.", 
            "videosCount": "38", 
            "forumCategoryID": "163" 
        }, { 
            "categoryID": "337", 
            "parentID": "304", 
            "subjectID": "7", 
            "categoryName": "Side Dishes (bt)", 
            "categoryDescription": "Side dish recipes with Byron Talbott.", 
            "videosCount": "5", 
            "forumCategoryID": "163" 
        }, { 
            "categoryID": "301", 
            "parentID": "304", 
            "subjectID": "7", 
            "categoryName": "Side Dishes for Barbecue", 
            "categoryDescription": "Barbecue side dish recipes done on the grill by the BBQ Pit Boys!", 
            "videosCount": "43", 
            "forumCategoryID": "163" 
        }, { 
            "categoryID": "297", 
            "parentID": "304", 
            "subjectID": "7", 
            "categoryName": "Soups and Salads (Laura)", 
            "categoryDescription": "Looking for the perfect recipe to start your meal? Or are you looking to eat something on the lighter side? These are sure to have you covered!", 
            "videosCount": "70", 
            "forumCategoryID": "163" 
        }], 
 
        "title": "Title page" 
    }, 
    "headers": { 
        "some": "stuff" 
    } 
}; 
 
const axios = { 
    get() { 
        return new Promise(resolve => { 
            setTimeout(resolve, 100, data); 
        }); 
    } 
}; 
 
ReactDOM.render( 
    <Content />, 
    document.getElementById("react") 
);

<div id="react"></div> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>