Design Converter
Flutter
React
Shopify
Flutter
React
Shopify
Discord
Discord
In organizations there are possibilities that their service is having dependencies on other third-party services, when third-party service downtime occurs it also affects their services, so to monitor downtime, there is a need to create this type of system, so it can notify when the system downtime occurs.
A few hours of downtime might not seem like a big deal at the time, but if it happens during a time when people are most likely to use your services and they can't get in, you could lose the client’s interest and maybe much more. Downtime can have a devastating impact on businesses of all sizes.
For all different types of services have different status pages, so instead of visiting and checking each service status, it can be solved by providing all service statuses on a single page. and send notifications of the dependency services which are having downtime can be automated.
With the help of DhiWise, users can save the cost of time for development which is the best part because the developer can focus on the creative part instead of putting all efforts into coding recursive tasks.
View design
If this application was created with all manual efforts then for beginner developers it may take up to
it may take up to 10 days but a big thanks to DhiWise which helps to complete this project in just 2 days. if the developer's cost is 10$ an hour and works 8 hours a day then,
It generates each component with accurate and responsive React UI, which is generating Html, Tailwind CSS, and React state management code in a very structured way.
The panel is having screens that can be imported easily from Figma URL and it also has a sync option to sync all changes at any time and can be re-sync without interrupting your existing functionalities.
Here, required values used in projects globally were stored. Just to store links to the API endpoint, logo images, and redirect page URLs. This can be also achieved if having API which can return all these things. but, if there are few services then using it in constant is preferred.
the “on mount” method of the home screen, there was some manual part that needed to do like binding dynamic constant values into a list and binding logo image links and service name with a view of the row in the list, adding a checkbox to select multiple services.
After that actions like the click of the button, it was redirected to another screen using the Navigation feature of DhiWise, which also supports passing arguments in the state with Navigation, so it is managed and saves more time and solves difficulties for passing, which was managed by DhiWise as it has a feature to bind response of API with the state.
Life cycle actions, like API integration at the “on mount” when the screen is being loaded, DhiWise web project supports calling more than one API at the “on mount” method.
here, DhiWise generated code provides the state passed from the previous screen using the Navigation arguments feature.
Here the list is the selected service list from the home screen. This screen needs to get the status of each service by calling get API dynamically which is a logical part of coding, and showing the status as per response on the screen, also has a button "view detail" where navigation is set to open the original status page of the service in a new tab which was saved in constant named "redirect URL" at the start of the project.
here to implement Slack Incoming Webhooks needed to create a new app name and pick a workspace from the drop-down and click on Create App
After creating a new app needed to "Activate Incoming Web-hooks" first to allow post messages through Slack Webhook APIs.
After there was a requirement to allow access to our app and select the channel which was required to post messages through API.
When access is allowed to the channel need to generate a token to authorize Webhooks API.
cURL to implement Web-hook In Project, imported cURL in API Runner, and done Api Integration at the “on mount” method of the life cycle.
After importing cUrl, it was easily integrated into a project with manual logical parts also as there may be different types of responses from each API as endpoints and domains are different, but mostly up to 65% of services have some standard responses.
React Project which was generated through DhiWise, after a few manual business logic and after making it work application is available on GitHub, you can clone and modify the coding as per your requirements.
