React

Extend Freshteam functionalities within 4 hours using DhiWise and Supabase

20
Saved hours
Saved money
iconiconicon

The world is fast shifting towards seamless resource and people management. No long queues, no frustrating holdups, and minimal back-and-forth. Yes, we all deserve our share of simplicity. Yet, despite the vision, the implementation is subpar— weak and ineffective to say the least. However, DhiWise plans to change it, first by letting you extend the functionality module of Freshteam— your go-to HR management platform.

In simple terms, you can make Freshteam faster, more scalable, and more user-specific, in absolutely no time. All by ditching traditional programming, once and for all. But first, some background.

Freshteam is a smart HR software for growing businesses. With Freshteam, you can attract, hire and onboard new hires, offboard exiting employees, and manage team member information, and time logs - all in one place.

  • A company intranet is a potent virtual workspace that may be used to manage teams, and connect employees with the visual diagram of the internal structure.
  • A company intranet is a center for internal communication, information storage, team member advocacy, and collaboration. It gives you an all-in-one software solution for managing and automating the core workforce administration of your company.
The Challenge

Companies need to store their data and information, which makes it difficult for employees to retrieve documents. Employees must use websites to access documents, which requires several procedures to be done. Users may experience issues with making the information inaccessible.

The Solution

Intranet for a group of authorized users using DhiWise

By creating a React Web app using a Figma design, Freshteam API, and Supabase, DhiWise solves this problem in hours.

DhiWise is a programming platform where developers can convert their designs into developer-friendly code for Mobile and web apps. DhiWise automates the application development lifecycle and instantly generates readable, modular, and reusable code.

For an entry-level developer making API calls requires more work and time to create API clients and services. However, using DhiWise React Builder, you can generate it in less than a few hours.

How it was accomplished with DhiWise:

  • By following the perfect UI design standards using Figma, it produced the best UI design code.
  • Added Freshteam & Supabase APIs or imported Postman collection for API integration.
  • Created navigation and integrated APIs with design components.
  • Built the app, deploy the app on Vercel, and also downloaded the application code for the customization.

Develop an application with minimal efforts in DhiWise

  • It took 5 minutes to import Figma into DhiWise and fetch screens from Figma resources
  • 15 minutes to create a database and tables, and generate API from Supabase.
  • 15 minutes to set up navigation and create APIs and import Postman collection.
  • 30 minutes to convert components into charts or integrate APIs.
  • 2 hours for manual coding.

Benefits of using the "Figma to ReactJS" feature in DhiWise

  • Imported a Figma design in a single click and the Page names were proper in Figma, so according to that pages were created in DhiWise which resulted in code readability.
  • DhiWise generated code is robust because DhiWise provides code for reusable ReactJS components.
  • Created navigation actions for the buttons, hyperlinks, and other components of the website. and linked them to other pages and websites wherever needed.
  • In DhiWise easily integrate an API into a page using the “onMount” method or a specific page component by uploading a Postman file or manually creating APIs in the API runner.
  • DhiWise provides a project structure that considers the standards of programming. So modification of code was done with ease.
  • The application was directly deployed to Vercel for review, development, and shipping, and downloaded the source code, for adding more features.

Challenges encountered while developing an application manually vs using DhiWise

1. Designing and Developing :
  • Manual coding eventually requires more cooperation from engineers and designers. It will also take longer to construct the program because someone's dependency on another person grows throughout development. It will therefore fundamentally require more time, effort, and expense to manually develop an application.
  • Using DhiWise, one ReactJS developer may simply develop an application in a day without needing a lot of time, effort, or designers or developers if Figma is available.

2. API Integration :
  • By doing manual code for an API call, a developer must have sufficient knowledge of the API and its calling function, such as how to pass requests and responses so it will give a proper response, which requires more developer effort.
  • Using DhiWise, it will automatically generate code for the integration of APIs,  only need to API integrate and pass requests and responses.

3. Supabase:
  • Developers should learn how to manually integrate third-party APIs into React code to be using Supabase so it consumes much time and effort.
  • Using DhiWise, simply import the Supabase collection and Integrate it in no time. Manage all the actions with ease.

4.Code quality:
  • More than one developer is required for manual development; in that case, they all have opinionated coding styles, which might affect the code quality.
  • Maintaining the code quality is difficult when there was a large team. DhiWise generates the code with the best coding standards with a well-structured folder setup. It brings a way to keep the codebase easy to understand.

Conclusion for developing a company intranet with DhiWise

Using DhiWise, the developer leads to faster project development and reduces traditional programming work. By reducing the amount of manual coding required, DhiWise helps to accelerate the development of code.