import React from 'react';
import ReactDOM from 'react-dom';
import { atom, selector, RecoilRoot } from 'recoil';
import { RecoilDevtools } from 'recoil-devtools';
import { RecoilLogger } from 'recoil-devtools-logger';

const a = atom({
  /* ... */
});
const b = selector({
  /* ... */
});
const c = atom({
  /* ... */
});

const App = () => (
  <RecoilRoot>
    <RecoilDevtools values={[a, b]}>
      {/* logs for related recoil values "a" and "b" */}
      <RecoilLogger />
    </RecoilDevtools>

    {/* code ... */}
  </RecoilRoot>
);

ReactDOM.render(<App />, document.getElementById('root'));