The document introduces Postman Visualizer, a tool that allows API developers and consumers to turn raw API responses into visual representations like charts and graphs, enhancing data readability. It outlines the steps for both consumers and developers to utilize visualizations by installing templates and writing code. Postman Visualizer is freely accessible to all users at getpostman.com/api-visualizer.

1. Introducing
Postman Visualizer
Kaustav Das Modak
Developer Advocate, Postman
@kaustavdm
Turn your API data into charts and graphs

2. 8M+
DEVELOPERS
400K+
ORGANIZATIONS
250M+
APIs
The world’s #1 platform
for API development

3. Raw API response
is rarely human-readable
Run in Postman

4. Raw view

5. Pretty view

6. Preview view

7. Data is better with visualization
Source cdc.gov

8. Introducing
Postman Visualizer

9. Visualize API responses
Postman provides the capability to visualize API responses into rich graphs and charts

10. API
Consumers
API
Developers

11. Make more sense of API responses right inside Postman
Powerful, simple visualizations
API CONSUMERS

12. - Build with HTML/CSS/JS
- Use any library
- Create reusable data visualization
Go beyond raw
API responses
API Developers

13. - Visualizations are scripts
- Collaborate in workspaces
- Publish collection
Collaborate and
share
API Developers

14. API
Consumers
API
Developers

15. How do consumers use Visualizer?
1 Install a template
2 Trigger a request
3 Look under the Visualizer tab in response area
API CONSUMERS

16. Consuming Visualizer templates
HANDS-ON

17. API
Consumers
API
Developers

18. API
Consumers
API
Developers

19. How do developers use Visualizer?
1 Create request to fetch data from API
2 Write HTML/CSS/JavaScript code for data visualization
3 Bind API response data to data visualization code
API DEVELOPERS

20. Create request to fetch data from API
API DEVELOPERS

21. Write HTML/CSS/JavaScript code for
data visualization
Create Handlebars template
<p>Current temperature: {{temp}} C</p>
API DEVELOPERS

22. Bind API response data
Pass a Handlebars template string and the data to bind
pm.visualizer.set(tmpl, data)
API DEVELOPERS

23. Building Visualizer templates
HANDS-ON

24. Postman Visualizer is
free for everyone
getpostman.com/api-visualizer
Check out
@getpostmangetpostman.com