Build your own HackerRank Flutter mobile application for developer communities in a day using DhiWise

Create a Flutter mobile application for developers who can access HackerRank functionalities from their mobiles.

With the help of DhiWise, users can save time and cost of development and focus on the creative part instead of putting all efforts into recursive coding tasks.

‍

Steps:

1. Converted Figma to Flutter code
2. Created constants to store default headers and body value
3. API integration and storing required values in shared preferences
4. Actions, Navigation, and Passing Arguments
5. Generate Source Code

‍

1. Converted Figma to Flutter code

DhiWise generated each component from Figma designs with accurate Flutter UI with the required model, widgets, controller, and state management code using GetX in a very structured way.

The panel had screens that could be imported easily from Figma URL, and it also had a sync option to sync all changes at any time without interrupting existing functionalities.

‍

2. Created constants to store default headers and body value

In the application, it was required to keep the values of the default header & body so that they can be used anywhere in the project. Using the Constants feature of DhiWise, it was done easily.

‍

3. API integration and storing required values in shared preferences

Data is the heart of any website and application. The primary source of this data is APIs. During API integration, request and response handling with success and error messages is a tedious job. DhiWise gives the flexibility to do API integration and bind responses and requests and can also be stored in shared preferences to access anywhere in the application.

‍

4. Actions, Navigation, and Passing Arguments

There are three significant capabilities of DhiWise:

1. Add actions to setup navigation
2. Set up navigation from one screen to another with passing arguments.
3. Bind API request-response to the UI View.

It was required to load API data on the Screen. Using the API Integration on the Lifecycle method and the previous page's navigation arguments and API endpoint from the constants, everything was accessible on the Platform. It was integrated quickly, and then logic was added manually.

‍

5. Generate Source Code

Developers tend to resist touching someone else’s code. People at DhiWise are pretty much serious about the developer experience you get while building apps. It is understood how code quality is the superior thing in development.

That’s why you get full authority over the source code of the application you build.

And for the source code, you do not have to rely on DhiWise once you build your application. DhiWise prefers the community-accepted libraries and packages inside the generated Flutter mobile application, which fits just right! Take GetX as an example.

Also, the application follows MVC architecture, making it easier for you to customize it and seamlessly add other features to your application.

Finally, the Flutter Project was generated through DhiWise, after a few manual business logic. The working application is available on GitHub. You can clone the project, replace API and modify the code according to your requirement.