I'm using Next.js + Typescript + Three.js + Ammo.js.
I brought in the 3D virtual environment through server side rendering, and after that, I'm going to implement the physical effect through "Ammo.js".
However, an error in which the 'fs' module could not be found.
So I did import and use, Amo.js to the api folder.
I know that if you create a file in the "api" folder, it will use in "node" that, so can I send a request to the front server as "api/ammo" to proceed with the operation of the 3D environment?
I don't think I explained it properly because my English is poor. I will attach the code below and explain the intention with comments.
// dir "pages/posts/first-post.tsx"
const init = () => {
fetch('/api/ammoInit', {
method: 'GET',
headers: {
'Content-Type': 'application/json',
},
}).then((data)=>{
console.log(data)
})
}
.
// dir "/pages/api/ammoInit.ts"
import AmmoModule from 'ammojs-typed'
import type { NextApiRequest, NextApiResponse } from 'next'
const AmmoInit = (req: NextApiRequest,res: NextApiResponse) => {
let Ammo: typeof AmmoModule
AmmoModule().then((api)=>{ //using here
//I want a socket.io connection here. After that,I want to calculate
// 3D data such as various location information.
res.status(200)
.send("good")
}).catch((err)=>{
console.log(err)
})
}
export default AmmoInit
.
I heard that you can build a custom server in "index.ts", so do I have to build and implement a custom server?
If my question is hard to understand, please show me that "Next.js + 3.js + Ammo.js" project example. I want copy and study that.
if you know that best example to web 3D world, show me that code.