# Dynamic Registration
URL: /concepts/components/registering-components-dynamically

For runtime registration of components, you can use the `registerComponent` function from the `useTamboRegistry()` hook. This approach allows you to register components based on conditions, user interactions, or other dynamic factors.

```tsx title="page.tsx"
import { useEffect } from "react";
import { useTamboRegistry } from "@tambo-ai/react";
import { z } from "zod";
import { WeatherDisplay } from "@/components/WeatherDisplay";

// Define simple Zod schemas for component props
const WeatherDisplayProps = z.object({
  city: z.string(),
  temperature: z.number(),
  condition: z.string(),
});

export default function Page() {
  const { registerComponent } = useTamboRegistry();

  useEffect(() => {
    if(someCondition) {
        registerComponent({
            name: "WeatherDisplay",
            description: "A display of the weather in a city.",
            component: WeatherDisplay,
            propsSchema: WeatherDisplayProps,
        })
    }
  }, [registerComponent]);

  return (
    // Your page content
  );
}
```