Wrap of an application

Question

In the world of React when I speak "the components that wrap the application", what does that mean? What does it mean to wrap the application?

Answer 1

Hello. Your question got a little vague, but to do a Wrap is to put the logic or the styles (or anything else) inside a component that will solve all this there.

I venture to say that Wrapper is the entire component. For example, say you have a title on every page of your application, like this:

<h1 style={{ color: '#f3f3f3', margin: 0, fontSize: '32px' }}>Titulo Top</h1>

As this will repeat on other pages, you create this component by wrapping it and using it on other pages. Like this:

import React from 'react';

const Title = props => (
  <h1 style={{ color: '#f3f3f3', margin: 0, fontSize: '32px' }}>{props.children}</h1>
);

export default Title;

Done. We did the Title Wrap and now you can use it on any page just importing it and inside the component use with <Title>Meu título</Title>.

See also this blog that uses exactly the term you put in doubt. There he talks about Component Wrap.