relay-runtime/llm-docs/guided-tour/rendering/environment.mdx

A core runtime for building GraphQL-driven applications.

---
id: environment
title: Environment
slug: /guided-tour/rendering/environment/
description: Relay guide to the environment
keywords:
- environment
- RelayEnvironmentProvider
- useRelayEnvironment
---

import DocsRating from '@site/src/core/DocsRating';
import {OssOnly, FbInternalOnly} from 'docusaurus-plugin-internaldocs-fb/internal';
// @fb-only
// @fb-only

## Relay Environment Provider

In order to render Relay components, you need to render a `RelayEnvironmentProvider` component at the root of the app:

```js
// App root

const {RelayEnvironmentProvider} = require('react-relay');
const Environment = require('MyEnvironment');

function Root() {
  return (
    <RelayEnvironmentProvider environment={Environment}>
      {/*... */}
    </RelayEnvironmentProvider>
  );
}
```

* The `RelayEnvironmentProvider` takes an environment, which it will make available to all descendant Relay components, and which is necessary for Relay to function.

// @fb-only

## Accessing the Relay Environment

If you want to access the *current* Relay Environment within a descendant of a `RelayEnvironmentProvider` component, you can use the `useRelayEnvironment` Hook:

```js
const {useRelayEnvironment} = require('react-relay');

function UserComponent(props: Props) {
  const environment = useRelayEnvironment();

  return (...);
}
```


// @fb-only



<DocsRating />