Building a HyperUI Clone with Next JS, Tailwind CSS and MDX

Create your unique version of the HyperUI website to display your distinct Tailwind CSS components. Use the same tech stack as HyperUI, which includes Next JS, Tailwind CSS, and MDX. This ensures seamless continuation of the website's development, backed by a reliable tech stack.

Note: This is not a direct replica of HyperUI, but it's built using the same tech stack.

You'll create the following routes:

• /
• /components
• /components/[id]

Incorporate a component preview with these features:

• Copy-to-clipboard
• Source code and component preview visibility
• Adjustable breakpoints
• Option to switch between HTML, Vue, and React formatted code
• Syntax highlighting, powered by Prism

We'll also cover how to add robots.txt, sitemap.xml and embed metadata on each page (including dynamic pages) of the website.

On the /components page, you can filter by category and search the entire components list to find what you need.

In summary, this provides a solid base for you to build and expand your own Tailwind CSS component library website, leveraging the proven tech stack of Next JS, Tailwind CSS, and MDX that underpins HyperUI.

You'll receive full access to the source code, complete with open pull requests, allowing you to easily track the progress of the build.