Request Maker Component for Studio

Usage no npm install needed!

<script type="module">
  import stoplightRequestMaker from 'https://cdn.skypack.dev/@stoplight/request-maker';



Maintainability Test Coverage

A set of components used to craft http requests and view their responses.

Request Maker

Getting Started

First of all you need to add the library and all of the peer dependencies:

# Install the request maker
yarn add @stoplight/request-maker

# Install the peer dependencies
yarn add @stoplight/ui-kit mobx prismjs react react-dom @stoplight/prism-http


In order to manage component state, you need to create an instance of the RequestMakerStore and pass it to the RequestMakerProvider.

You can construct the store from scratch or from an existing http request or http operation.

Here's an example using an http request:

// Initialize the store with request data
const store = new RequestMakerStore({
  request: {
    method: 'get',
    url: 'https://stoplight.io',

// Add a content-type header
  name: 'content-type',
  value: 'application/json',
  isEnabled: true,

return (
  <RequestMakerProvider value={store}>
    <RequestEndpoint />

    <RequestEditor />

    <ResponseViewer />