adminProject Title: Custom Journal Entry Interface for ERPNext
Background
Our organization is seeking to enhance the user experience of our web application by integrating a custom-built Journal Entry interface that interacts with our ERPNext backend. The goal is to create a seamless and cohesive UI that aligns with our brand and provides a user-friendly alternative to the default ERPNext Journal Entry doctype interface. There is no need to store any data to our webapp’s database, and all interactions on this aforementioned page are expected to be purely interfacing with the client’s individual ERPNext site.
Objectives
1. To design and implement a custom Journal Entry interface within our web application.
2. To replicate the functionality and logic of the ERPNext Journal Entry doctype using our front-end technology stack.
3. To ensure that the custom interface adheres to the same business rules and validation as whatever is already in the ERPNext Journal Entry doctype.
Scope of Work
1. Design UI Components: Based on the provided design screens (sharing via Figma), the developer will create React components that mirror the fields, buttons, and layout of the ERPNext Journal Entry form.
2. Translate ERPNext Logic to React: The developer will review the existing default ERPNext Journal Entry JS file and translate the client-side logic into React, ensuring feature parity and consistent behavior.
3. API Integration:
a. Implement API calls to create, read, update, and delete Journal Entry records via the ERPNext REST API for the logged-in client, leveraging their cookies.
b. Manage API request states, including loading, success, and error handling.
4. Replicate Business Logic and Client Scripts: The developer will ensure that all business logic and client scripts associated with the Journal Entry doctype, such as input validation and dynamic field updates, are replicated in the custom interface.
5. State Management: Utilize URQL for GraphQL or an equivalent state management library to handle the application state.
6. Styling: Apply styles using Material-UI and Styled Components to match the provided design screens.
7. Testing and Quality Assurance: Write and execute tests to ensure the custom interface works as expected and is free of bugs.
Technical Requirements
The below are our current Frontend technologies that we are using in our webapp. It is therefore recommended to use these in building the page where possible.
• Frontend Technologies: JavaScript, TypeScript, React, URQL (GraphQL client), Material-UI, Styled Components, React Router, React Hook Form, Luxon, date-fns, Vite, Vitest, ESLint, Prettier.
• Backend Integration: ERPNext REST API.
• Version Control: Git.
• Package Management: Lerna, Yarn Workspaces.
• Cloud Services: AWS S3, AWS SNS, AWS SQS.
• Data Visualization: AG Grid for data grid.
URL Conventions
• The developer will ensure that the URL structure for the new Journal Entry interface is consistent with the existing URL naming conventions used throughout the web application. For example, if the current convention for creating a sales invoice is www.fr8labs.co/salesinvoice, then the URL for creating a new Journal Entry should follow a similar pattern, such as www.fr8labs.co/journalentry.
• It is important that the URL structure is intuitive and follows a logical hierarchy that aligns with the rest of the application’s URL schema. This consistency is crucial for maintaining a coherent user experience and for ease of navigation within the application.
• The developer should avoid creating arbitrary or deviating URL patterns that do not match the established conventions of the application. Any new URLs introduced must be discussed and approved by the project manager to ensure they fit within the overall structure of the web application.
Deliverables
• Source code for all React components and related files.
• Documentation detailing component usage, API interactions, state management, and client script integration.
Acceptance Criteria
• The custom Journal Entry interface must replicate all functionalities and client scripts of the ERPNext Journal Entry doctype.
• The interface must pass all tests and meet performance benchmarks.
• The code must adhere to best practices and coding standards.
This document outlines the requirements for the custom Journal Entry interface project. It is intended to provide a clear and comprehensive guide for third-party developers to understand the project’s scope, objectives, and expectations.
Budget: $1,000
Posted On: January 28, 2024 04:32 UTC
Category: Full Stack Development
Skills:Node.js, ERPNext, API
Country: Singapore
click to apply
Powered by WPeMatico
