https://github.com/networked-aframe/naf-nametag-solidjs
NAF nametag example with a UI to enter the room written with SolidJS and Tailwind CSS
https://github.com/networked-aframe/naf-nametag-solidjs
Last synced: 4 months ago
JSON representation
NAF nametag example with a UI to enter the room written with SolidJS and Tailwind CSS
- Host: GitHub
- URL: https://github.com/networked-aframe/naf-nametag-solidjs
- Owner: networked-aframe
- License: mit
- Created: 2023-11-16T11:25:23.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2025-06-14T12:55:00.000Z (about 1 year ago)
- Last Synced: 2025-10-31T07:37:43.792Z (8 months ago)
- Language: TypeScript
- Homepage: https://naf-nametag-solidjs.glitch.me
- Size: 131 KB
- Stars: 2
- Watchers: 3
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# NAF nametag example with UI
This is the NAF nametag example but with a UI to enter the room written with [SolidJS](https://www.solidjs.com/) and [Tailwind CSS](https://tailwindcss.com/). It contains all the configurations files to develop the UI with [VS code](https://code.visualstudio.com/): webpack, tailwindcss with postcss, prettier, eslint, tsconfig for solid-js.
In VS code, be sure to install the following addons: Prettier - Code formatter, ESLint, Tailwind CSS IntelliSense.
See the src folder how the UI works.
For the app to run on glitch for development, we used in `package.json`:
```
"start": "cross-env NODE_ENV=development node server.js",
```
that adds the webpack-dev-middleware with the easyrtc/express server on the same port.
That's the same command for `npm run dev`.
For production, you should do a build with `npm run build`
and change back to
```
"start": "node server.js",
```
Note that webpack hot reload is not supported when running through the easyrtc
server with webpack-dev-middleware. It's working with `npm run dev2` that uses the
full webpack-dev-server but the easyrtc server won't be working.
That can probably be fixed by using two ports (one for easyrtc server,
one for webpack-dev-server) to develop locally, but that won't work on glitch.
You can read more on [using SolidJS with A-Frame](https://aframe.wiki/en/#!pages/solidjs.md) on the A-Frame wiki.