Use material ui (#97)

* Use material-ui

* Clean up frontend dockerfile

docker/frontend/Dockerfile

@@ -27,24 +27,14 @@ RUN cd src && \
 	--js_out=import_style=commonjs:. \
 	--grpc-web_out=import_style=commonjs,mode=grpcwebtext:.
 
-
 # Copy the eslint prepend script.
 COPY "docker/frontend/pb_disable-eslint.sh" .
 RUN chmod +x pb_disable-eslint.sh
 RUN ./pb_disable-eslint.sh src/proto/
 
-# RUN npm install && \
-# 	npm link grpc-web && \
-# 	npx webpack client.js
-
-# RUN npm link grpc-web
-RUN npm install async --save
-RUN npm install grpc-web --save
-RUN npm install google-protobuf --save
-
+RUN npm install
 RUN npm run build
 RUN npm install -g serve
 
 EXPOSE 8081
-# CMD ["python", "-m", "SimpleHTTPServer", "8081"]
 CMD ["serve", "-s", "build", "-l", "8081"]

frontend/squeak-frontend/package.json

@@ -13,7 +13,8 @@
     "@grpc/proto-loader": "~0.5.4",
     "async": "~1.5.2",
     "google-protobuf": "~3.12.0",
-    "grpc-web": "~1.2.0"
+    "grpc-web": "~1.2.0",
+    "@material-ui/core": "~4.11.0"
   },
   "scripts": {
     "start": "EXTEND_ESLINT=true react-scripts start",

frontend/squeak-frontend/src/App.js

@@ -1,4 +1,5 @@
 import React, { useState, useEffect } from 'react';
+import Button from '@material-ui/core/Button';
 import './App.css';
 
 import { HelloRequest,
@@ -26,11 +27,14 @@ function App() {
     getMsg()
   },[]);
 
-  return (
-    <div>
-      Message : {msg}
-    </div>
-  );
+    return (
+	    <div>
+	    Message : {msg}
+            <Button variant="contained" color="primary">
+	    Reload message
+	</Button>
+	    </div>
+    );
 }
 
 export default App;