title: How to log exackly one object from fetched json data in react?
body: <p>Is there a way to log 1 object or 2 or as much as i want to be logged in console?<br>
  Im using simple data from jsonplaceholder.typicode.com (quite usefull for learning purpose) which every of object has unique id. <br>
  For example:<br>
  I fetched data and rendered 200 posts on website, ok... but if i have a data which contains 100 logos or banners or layouts for website i want to render a specific logo or banner with unique id 30. 
  So, how can I render only 1st, 2nd, 3rd or x post/posts from 200?
  <br>
  <br>
  This is what i have now:
  App.js
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import React, { Component } from 'react';
  import './css/App.css';
  import './css/bootstrap.css';
  import $ from 'jquery';
  import Todos from './Todos';
  
  class App extends Component {
      constructor(props) {
          super(props);
  
          this.state={
              todos:[],
          };
        }
  
        getTodos() {
          $.ajax({
              url: 'https://jsonplaceholder.typicode.com/todos',
              dataType: 'json',
              cache: false,
              success: function (data) {
                  this.setState({todos: data}, function () {
                      console.log(this.state);
                  });
              }.bind(this),
              error: function (xhr, status, err) {
                  console.log(err);
              }
          })
        }
        componentWillMount(){
          this.getTodos();
        }
        componentDidMount() {
          this.getTodos();
        }
        
        render() {
        return (
        &lt;div&gt;
          &lt;Todos todos={this.state.todos}/&gt;
        &lt;/div&gt;
      );
    }
  }
  
  export default App;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Todos.js
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import React, {Component} from 'react';
  import TodoItem from './TodoItem';
  
  class Todos extends Component {
      render() {
          let todoItems;
          if(this.props.todos) {
              todoItems = this.props.todos.map(todo =&gt; {
                  return (
                      &lt;TodoItem key={todo.title} todo = {todo} /&gt;
                  );
              });
          }
          return (
              &lt;div&gt;
                  &lt;h2&gt;Todo list from api&lt;/h2&gt;
                  {todoItems}
              &lt;/div&gt;
          );
      }
  }
  
  Todos.propTypes = {
      todos: React.PropTypes.array
  };
  
  export default Todos;</code></pre>
  </div>
  </div>
  </p>
  
  <p>TodoItem.js</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import React, {Component} from 'react';
  
  class TodoItem extends Component {
      render() {
          return (
              &lt;li&gt;
                  &lt;strong&gt;{this.props.todo.title}&lt;/strong&gt;
              &lt;/li&gt;
          );
      }
  }
  TodoItem.propTypes = {
      todo: React.PropTypes.object
  };
  export default TodoItem;</code></pre>
  </div>
  </div>
  </p>
  
  <p>@edit
  Is there possible to filter mapped json data and find object depending on id and then render this object? </p>