react-test.js

import React, { Component } from 'react';
import { render } from 'react-dom';
import { times, uniqueId } from 'lodash';

class Fruite {
  constructor(name) {
    this.id = uniqueId();
    this.name = name;
  }
  
  get name() {
    return this.name;
  }
  
  set name(name) {
    if (typeof name === 'string' && string.length > 0) {
      this.name = name;
    } else {
      throw new Error('invalid name');
    }
  }
}

class App extends Component {
  constructor(props) {
    super(props);
    
    this.state = {
      fruits: props.fruits
    };
  }
  
  renderFruite(fruite) {
    return (
      <div className="fruite" key={fruite.id}>
        {fruite.name}
      </div>  
    );
  }
  
  render() {
    const { fruites } = this.state;
    
    return (
      <div className="fruites-container">
        {fruites.map(renderFruite)}
      </div>  
    );
  }
}

const fruits = [
  'apple',
  'banana',
  'pineapple',
  'orange',
  'pear',
  'peach'
].map(name => new Fruite(name));

render(
  <App fruites={fruites} />,
  document.getElementById('app')
);