fonsecovizk Posts - Answer Overflow

fonsecovizk

•Created by fonsecovizk on 7/23/2023 in #support

How to deploy an solid js app myself

Hi all, good morning. Does anyone have a resource (blog post, tutorial, vídeo, etc) teaching how to deploy a solidjs app if you have your own infrastructure? All i can find are tutorials using third party services like netlify, vercel, etc. I never deployed a js/node app before, and when i run "npm run build" the dist folder just has an index.html and chunked js files that vite compiled, so i supose i don't really need something solidjs specific, but then again, i never deployed a js/node before, so i'd be thankful if you beared with me.

14 replies

SSolidJS

•Created by fonsecovizk on 7/22/2023 in #support

Looking for best way to re-validate route data after some arbitrary amount of time.

Hi all, good morning/afternoon/night. So, i have a routed component with nested routes that share a single resource, that is a logged in user's metadata, like so: The data loading function:

const carregarAcessos = ({
  params,
  location,
  navigate,
  data
}: RouteDataFuncArgs): Resource<MetadadosUsuario> => {
  const [usuario] = createResource(buscarMetadadosUsuario);
  return usuario;
};

const carregarAcessos = ({
  params,
  location,
  navigate,
  data
}: RouteDataFuncArgs): Resource<MetadadosUsuario> => {
  const [usuario] = createResource(buscarMetadadosUsuario);
  return usuario;
};

The router setup:

<Route path={'/auth'} component={Dashboard} data={carregarAcessos}>
  <Route path={'/'} component={Home} />
  <Route path={'/nfe'} element={<Link href="/auth/"></Link>} />
</Route>

<Route path={'/auth'} component={Dashboard} data={carregarAcessos}>
  <Route path={'/'} component={Home} />
  <Route path={'/nfe'} element={<Link href="/auth/"></Link>} />
</Route>

The Dashboard component:

const Dashboard: Component = (props) => {

  const usuario = useRouteData<typeof carregarAcessos>();

  const loginComMensagem = (): string => {
    adicionarMensagem('Credenciais de autenticação ausêntes. Faça login novamente.');
    return '/login';
  };

  return (
    <Suspense fallback={<div>loading</div>}>
      <Switch>
        <Match when={usuario.error}>
          <Navigate href={loginComMensagem} />
        </Match>
        <Match when={usuario()}>
          <ErrorBoundary fallback={(errr) => <div>{errr.message}</div>}>
              <Outlet> the rest of the content goes here... </Outlet>
          </ErrorBoundary>
        </Match>
      </Switch>
    </Suspense>
  );
};

const Dashboard: Component = (props) => {

  const usuario = useRouteData<typeof carregarAcessos>();

  const loginComMensagem = (): string => {
    adicionarMensagem('Credenciais de autenticação ausêntes. Faça login novamente.');
    return '/login';
  };

  return (
    <Suspense fallback={<div>loading</div>}>
      <Switch>
        <Match when={usuario.error}>
          <Navigate href={loginComMensagem} />
        </Match>
        <Match when={usuario()}>
          <ErrorBoundary fallback={(errr) => <div>{errr.message}</div>}>
              <Outlet> the rest of the content goes here... </Outlet>
          </ErrorBoundary>
        </Match>
      </Switch>
    </Suspense>
  );
};

Everything works as expected, and i love solids efficiency of the dashboard component never rerendering, only its subroutes whenever the client access them and it's really easy to access the same info in any of the subroutes. My question is as follows: Since the dashboard component is only ever going to render once, and the route data is only ever loaded once per that route access, how would be the most efficient way of re-fetching/re-validating that data after, let's say, an hour? Since i also use that data to determine if the user is authenticated or not, and the JWT is supposed to expire in an hour, i want him to be logged out once that happens.

1 replies

Gaming

Programming