From bedd175e5dafe5b4ea5e30c282984d94f2036967 Mon Sep 17 00:00:00 2001 From: Sorrel Bri Date: Tue, 7 Jan 2020 23:18:08 -0800 Subject: [PATCH] connect socket --- src/App.js | 15 +++++++++++---- src/config.js | 6 ++++-- 2 files changed, 15 insertions(+), 6 deletions(-) diff --git a/src/App.js b/src/App.js index 241ed97..83c03f9 100644 --- a/src/App.js +++ b/src/App.js @@ -1,14 +1,21 @@ -import React from 'react'; +import React, {useState} from 'react'; import './App.scss'; import config from './config'; +import socketIOClient from 'socket.io-client'; +export const socket = socketIOClient(config.apiAddress); + function App() { - let fetchData = {}; - fetch(config.apiAddress).then(res => {console.log(res);fetchData = res.body}).then(() => console.log(fetchData)) + const [fetchData, setFetchData] = useState(); + const [socketData, setSocketData] = useState(); + fetch(config.apiAddress).then(res => res.text()).then(data => setFetchData(data)); + socket.emit('connect'); + socket.on('connected', data => setSocketData(data.message)); return (

React Boilerplate

- {fetchData ?

: <>} + {fetchData ?

{fetchData}

: <>} + {socketData ?

{socketData}

: <>}
); } diff --git a/src/config.js b/src/config.js index d54c463..150ce8e 100644 --- a/src/config.js +++ b/src/config.js @@ -1,9 +1,11 @@ const production = { - apiAddress: null + apiAddress: null, + endpoint: null } const development = { - apiAddress: 'http://localhost:8000' + apiAddress: 'http://localhost:8000', + endpoint: 'http://localhost:3000' } const config = process.env.REACT_APP_ENVIRONMENT === 'production'