Integrating Frappe Education with Frappe LMS (Sync Data + Vue Frontend)

Hi everyone,

I’m currently working on a project where I need to integrate two Frappe apps: Frappe Education and Frappe LMS.
The main goal is to make the LMS act as an extension module for managing online courses, while still keeping the academic and student data consistent across both systems.

What I want to achieve

  • Sync overlapping data between the two apps (e.g., Students, Courses, Instructors, Enrollments).

  • Use Frappe Education for academic management (classes, grading, attendance, etc.).

  • Use Frappe LMS for online content delivery, quizzes, and tracking course progress.

  • Ensure both systems stay updated when data changes in one of them.

Current approach

I’m planning to:

  1. Approach 1 – Integration

    I’m currently considering to:

    • Use Doc Events (on_update, after_insert, on_trash, etc.) to trigger synchronization logic between both apps.

    • Build custom REST APIs to handle integration with a Vue frontend, which will serve as the main interface for learners and instructors.

    Approach 2 – Unified App

    Alternatively, I’m also thinking about forking both apps and merging them into a single integrated app, where Education and LMS features coexist under one codebase.
    This might make maintenance and data consistency easier, but could increase complexity in the long run when updating from upstream repositories.

    Are there better ways to handle this kind of integration

    If someone has experience integrating Frappe LMS with another Frappe app, I’d love to hear how you handled the data consistency part.

Approach 1 is good, as it will be more relaiable and will require less maintenance. also it will be less complicated.

1 Like

I think so too — option one seems more stable and scalable for development. When needed, we can branch out to option two later, combining the custom source and the Frappe app code into a single unified app, as long as we plan the migration properly.

However, when developing the UI layer (for example, in Frappe LMS), I’m currently following the approach of copying the source (custom-build.js ) and rebuilding the lms.html file to override the interface. This approach often leads to conflicts whenever there’s an update to the LMS interface.
source: https://www.linkedin.com/posts/tridz_learn-to-customize-frappe-ui-apps-customizing-activity-7239590455888207872-Wgi8/?utm_source=share&utm_medium=member_desktop

I would create a “bridge” app that will handle cross-syncing and conflict resolution between both apps.

Since you are building a unified UI, the frontend can be developed on the bridge app itself along with the REST apis.

Then you can normally receive updates on either apps without worrying about any overrides or conflicts

Here is another app that is aiming at that: GitHub - fderyckel/ifitwala_ed: A School Managment System
Admittedly, not yet there. But the base is there. There is functionalities for better enrollment records and scheduling (n-days rotation schedules, etc.).