Reusing Frappe components on Website

I’ve skimmed through the entire frappe/erpnext docs but couldn’t figure out this.

background context: I want to build an application for product management, basically the user will be able to see a dashboard on the home page, with a list of projects, and a button to add a new project. and when a project is selected on the home page, it takes you to the dashboard for that project, and shows up the project’s progress, there’s also Gantt chart and Kannan board here.

I understand by this time that Frappe comes with Website view and Desk UI view. I love the components on the Desk UI, and simply want to use them on the website. For example the Dashboard page Dashboard, this is only available on DeskUI, but how do I use it in Website ? I also want to reuse components so that I can have a uniform UI, love the ERPNext design system, just want to reuse it on the Website. Do I have to write custom css & html & js for it ?

I’ve even tried to go through the ERPNext source code, but it seems a unorganised as I don’t really understand the structure, every seems to be linked with everything.

The DeskUI seems a little complicated for the end user if I make the end user use DeskUI, they’ll get confused on what to click. So that is why I want to use the ERPNext components on Website.

I’ve gone through how to create WebForms, and they seem good, although the the problem is that the web form takes up the entire page and I can’t add my custom stuff around it. Basically it would be nice if I can embed these forms.

TL; DR

  • How do I show the ERPNext Dashboard on Website
  • How do I do the above for Reports as well
  • How do I embed forms inside Website Page
  • How do I build a web page using ERPNext Components ?

Pardon me if these are some noob questions, just a beginner :slight_smile:, kudos to the guys behind this amazing open sourced framework

1 Like

If this happens, ERPNext should gain market share of WordPress.

:sweat_smile: Not WordPress style components reuse.

I’m fine by using Vue/JS style components, but just want to know where to look for them, or if there’s any documentation of it, as of now I could only find frappe Js API and Graph API, but nothing on Dashboard components.