```js
import {useEffect, useState} from "react";

export const useWebSockets = () => {
    const [state, setState] = useState([]);

    useEffect(() => {
        const ws = new WebSocket("ws://localhost:8889");

        ws.onopen = () => {
            console.log("open");
        };

        ws.onclose = () => {
            console.log("closed");
        };

        ws.onmessage = (msg) => {
            const dataMsg = JSON.parse(msg.data)
            if (dataMsg.hasOwnProperty('tick')) {
                setState((prev)=> [...prev, dataMsg.tick])
            }
            return null
        };

        return () => {
            ws.close();
        };
    }, []);

    return state
}
```

#reactHook | useWebSockets

https://www.youtube.com/watch?v=LMagNcngvcU

2021.11 Build and Deploy a Fully Responsive Modern UI/UX Website in React JS

https://www.youtube.com/watch?v=bSMZgXzC9AA

EBS

#reactHook | useWebSockets

2021.11 Build and Deploy a Fully Responsive Modern UI/UX Website in React JS

#portfolio #front | How to build a portfolio website using Next.js, Chakra UI, Framer Motion, and Three.js

#nginx as a WebSocket Proxy