SolidJS

S

SolidJS

Solid is a declarative reactive Javascript library for creating user interfaces.

Join

Background jobs

Is it possible to have background jobs on the server? That for example pings a webserver once a minute?

&& in <Show> when condition and typescript?

```js <Show when={ selectedDate() && firstAndLastDate.data?.firstDate &&...

unwrap doesn't seem to do anything

I'm trying to get a plain object, because seroval chokes at trying to serialize a store directly. But unwrap still returns a proxy. ```ts function App() { const [people, setPeople] = createStore<any[]>([]); createEffect(() => {...
No description

Migrating from `<input>` to contentEditable and handle selection

I'd like to migrate from using <input> to using <div contenteditable="true"> (to enable text selection across multiple elements) but I am not sure how to migrate some code, and whether I should use some SolidJS-specific way to handle selections. The specific code I am wondering about is here: https://github.com/ToposInstitute/CatColab/blob/43e054aa5efb57bf98fa4fabc2c9c21c9a0a9493/packages/frontend/src/model/object_cell_editor.tsx#L19-L26 ``` let nameRef!: HTMLInputElement; ...

How do I run an effect every change except initialization?

I need to run an effect every subsequent change of a signal's value. I just need to skip the first initialization of the signal. I found this answer https://stackoverflow.com/a/78283918 and I implemented it, but it's not triggering on any updates. ```tsx const [value, setValue] = createSignal(props.defaultValue ?? 0); createEffect(...

Context lost on HMR

I'm having an issue with the state of a Solid context getting lost on HMR. This makes sense because the module that calls createContext is being reloaded, and the call is a module level statement, which is pretty normal I think. But from this https://github.com/solidjs/solid-refresh/issues/15 it looks like solid-refresh should know how to preserve the state....

Replit with solid-start hmr

I m having a problem where, hmr and hot reload doesn't work, i confifured the vite ports correctly but i think theres a problem with solid-refresh and how it is handling reloads

What's the correct way to wrap server functions?

I have a bunch of duplicate authentication and validation logic in my server functions that I'd like to extract to a utility like createAuthenticatedAction that authenticates the user before running the server callback passed to it, but every time I create any wrapper around "use server" the compiler stats complaining. Where should I put a "use server" directive if I only want this helper to run on the server?

template2 is not a function

Hi there, have anyone experienced this issue before?
No description

Cloudflare worker presigned url S3, R2

How do you generate presigned urls or S3 or R2... from cloudflare workers? Solution: Use aws4fetch package which is designed to work on cloudflare workers: https://developers.cloudflare.com/r2/examples/aws/aws4fetch/...

Deploying a VITE+Solid app

Hi, I have been trying to deploy a SPA made using Vite + Solid for production. I wanted to create docker images for easy deployment. I already have nix setup for my development environment. I have my docker setup like follows: ```dockerfile FROM nixos/nix AS nix-builder...
No description

How to reduce undefined judgments

Hey everyone, in this example, because I need to clear the resources occupied by the engine when the component is uninstalled, I defined the engine outside onMount. Since the initialization of the engine requires canvasRef, it is undefined at the beginning. This means that if I need to modify the properties of engine(), I need to check whether it is undefined multiple times. How should I improve it?
No description

Using JSX in custom directives

Suppose you want to create a convenient tooltip directive that can be easily used by providing only the content of it. This works fine for simple tooltips. However, what if you want to create more complex, custom tooltips? For example, you want to wrap the element as a trigger and use it in combination with a component from libraries like https://kobalte.dev/docs/core/components/tooltip or https://corvu.dev/docs/primitives/tooltip ```tsx import { type Accessor, createEffect, createSignal } from "solid-js"; import { render } from "solid-js/web";...

`createContext`, What's the point?

In SolidJS, It looks like I can create a store in a JS module, then import the state and setters to any component in my app. That said, is there an advantage to using a context or is it there for convenience? This works like as far as I can tell: ```TSX // store.ts...

How to mount a Solid component to a dom element?

I have a Solid app... ...that uses a vanilla-js library ...which gives me a <div> to do stuff with. (So this sandwich has 3 layers.) (Think of the vanilla-js library as like, CodeMirror or ag-grid or something. A complex UI lib which gives me ways to customize certain components.)...

Solid.js does not render children in a `<For>` loop correctly

Take a look at my component code: ```tsx type CartProps = { cartIcon: JSX.Element; trashIcon: JSX.Element;...

.node file not being imported properly?

I don't know if I'm using the tags correctly, but I'm pretty sure this is an advanced question Trying to make a napi library to generate .node files from rust, and when trying to use the sample function napi provides my component isnt rendered: ```ts...

Solidjs admin panel?

Is there a good option for a solidjs admin panel?

Importing bootstraps JS

I have installed bootstrap from npm and imported it in my sass and that all works fine. I tried to import it in my index.tsx but none of the functions seem to be available when trying to use them. Am I doing something wrong?