Automated user interface generation for an application programming interface (API)
Techniques for generating a user interface are disclosed. An example method includes receiving, from an application programming interface (API), a file containing API data. The method also includes applying, by a processing device, a set of pattern matching rules to a segment of the API data to identify a graphical user interface component to be used to display the segment. The method also includes populating the graphical user interface component with data from the segment. The method also includes generating a user interface comprising the graphical user interface component.
1. A method comprising:
receiving, from an application programming interface (API), a file containing API data;
applying, by a processing device, a set of pattern matching rules to the API data to identify graphical user interface components to be used to display the API data;
responsive to determining that a same segment of the API data fits a pattern associated with two different types of graphical user interface component, generating a user interface comprising first and second graphical user interface components that display the same segment of the API data using different visual formats;
responsive to determining that a second segment of the API data does not match with any of the pattern matching rules, displaying the second segment of the API data within the user interface as plain text that represents the API data in raw form; and
responsive to determining that a third segment of the API data is nested within a hierarchical data structure of the file, nesting a third graphical user interface component within a graphical container of the user interface that visually reflects the hierarchical data structure of the file, wherein the graphical container comprises a visual label comprising text extracted from the API data at a higher level of the hierarchical data structure of the file compared to the third segment of the API data used to generate the third graphical user interface component.
2. The method of claim 1 , wherein generating the user interface comprises adding the third graphical user interface component at a position within the user interface that correlates with a location of the third segment in the API data.
3. The method of claim 1 , comprising receiving an API schema and augmenting the first, second, or third graphical user interface component with information from the API schema.
4. The method of claim 1 , wherein the API data is processed to generate the user interface without using information from an API schema.
5. The method of claim 1 , comprising, responsive to receiving a user selection of a data element in the first graphical user interface component, highlighting a corresponding data element in the second graphical user interface component.
6. A system comprising:
a memory; and
a processing device, operatively coupled to the memory, the processing device to:
receive, from an application programming interface (API), a file containing API data;
apply, by a processing device, a set of pattern matching rules to the API data to identify graphical user interface components to be used to display the API data;
responsive to a determination that a same segment of the API data fits a pattern associated with two different types of graphical user interface component, generate a user interface comprising first and second graphical user interface components that display the same segment of the API data using different visual formats;
responsive to a determination that a second segment of the API data does not match with any of the pattern matching rules, display the second segment of the API data within the user interface as plain text that represents the API data in raw form; and
responsive to a determination that a third segment of the API data is nested within a hierarchical data structure of the file, nest a third graphical user interface component within a graphical container of the user interface that visually reflects the hierarchical data structure of the file, wherein the graphical container comprises a visual label comprising text extracted from the API data at a higher level of the hierarchical data structure of the file compared to the third segment of the API data used to generate the third graphical user interface component.
7. The system of claim 6 , wherein to generate the user interface, the processing device is further to add the third graphical user interface component at a position within the user interface that correlates with a location of the third segment in the API data.
8. The system of claim 6 , wherein the processing device is further to receive an API schema and augment the first, second, or third graphical user interface component with information from the API schema.
9. The system of claim 6 , wherein the processing device is to generate the user interface without using information from an API schema.
10. The system of claim 6 , wherein the processing device is further to:
receive a user selection of a data element in the first graphical user interface component; and
responsive to the user selection, highlight a corresponding data element in the second graphical user interface component.
11. A non-transitory computer-readable storage medium including instructions that, when executed by a processing device, cause the processing device to:
receive, from an application programming interface (API), a file containing API data;
apply, by a processing device, a set of pattern matching rules to the API data to identify graphical user interface components to be used to display the API data;
responsive to a determination that a same segment of the API data fits a pattern associated with two different types of graphical user interface component, generate a user interface comprising first and second graphical user interface components that display the same segment of the API data side-by-side using different visual formats;
responsive to a determination that a second segment of the API data does not match with any of the pattern matching rules, display the second segment of the API data within the user interface as plain text that represents the API data in raw form; and
responsive to a determination that a third segment of the API data is nested within a hierarchical data structure of the file, nest a third graphical user interface component within a graphical container of the user interface that visually reflects the hierarchical data structure of the file, wherein the graphical container comprises a visual label comprising text extracted from the API data at a higher level of the hierarchical data structure of the file compared to the third segment of the API data used to generate the third graphical user interface component.
12. The non-transitory computer-readable storage medium of claim 11 , wherein to generate the user interface, the instructions cause the processing device to add the third graphical user interface component at a position within the user interface that correlates with a location of the third segment in the API data.
13. The non-transitory computer-readable storage medium of claim 11 , wherein the instructions further cause the processing device to receive an API schema and augment the first, second, or third graphical user interface component with information from the API schema.
14. The non-transitory computer-readable storage medium of claim 11 , wherein the instructions further cause the processing device to generate the user interface without using information from an API schema.