New Vaadin 10 project question

Flow
1

I’ve been a long time Vaadin user and I’m trying to wrap my head around Vaadin 10 and the differences from Vaadin 8. I’ve never been concerned with the “lower levels” of Web programming hence the attraction to Vaadin. It just did what I needed it to do.

I’ve downloaded and tested the Starter Project on Netbeans 8.2 and ran it successfully. Now I’m trying to create one of my own Vaadin 10 projects “from scratch” - a Hello World example - and I can get it to build and run but it doesn’t render properly in the browser. Here’s the code.

public class HelloWorld extends Div {

public HelloWorld() {

    VerticalLayout vlMain = new VerticalLayout();
    // two components:
    TextField name = new TextField("Name");
    name.setWidth("200px");

    Button greet = new Button("Greet");

    // add them to "this" layout (a VerticalLayout)
    vlMain.add(name, greet);

    // add logic through event listeners
    greet.addClickListener(event
            -> add(new Span("Hello, " + name.getValue())));
    
    add(vlMain);

}

}

and the attached screen snap is what it looks like in the browswer. What am I missing?

17187897.png

2

What does the browser console say? Looks like it fails to load some component resources

3

I’m not sure exactly what to look for in order to respond to your request. I’ve looked in the Console section of Firefox but there’s nothing that looks to me that there’s an error. And I’m not yet familiar with this level of debugging to know what to look for.

Is there something in the project or POM file I need to include in order for the project to be able to get access to missing component resources?

4

I somehow got it working but I’m not sure which item corrected the problem. I added this to my code:

@HtmlImport(“frontend://styles/shared-styles.html”)
@Viewport(“width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes”)

and I copied all “missing items” from the Starter project POM file to my new project POM file.

It’s still a bit magical to me so I will simply accept that this is what needs to be done for a new project. I will delve a bit more into the magic as I have time. I would prefer a bit more in the documentation in terms of what needs to be the minimum starting point for a new Vaadin 10 project. With the earlier versions (as a Netbeans user) I didn’t have to do too much thinking to create a new project after I loaded the Netbeans module and created a new maven Vaadin project. But I can certainly accept a Project Template as a starting point too. :wink: