Help with calling JS variable

I am trying to generate a random number using math.random for use in my app and I have it generated in JS but can’t seem to transfer it over to be used in App Connect.

If anyone could take a look and tell me where I messed up. I am following https://docs.wappler.io/t/using-app-connect-with-javascript-functions/15765#Accessing-JavaScript-Variables-Values-with-App-Connect
This is all I have on my page

    <!doctype html>

    <html>

    <head>

        <script src="dmxAppConnect/dmxAppConnect.js"></script>

        <meta charset="UTF-8">

        <title>Untitled Document</title>

        <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.14.0/css/all.css" integrity="sha384-HzLeBuhoNPvSl5KYnjx0BT+WB0QEEqLprO+NBkkk5gbc67FTaL7XIGa2w1L0Xbgc" crossorigin="anonymous" />

        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

        <link rel="stylesheet" href="bootstrap/5/css/bootstrap.min.css" />

        <link rel="stylesheet" href="css/style.css" />

    </head>

    <body is="dmx-app" id="random">

        <div class="container">

            <div class="row">

                <div class="col">

                    <p dmx-html="randNum.value"></p>

                </div>

            </div>

        </div>

        <script src="bootstrap/5/js/bootstrap.bundle.min.js"></script>

        <script>

            let randNum = Math.floor(Math.random() * 10);;

        console.log(randNum);

                dmx.app.set('randNum', randNum);

        </script>

    </body>

    </html>

I can see the number being generated in console but also see

Uncaught TypeError: Cannot read properties of undefined (reading ‘set’)
at random:28:21

I assume I am missing something dumb since I’m new to all this but I would appreciate any help.

Community Page
Last updated: