react

README.md

-# React Starter Kit - A Boilerplate Code
-
-- Webpack, Babel을 통해 React 코드를 빌드하도록 설정되어 있습니다.
-- Webpack-dev-server가 내장되어 있습니다.
-- node_modules 폴더 아래 파일들은 감시하지 않도록 설정되어 있습니다.
-
-## 작동환경 
-- node v10.0+
-- npm v6.0+
-- yarn v1.13.0+
-
-## 간단 사용법
-``` bash
-# 이 프로젝트를 클론하여 다운 받습니다.
-$ git clone https://git.ajou.ac.kr/JYCHOI/react-starter.git 
-
-# react-starter 디렉토리로 이동
-$ cd react-starter
-
-# git reppo. 삭제
-$ rm -rf .git
-
-# 새로운 git Repo. 생성
-$ git init
-
-# 코딩 작업 후, 여러분의 프로젝트 원격 Repo에 push
-$ git push origin
-```
-
-

public/app.bundle.js.LICENSE.txt

+/**
+ * @license React
+ * react-dom.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * @license React
+ * react.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * @license React
+ * scheduler.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */

src/App.js

 import React, { Component } from 'react';
 
+
+
+const TimeButton = (props) =>{
+  const displayTime = () => {
+    let date = new Date();
+  
+    document.getElementById(`time_${props.tz.cityName}`).innerHTML = 
+    date.toLocaleString('en-US', {timeZone: props.tz.timezone});
+   };
+
+
+  return (
+    <>
+    <button onClick = {displayTime} tz = {props.tz.timezone.toLocaleString}>{props.tz.cityName}</button>
+    <div id={`time_${props.tz.cityName}`}></div> 
+    </>
+  );
+
+  }
+
 const App = () => {
+  const cityList = [
+    {cityName : "Seoul", timezone : "Asia/Seoul"},
+    {cityName : "Paris", timezone : "Europe/Paris"},
+    {cityName : "Sydney", timezone : "Australia/Sydney"},
+    {cityName : "Tornonto", timezone : "America/Toronto"},
+  ]  
     return (
+      <>
       <h1>
-        Hello, React.js
+        What time is it?
       </h1>
+      {
+        cityList.map(i => {return <TimeButton tz={i}/>})
+      }
+      </>
     );
 }