Let's start the application to view the generated pages. In the Terminal, execute the Gradle command the follows:
> ./gradlew
This will start the server in development mode locally. Since the import-jdl step already compiled the frontend code, we don't have to run yarn start just to see the new pages, but please note that for further development it is better to use yarn start along with the preceding command. If you had the server already running while generating the entities, then no need to run this command, instead just compile the source again using the ./gradlew compileJava command. Using your IDE and Spring devtools will hot reload the application for you. If you had yarn start running then a hot reload will take place on the client side as well, otherwise, it will just refresh the page. We will see more about hot reloading in the next chapter.
Once you see the following message, the server is ready and we can navigate to the URL http://localhost:8080 in our favorite browser:
----------------------------------------------------------
Application 'store' is running! Access URLs:
Local: http://localhost:8080
External: http://192.168.2.7:8080
Profile(s): [swagger, dev]
----------------------------------------------------------
If you are not already logged in, sign in using the default admin user with the password admin by clicking on the Sign in link on the home page. Once logged in, click on the Entities link in the menu and you will see all our entities listed there:
Click on the Product and you will see the Products listing screen. It doesn't have any items yet as we haven't created any:
Let's create an entity, click on the Create a new Product button on the screen and you will see the Create or edit a Product popup dialog:
Enter Name, Description, Price, and Size. Choose an image by clicking on the Choose file button. Don't worry about Product Category as we haven't created any yet. Now click on Save and the popup will disappear and the listing screen will be refreshed with the success message:
The Products screen now shows our new entity with buttons for View, Edit, and Delete. There are also pagination links on the bottom. Explore the View, Edit, and Delete buttons by clicking on each of them.