How I made my portfolio website?

TypeScript Remix.js running on Cloudflare. I've used tailwindcss for styling and zod for schema and validation.

Why I love Remix? The convention is really nice and taking a 'server-first' approach — using loader and action handlers.

export async function loader({ request, params, context }: LoaderFunctionArgs) {
  ...

  return { payload: { foo: "bar" } };
}

Why I love Cloudflare? It's fast, affordable, simple deployments, and has great tooling with wrangler — making it easy to configure bindings (connecting with services).

# wrangler.jsonc

{
  "$schema": "node_modules/wrangler/config-schema.json",
  "name": "mikeylau",
  "compatibility_date": "2025-03-27",
  "compatibility_flags": ["nodejs_compat"],
  "pages_build_output_dir": "./build/client",
  "observability": {
    "enabled": true
  },
  "ai": {
    "binding": "AI"
  },
  "kv_namespaces": [
    {
      "binding": "KV_NS",
      "id": "XXXXXX"
    }
  ],
  "vectorize": [
    {
      "binding": "VECTORIZE",
      "index_name": "mikeylau"
    }
  ]
}

In the above, you can see that I'm using the following for my agent page.

  • ai - serverless models for inference.
  • kv_namespaces - key-value store for chat sessions.
  • vectorize - vector store for my blog and details embeddings.