react-device-detect | Detect device , and render view | Mobile library

I'm trying to install react-twitter-embed on my react app. I have tried deleting and reinstalling my node_modules folder and clearing my npm cache. I've tried upgrading my node and npm to the latest version as well.
Here's the error I'm getting:

I'm trying to render an image depending on the device of the user.

This is my image component:

I am passing getResponse() function in the useEffect with userInput as dependency array. Everytime a user sends input this function is triggered and I get new directline object created everytime. Problem I am facing is that I am creating bot everytime I send a request to bot. How can I create an object only once on initial render and then use the object to connect with bot.

Please help!

Here's the botframework documentation I am following

Here's the code I wrote to communicate with bot in ReactJS.

I'm using next.js to create a static page that outputs in SSG mode.

I would like to use the react-device-detect library to determine the output component based on the screen size.
Since the page is created as SSG, even if the screen size is changed after accessing the page, the components will not be changed in real time.
Of course, if you change the screen size and reload it, it will be reflected, but I want to reflect it in real time.
If next.js is not used and only react is used, it will be rendered each time, so there was no problem. Is there a solution to this point?

Best regard.

The source is below.

I need to have a global variable which tells me what device I am currently using, my team wants me to have mobile, tablet, desktop and mobile landscape. I didn't have any idea how to do that, but I started digging in google and found out this function:

I try to exclude the package react-virtualized from the peer dependency checking of NPM 7. I know I could separately install that package with

npm install react-virtualized --legacy-peer-deps

...but my goal is to install all packages with npm install and this one shall not be checked for peer dependencies. Is that possible?

I would accept any answer that shows me how to manipulate the package.json so that a fresh npm install runs without peer dependency errors. I have the following package.json:

I have a small website based on next.js framework that I want to deploy on AWS Elastic Beanstalk.

I followed the getting started docs here https://docs.aws.amazon.com/elasticbeanstalk/latest/dg/GettingStarted.html and also here https://nextjs.org/docs/deployment. However the docs on next.js website don't go in depth.

So what I did are the following steps:

1. npm run build in my projects folder - this generated the .next folder
2. Copied the package.json inside the .next folder
3. Opened the .next folder and zipped the content (so all files are in root of zip)
4. Opened up the AWS Management cosonsole, chose Create a web app and uploaded the zip file

All this went through without error and AWS Beanstalk created the environment. Then I received the information Healthstatus: Severe - 100.0 % of the requests are failing with HTTP 5xx. So I looked into the logs and got this:

I was working on a react project and suddenly this error occurred saying,

Failed to compile ../node_modules/react-dom/lib/ReactMount.js Module not found: Can't resolve 'react/lib/React' in 'C:\Users\Angelin\ecom\node_modules\react-dom\lib'

package.json:

In my MERN application when trying to make an axios request on the client side I get the proxy error: error: Could not proxy request /api/house-listing from localhost:3000 to http://localhost:5000 I've tried change the scripts in my package.json on the backend and ensuring that all the routes work but, I'm still getting the error?

Backend package.json