Introducing ReUI:Open-source UI components and apps built with React, Next.js and Tailwind CSS
Browse ReUI

Maybe I'm too stupid... or old... or both


When I bought Metronic 13 years ago, what I loved about it was that I could grab components that were beautiful and functional right out of the box. Those were the HTML days... <sigh>

Now I'm building a more modern app so I'm using the more modern version.

Aaaaaaannnnndddd.... three weeks later I'm still )&)#ing lost feeling like a total moron but mostly frustrated that what I envisioned as a fast UI dev process has devolved into me floundering like an idiot. (yes, I'm more focused on backend dev)

The installation instructions make zero sense. Why?

Because once I'm done following the instructions, I have a beautiful partial page. The top nav and sidebar UI are great. But I didn't buy a top nav and sidebar. I bought a fully functioning admin.

But it's also little things like when I get to step 3 'Install Packages & Start Development Server'

I get this: Module not found: Can't resolve './fonts/keenicons-duotone.ttf?gcn9yo'

Now, sure, I can read and I can see where I can correct that but hopefully you can understand that the instructions suck.

Why so harsh? Well, immediately following the above instruction at step 3 is 'That's it! You now have the Metronic Tailwind template integrated into your React project.'

But there is also the fact that, after following the installation instructions, I don't have *any* pages to model and modify and I'm missing fully functioning components in the /core/components directory.

There are plugins available in .js files but I didn't pay for a template to just need to figure out how to create plugins...

Given my stellar history with this template it must be my total idiocy. So what am I missing and how do I correct it?


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (2)


Hi,

Thank you for your honest feedback—I completely understand your concerns.

For Metronic 9 Tailwind, we’ve made extensive optimizations and simplified the build tools as much as possible. However, in today's landscape, advanced tools have become an essential part of modern front-end development.

As for the Metronic 9 React version, please check out this announcement for more details.

Best regards,
Sean



Hi,

Regarding the "Can't resolve './fonts/keenicons-duotone.ttf?gcn9yo'" issue, we will check it further. So far we haven't got this kind of error report. We will double-check it and get back to you.

However, this guide is to use Metronic 9 HTML/JS components within the React app. We are already going to release the Metronic 9 React version with native react components. I would suggest you to wait for this release and hopefully, we can release in October. The Beta release starts somewhere next week. You can join.

Regards,
Sean


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(