Hi everyone,
I am building a custom Employee Dashboard from scratch for Frappe HR v15 because our employees need a highly locked-down, clean interface. Default solutions (like the standard Workspace or Web Views) show unwanted search bars or URLs that allow tech-savvy employees to poke around data they shouldn’t see.
My goal is to build a completely separate frontend in plain React (without using Frappe UI or the React SDK) that limits employees strictly to 4 things:
-
Attendance: (Employee Check-in/out toggles)
-
Leave Applications: (Apply for leaves and view status)
-
Salary Slips: (View and download PDFs)
-
Tax Declarations: (Submit declarations)
My Issue:
I originally tried a simple HTML/JS proof of concept. The raw APIs work when tested independently, but in the browser, I hit major CORS errors and 404 issues trying to hit http://localhost:8000/api/method/....
Since I am moving to a clean React app (running on its own port, like 3000), how do I properly handle authentication, maintain the user session securely, and fix the CORS block when using standard browser fetch or axios requests? Any minimal code snippets or architectural roadmaps for a plain frontend approach would be massively appreciated!
And for production also