Skip to main content

Customize landing page

EventCatalog provides a default landing page, you can override this with custom markdown.

Changing the default landing page​

  1. Create a new folder called pages and markdown file called index.mdx
    • Example: /pages/index.mdx (note: New Catalogs will have this already)
  2. Enter your details, save the file and load your catalog.

Example

/pages/index.mdx
---
id: index
---

# **Welcome to EventCatalog**

This open-source project is designed to help you and your teams bring discoverability and clarity to your event-driven architectures (EDA).

This page can be replaced with your own content, but to help you get started, we have created a few guides and resources.

<Tiles columns={3}>
  <Tile icon="BookOpenIcon" href="https://eventcatalog.dev/docs/development/getting-started/introduction" title="Getting started with EventCatalog" description="How to get started with EventCatalog" />
  <Tile icon="RectangleGroupIcon" href="https://eventcatalog.dev/docs/development/guides/domains/adding-domains" title="Creating domains" description="Learn how to create domains in your event catalog" />
  <Tile icon="ServerIcon" href="https://eventcatalog.dev/docs/development/guides/services/adding-services" title="Creating services" description="Learn how to create services in your event catalog" />
  <Tile icon="ChatBubbleLeftIcon" iconColor="text-blue-500" href="https://eventcatalog.dev/docs/development/guides/messages/commands/introduction" title="Creating commands" description="Learn how to create commands in your event catalog" />
  <Tile icon="BoltIcon" iconColor="text-orange-500" href="https://eventcatalog.dev/docs/development/guides/messages/events/introduction" title="Creating events" description="Learn how to create events in your event catalog" />
  <Tile icon="UserGroupIcon" iconColor="text-green-500" href="https://eventcatalog.dev/docs/owners" title="Assigning owners to resources" description="Learn how to assign owners to resources in your event catalog" />
</Tiles>

### **Join the community**

Our project and community is growing fast. We have over 1000+ members in our [Discord community](https://discord.gg/3rjaZMmrAm).

<Tiles columns={2}>
  <Tile icon="UserGroupIcon" iconColor="text-green-500" href="https://discord.gg/3rjaZMmrAm" title="Join the Discord community" description="Join the community to get help and support" />
  <Tile icon="StarIcon"  iconColor="text-yellow-500" href="https://github.com/event-catalog/eventcatalog/stargazers" title="Star EventCatalog on GitHub" description="If you like the project, please star it on GitHub to show your support ❤️" />
</Tiles>

---

See the example output here

Using components​

Added in eventcatalog@2.30.2

You can use EventCatalog components in your custom landing page.

Example:

<Tiles columns={3}>
  <Tile icon="BookOpenIcon" href="https://eventcatalog.dev/docs/development/getting-started/introduction" title="Getting started with EventCatalog" description="How to get started with EventCatalog" />
</Tiles>

You can get a list of components here.