Nostalgie

Full-stack React frameworks were becoming the default way to build, but their conveniences often arrived attached to one server shape or deployment target. I wanted to see how much of the framework could stay useful when the runtime was allowed to vary.

Nostalgie put server rendering, routing, server functions, and code splitting behind one CLI. The same app could then target different server runtimes.

Import a server function into the client

The browser-facing component imports the same function that runs on the server:

import { useQueryFunction } from 'nostalgie/functions';
import { getBlogPosts } from './functions';

export function BlogPostList() {
  const posts = useQueryFunction(getBlogPosts, ['ggoodman']);

  if (posts.isLoading) return 'Loading...';
  return posts.data.map((post) => <BlogPost post={post} />);
}

That import gives the hook its argument and result types. During the build, Nostalgie replaces the server entrypoint with a small description of the remote functions, leaving the implementation and its dependencies out of the browser bundle.