render(){ console.log(this.props); const recipe = this.state.activeRecipe; return( <div className='container'> { this.state.activeRecipe.length !== 0 && <div className='active-recipe'> <img className='active-recipe__img' src={recipe_url + recipe.image} alt={recipe.title} /> <h3 className='active-recipe__title'>{recipe.title}</h3> <h4 className='active-recipe__publisher'> Credit: <span>{recipe.sourceName}</span> </h4> <p className='active-recipe__website'>Website: <a href={recipe.sourceUrl}><span>{recipe.sourceName}</span></a> </p> <button className='active-recipe__button'> <Link to='/'>Home</Link> </button> </div> } </div> ); }