# View

In the view, your DApp will occupy the whole viewpoint of the device; except the header of the system. You have a full right to customize it by owned style.

![The page view](https://3606779243-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FDSuDatsiBSDcGYiS7br6%2Fuploads%2FbyiJpsapkeHFz7bIJZGE%2F1.png?alt=media\&token=c47f5a63-de84-4a59-b93f-21fcee8fc21c)

To implement the view, the code will be placed in `./src/view` and declared by the file `./src/bootstrap.app.tsx` .

```typescript
// ./src/bootstrap.app.tsx

import { Provider } from 'react-redux'
import { UIProvider } from '@sentre/senhub'

import View from 'view'

import model from 'model'
import configs from 'configs'

const {
  manifest: { appId },
} = configs

export const Page = () => {
  return (
    <UIProvider appId={appId} antd>
      <Provider store={model}>
        <View />
      </Provider>
    </UIProvider>
  )
}

export * from 'static.app'
```

In the template, you can see that the `View` is exported with context providers (see [Providers](https://docs.sentre.io/development/providers)). Also, static files declared in `static.app.tsx` is exported here too. The structure in the `bootstrap.app.tsx` is compulsory for DApp recognition.