Hello World

Create a new file HelloWorldVC.swift

import Komponents

class HelloWorldVC: UIViewController, StatelessComponent {
    
    override func loadView() {
        loadComponent()
    }
    
    func render() -> Node {
        return
            View(style: { $0.backgroundColor = .white }, [
                Label("Hello World", style: { $0.centerInContainer() })
            ])
    }
}

Let's explain what's happening here.

First we want to add import Komponents at the top of our file.

Here we create a UIViewController, so that we can present it on screen, this is classic iOS code. Then we say this is a StatelessComponent, which is pretty self-explanatory. Our component will render but has no state.

Calling loadComponent() inside loadView() will mount our component inside the UIViewController's view.

Finally, in the render method, we describe what we want to see on screen. Here we want a white view. This white view contains a Label "Hello World" which should be centered on both axis.