diff --git a/client/src/App.js b/client/src/App.js index 924df55..8b1b39c 100644 --- a/client/src/App.js +++ b/client/src/App.js @@ -1,21 +1,23 @@ import React from 'react'; import HelloWorld from './components/HelloWorld'; -import './style/style.css'; +import './style/style.css'; // regular CSS -> className='app' +import styles from './style/App.module.css'; // module CSS -> className={styles.App} (AKA styled components) // import * as api from './api'; -// un-comment this ^ ^ ^ to import api endpoints +// ^ ^ ^ un-comment this to import api endpoints function App() { + // const [data, setData] = React.useState([]); // React.useEffect(() => { // api // .getSomething() // replace this with your endpoint - // .then((response) => console.log(`✅ ${response.status} ${response.statusText}`, response.data)) + // .then((response) => console.log(`✅ ${response.status} ${response.statusText}`, setData(response.data))) // .catch((error) => console.log(`❌ ${error}`)); - // }); + // }, []); // - // example ^ ^ ^ using the api endpoint + // ^ ^ ^ example using the api endpoint return ( -
+
); diff --git a/client/src/api/index.js b/client/src/api/index.js index d3e3550..a8aeee2 100644 --- a/client/src/api/index.js +++ b/client/src/api/index.js @@ -1,9 +1,12 @@ import axios from 'axios'; -// customizable base-url -const url = 'http://localhost:8080/'; +// api base-url (that you created on server side) +const url = 'http://localhost:8080/api/v1'; -// demonstration endpoints: -// -// export const getSomething = () => axios.get(url + 'path'); -// export const postSometing = (form) => axios.post(url + 'path', form); +// current path: http://localhost:8080/api/v1/example +// current method: GET +// export const getSomething = () => axios.get(url + '/example'); + +// current path: http://localhost:8080/api/v1/example/upload +// current method: POST +// export const postSometing = (form) => axios.post(url + '/example/upload', form); diff --git a/client/src/style/App.module.css b/client/src/style/App.module.css new file mode 100644 index 0000000..c3abdf2 --- /dev/null +++ b/client/src/style/App.module.css @@ -0,0 +1,6 @@ +.App { + width: 100%; + min-height: 100vh; + display: grid; + place-items: center; +} diff --git a/client/src/style/style.css b/client/src/style/style.css index 9f03099..b3fa106 100644 --- a/client/src/style/style.css +++ b/client/src/style/style.css @@ -4,14 +4,8 @@ } body { - font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', + sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } - -.App { - width: 100%; - min-height: 100vh; - display: grid; - place-items: center; -}