Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $99
Get for 99$

Metronic 9 React and Next.js


Today, I purchased a license for Metronic 9 React. However, it is not fully completed yet. I thought it was finished, and this made me a bit disappointed. Could you provide information on when the theme is expected to be completed?

Additionally, could you give a release date for the Next.js version as well? Thank you.


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 (7)


Hello Sean,

I successfully integrated all modules, plugins, components, and system settings of Tailwind, introduced with Metronic 9, into the Next.js 14.2.17 version. However, it doesn’t work seamlessly with Next.js 15. The transition process wasn’t exactly easy, and I’m sure that front-end developers who are still honing their skills are hoping for some support in this area.

It seems like we are a bit behind schedule. I haven’t seen any announcements or documentation regarding the developments we discussed. Could you provide some information on this matter? Also, would you consider using a third-party state management plugin (e.g., Redux, Pinia, etc.) for future improvements?

Best regards.



Hi,

Appreciate your feedback.

As you know react development is complex and requires a lot of attention to detail so we usually need reasonable time to release the planned features.

We are currently working on the e-commerce client and admin apps and hopefully, we can release it Jan/Feb 2025. The official next.js version is also in progress and it also requires a longer time since reimplementing so many pages and demos in Next.js is huge work.

We do not plan to use Redux and we tend to keep the template simple using React Context and real-time data fetching for DataGrid. This is the most common use case and covers the majority of user requirements.

Regards,
Sean



Hi Sean,

Thank you for your response and for sharing updates about the project’s status. I completely understand the complexity of working with frameworks like React and Next.js, as well as the attention to detail required during development. It’s great to hear that the e-commerce applications and admin panels are planned for release by January/February 2025, as this provides clarity and predictability for the upcoming features.

Your choice of using React Context and real-time data fetching instead of Redux makes sense, especially with a focus on simplicity and addressing the most common user requirements. However, it might be helpful to share how you plan to handle more complex state management scenarios if they arise, as this could provide additional insight into the flexibility of the system.

Lastly, sharing more details about the challenges faced during the Next.js development process and a roadmap for its release would be inspiring and beneficial for the community.

Wishing you success in the development process! I’m looking forward to the new features.

Best regards,
Ali Rıza



Hi,

Thank you so much! happy

Sure, we will update the community with our roadmap soon.

Regards,
Sean



Hi,

The currently released Metronic 9 Tailwind React version includes all the features of the Metronic 9 Tailwind HTML version. All the Metronic v9 Tailwind features are not available for HTML and React versions as per the live preview: http://keenthemes.com/metronic

Metronic v9 Tailwind's e-commerce and user-management apps are in progress and we will release them ASAP for both HTML/React/Next.js versions.

The next version will be released in 1-2 weeks. We are currently working on it.

By the way, to switch from demo 1 to any demo in React App you can follow this guide.

Regards.



Hi,

Thank you for the update! I appreciate the information regarding the Metronic 9 Tailwind React version and its features. I’m looking forward to the release of the e-commerce and user-management apps, as well as the next version in the coming weeks.

Also, I will definitely check the guide for switching demos in the React App. If I have any questions or need further assistance, I’ll reach out.

Thanks again for your support!

Best regards.



Hi,

Thank you for the update! I appreciate the information regarding the Metronic 9 Tailwind React version and its features. I’m looking forward to the release of the e-commerce and user-management apps, as well as the next version in the coming weeks.

Also, I will definitely check the guide for switching demos in the React App. If I have any questions or need further assistance, I’ll reach out.

Thanks again for your support!

Best regards.


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  :(