Initial commit

src/index.js

-import React from 'react';
-import ReactDOM from 'react-dom';
-import './index.css';
-import App from './App';
-import reportWebVitals from './reportWebVitals';
+import React from 'react'
+import ReactDOM from 'react-dom'
+
+const Header = (props) => <h1>{props.title}</h1>
+
+const Contents = (props) => {
+  return (
+    <div>
+      <Entry contact={props.contacts[0]}/>
+      <Entry contact={props.contacts[1]}/>
+      <Entry contact={props.contacts[2]}/>
+    </div>
+  )
+}
+
+const Entry = (props) => {
+  return (
+    <div>
+      <p>{props.contact.name} {props.contact.phonenumber}</p>
+    </div>
+  )
+}
+
+const App = () => {
+  const title = 'Superadvanced web phonebook app'
+  const contacts = [
+    {
+      name: 'John Doe',
+      phonenumber: '358401234567'
+    },
+    {
+      name: 'Jane Doe',
+      phonenumber: '44551234567'
+    },
+    {
+      name: 'Foo bar',
+      phonenumber: '000'
+    }
+  ]
+
+  return (
+    <div>
+      <Header title="kikkeli" />
+      <Contents contacts={contacts} />
+    </div>
+  )
+}
 
 ReactDOM.render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
+  <App />,
   document.getElementById('root')
-);
-
-// If you want to start measuring performance in your app, pass a function
-// to log results (for example: reportWebVitals(console.log))
-// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
-reportWebVitals();
+)
\ No newline at end of file