My first project, but the backend data isn't coming from port 3000. I'm a bit lost and would really appreciate any help.
Springboot TestController
package com.example.joyit;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController
public class TestController {
@GetMapping("/api/test")
public String text(){
return "test api";
}
}
App.js
import React, {useState,useEffect} from 'react';
import axios from 'axios'
import './App.css';
function App() {
const [testStr, setTestStr] =useState('');
function callback(str){
setTestStr(str);
}
useEffect(
()=>{
axios.get('/api/test')
.then((Response)=>{callback(Response.data)})
.catch((Error)=>{console.log(Error)})
}, []
);
return (
<div className="App">
<header className="App-header">
api/test =={'>'}
{testStr}
</header>
</div>
);
}
export default App;
setupProxy.js
const{createProxyMiddleware} = require('http-proxy-middleware');
module.exports = function (app){
app.use(
'/api',
createProxyMiddleware({
target:'http://127.0.0.1:8080',
changeOrigin:true,
})
);
};
https://i.sstatic.net/r82z5.png
The backend data seems to be stuck. Any ideas on how to fix this?
If you could provide some guidance, I'd be really grateful.