> Markdown version of [Converting a UI when not using other frameworks](https://vaadin.com/docs/v23/tools/mpr/introduction/3-no-framework). Section index: [llms.txt](https://vaadin.com/docs/v23/tools/llms.txt)

# <a id="conversion"></a>Step 3 - Converting a UI when not using other frameworks

> **Note:** This step is needed in case your Vaadin 7 or 8 application doesn’t use Spring Boot, CDI or Navigator. If it uses any of those, go back to the [framework selection](https://vaadin.com/docs/v23/tools/mpr/introduction/3-legacy-uis.md).

## <a id="converting-uis"></a>Converting UIs

When not using a Navigator, you can replace the UI class with a Flow component by changing `init(VaadinRequest)` to a constructor and have UI.setContent to be `add(new LegacyWrapper(content))` instead.

Also remember to register `Route` for the class.

For example, this code:

```java
@Theme("valo")
public class AddressbookUI extends UI {
    private HorizontalLayout content = new HorizontalLayout();

    @Override
    protected void init(VaadinRequest vaadinRequest) {
        content.setSizeFull();
        setContent(content);
    }
}
```

Should be converted to this:

```java
@Route("")
public class AddressbookLayout extends Div {
    private HorizontalLayout content = new HorizontalLayout();

    public AddressbookLayout() {
        content.setSizeFull();
        add(new LegacyWrapper(content));
    }
}
```

> **Note:** Annotations in the UI, such as `@Theme` and `@Title` and so on, are dealt with later on in the tutorial. Most of them have similar counterpart in either Flow or MPR.

To make the code look less busy you can also implement the [HasLegacyComponents](https://vaadin.com/docs/v23/tools/mpr/configuration/adding-legacy-components.md#hasLegacyComponents) interface so you don’t need to use `new LegacyWrapper`.

```java
@Route("")
public class AddressbookLayout extends Div implements HasLegacyComponents {
    private HorizontalLayout content = new HorizontalLayout();

    public AddressbookLayout() {
        content.setSizeFull();
        add(content);
    }
}
```

## <a id="next-step"></a>Next step

- [Step 4 - Configuring UI parameters →](https://vaadin.com/docs/v23/tools/mpr/introduction/4-ui-parameters.md)

`C698E0D5-A213-4856-BDDC-C52C6940B729`
