Svelte-based SaaS ERP Frontend Development
Publicada el 2026-07-21
Descripción de la oferta
Frontend Developer Svelte 5 SvelteKit SaaS ERP Development Project Overview We are redesigning our existing, fully functional ERP into a modern, high-performance SaaS application. Our current ERP is already live and working. The selected developer will not be creating workflows from scratch. Instead, the existing ERP will serve as the primary functional reference, while the frontend is redesigned using a modern technology stack with an improved user experience, cleaner architecture, and significantly better performance. The backend will be developed separately using Laravel with PostgreSQL, and the frontend should communicate through REST APIs. During frontend development, dummy JSON data should be used for all pages and forms. Backend API integration will be completed later by our backend team. ________________________________________ Technology Stack The frontend must be developed using: • Svelte 5 (Runes) • SvelteKit v2 • TypeScript • Tailwind CSS • Vite • REST API architecture • Responsive design • Component-based architecture The project must follow modern coding standards and be scalable for future SaaS expansion. ________________________________________ Project Scope The project includes approximately: • 10–12 Dashboards • 30–35 Internal Pages • Multiple CRUD forms • Quotation Module • Sales Invoice • Purchase • Inventory • HR & Payroll • Accounting • Optimizer Setup • Customer & Vendor Masters • Reports • All Settings • User Management • Approval Screens • Any other modules from Erp etc…. Most pages are straightforward CRUD interfaces, while a few modules (Quotation, Sales Invoice, Inventory, etc.) require more advanced functionality. Reference ERP access and selected Figma screens will be provided. ________________________________________ Primary Objective Build an extremely fast ERP frontend that feels as responsive as desktop software such as Tally. The application should prioritize: • Instant navigation • Minimal loading time • Smooth keyboard workflow • Fast calculations • Excellent user experience even on slow internet connections Performance is the highest priority. ________________________________________ Performance Requirements The application must: • Feel instant during navigation • Work smoothly on slow 3G internet connections • Minimize unnecessary API calls • Avoid unnecessary page reloads • Update only modified UI components • Perform CRUD operations efficiently • Display loading states appropriately • Be optimized for large datasets • Support virtualization where needed • Keep JavaScript bundle size optimized The frontend should provide a desktop-like experience rather than a traditional website. ________________________________________ Keyboard-First ERP Experience The ERP should be fully keyboard-driven, similar to Tally. Requirements include: • Keyboard shortcuts throughout the application • Fast movement between fields • Enter-key workflow • Shortcut keys for common actions • Minimal mouse dependency • Instant focus changes • Efficient tab navigation Navigation speed must never be compromised. ________________________________________ Dynamic Configuration The frontend must be configuration-driven wherever possible. The following should not be hardcoded: • Sidebar menus • Modules • Sub-modules • Tabs • Permissions • Subscription features • Feature visibility The application should be designed to render these dynamically from backend configuration in the future. ________________________________________ Role & Permission Ready Frontend architecture must support: • Super Admin • Admin • Staff Users • Channel Partners • CA or Auditor Each module should support from super admin and admin: • Module enable/disable • Tab enable/disable • Button visibility • Permission-based rendering The UI should be ready to consume permission data from backend APIs. ________________________________________ SaaS Subscription Ready The frontend should support subscription-based feature management. Different plans should be capable of enabling or hiding: • Modules • Features • Tabs • Reports • Menu items The architecture should allow this through backend configuration without requiring frontend code changes. ________________________________________ Forms All forms should initially use dummy JSON data. The frontend developer is not responsible for backend integration during this phase. The forms should be fully functional from a UI perspective, including: • Validation • Calculations • Keyboard navigation • Loading states • Success and error states • Responsive layouts The backend team will later replace the dummy data with Laravel REST APIs. ________________________________________ Image Upload Requirements Image upload should support: • Drag & Drop • Browse Upload • Copy & Paste • Preview Images should be automatically optimized on the client side to reduce file size while maintaining adequate print quality. ________________________________________ Live Sync Ready The frontend should include UI support for: • Sync indicator • Sync pending status • Sync completed status • Background synchronization state Actual synchronization logic will be implemented during backend integration. ________________________________________ Code Quality Requirements The codebase must be: • Clean • Modular • Reusable • Maintainable • Scalable • Well structured Avoid code duplication wherever possible. Reusable components should be created for repeated UI elements. ________________________________________ Documentation Requirements The developer must provide complete documentation including: • Project setup instructions • Folder structure explanation • Component architecture • Routing structure • State management approach • Reusable component guide • Build process • Environment configuration • Dependency list • Deployment instructions ________________________________________ Code Documentation The source code must include meaningful comments explaining: • Complex logic • Reusable functions • Components • Stores • Utility methods Variable names, function names, and file names should follow consistent naming conventions. ________________________________________ Source Code Handover Upon project completion, the developer must hand over: • Complete original source code • Full Git repository (if used) • All project files • Configuration files • Build configuration • Assets • Fonts • Icons • Environment template files (excluding secrets) • Package configuration files • Dependency list • Documentation The delivered source code must be complete, well-organized, and build successfully without missing files. No compiled-only deliverables will be accepted. Ownership of the developed frontend source code and related project assets will transfer to us upon final payment, unless otherwise agreed in writing. ________________________________________ Deliverables The final delivery should include: • Complete Svelte 5 frontend • Responsive layouts • All pages completed • Reusable components • Keyboard shortcut implementation • Dynamic menu architecture • Dummy data integration • Image upload functionality • Form validation • Optimized performance • Loading states • Error handling • Documentation • Original source code ________________________________________ Timeline • Development Timeline: 45 Calendar Days • Bug Fixes: Included • Support: 12 Months ________________________________________ Budget Total Budget: ₹1,80,000 (Fixed Price) Payments will be released based on predefined milestones after successful completion and approval of each milestone. ________________________________________ Milestones Milestone 1 • Project setup • Architecture • Routing • Layout • Authentication screens • Theme implementation • Reusable components Milestone 2 • Master modules • Customer • Vendor • Ledgers • Product • Category • Basic CRUD pages • All settings • Any other pages from live ERP Milestone 3 • Quotation Module • Sales Invoice • Purchase • Inventory • Accounting. • Production • Complex forms • Keyboard workflow • Any other pages from live ERP Milestone 4 • User Management • Permissions • Dynamic menu system • Configuration-driven frontend • Subscription-ready UI • Image upload • Validation Milestone 5 • Reports • Dashboards • Charts • Final optimization • Performance tuning • Cross-browser testing • Documentation • Source code handover
Skills
- Svelte
- REST APIs
- Tailwind CSS
- Vite
- CSS
- UI/UX Design
- PostgreSQL
- Contabilidad
- Laravel
- Nóminas
- Limpieza
- Presupuestos
- Figma
- Recursos Humanos
- JavaScript
- TypeScript
- Render
- Git
- HTML
- React
Fuente original: freelancer