# Using a client side JS file

**URL:** <https://discourse.nodered.org/t/using-a-client-side-js-file/47338>\
**Category:** Developing Nodes\
**Created:** [18 June 2021 14:33 UTC](https://discourse.nodered.org/t/using-a-client-side-js-file/47338 "2021-06-18T14:33:16Z")\
**Posts on this page:** 1\
**Showing post:** 4

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [19 June 2021 08:04 UTC](https://discourse.nodered.org/t/using-a-client-side-js-file/47338/4 "2021-06-19T08:04:03Z")

</div>

There are a few ways to achieve this but ultimately you have to serve the code via an endpoint.

Here is an example from one of my nodes - I like this pattern as I can share the `js` with both client and server side.

1. In your project, add folders `/static/`, `/static/js/` & `/static/css/`

2. Add a "dumb" node-red node called (for example) `app.js` - this is the end point that serves files from `/static/` to `http://xxxxx/image_tools/static/***`

3. Add the associated html file `app.html` - this dynamically loads your files at client side (via the end point created in `app.js`)

4. In package.json, add a node-red node pointing to `app.js`

5. create your shared js file. NOTE: in order to be able to import it both server and client side, you need to be a bit clever. This is the basics...

6. To use the js client side, you simple access `image_tools.getOptionsMap()`

7. To use the js server side, you require the file `const image_tools = require("./static/js/image_tools");`

I dont think i missed anything but if I did, have a look through the source of [node-red-contrib-image-tools](https://github.com/Steve-Mcl/node-red-contrib-image-tools) where I employ this solution.

---

_[View the full topic](https://discourse.nodered.org/t/using-a-client-side-js-file/47338)._
