Answer 1: Spring Boot is Java-based web application framework that is based on Spring. With Spring Boot you can develop stand-alone web applications with embedded application server.
Answer 2: Eclipse is open source integrated development environment (IDE) and it is mostly used for Java programming, but it supports multiple other programming languages as well.
Answer 3: Maven is open source software project management tool. Maven can manage builds, documentation, testing, and more in the software development project.
Answer 4: The easiest way to start a new Spring Boot project is to create it with Spring Initializr web page. That creates a skeleton for your project with the modules that you need.
Answer 5: If you are using the Eclipse IDE you just activate you main class and press Run button. You can also use Maven command mvn spring-boot:run to run an application.
Answer 6: Spring Boot starter package provides logging features for you. You can define the level of logging in the application.properties settings file.
Answer 7: The error and log messages can be seen in the Eclipse IDE console after you run the application.
Answer 1: ORM is a technique that allows you to fetch and manipulate from a database using an object-oriented programming paradigm. JPA provides object-relational mapping for Java developers. Hibernate is Java-based JPA implementation.
Answer 2: Entity class is just standard java class that is annotated with the @Entity annotation. Inside the class you have to implement constructors, fields, getters and setters. The field(s) that will be the unique id is annotated with the @Id annotation.
Answer 3: You have to create a new interface that extends Spring Data CrudRepository interface. In the type arguments you define the entity and the type of the id field, for example, <Car, Long>.
Answer 4: CrudRepository provides all CRUD operations to your entity. You can create, read, update, and delete your entities using the CrudRepository.
Answer 5: You have to create entity classes and link the entities using the @OneToMany and the @ManyToOne annotations.
Answer 6: You can add demo data in your main application class using CommandLineRunner.
Answer 7: Define the endpoint for the H2 console in your application.properties file and enable it. Then you can access the H2 console by navigating to the defined endpoint with a web browser.
Answer 8: You have to add MariaDB dependency to the pom.xml file and define the database connection settings in the application.properties file. Remove the H2 database dependency from the pom.xml file, if you have used that.
Answer 1: REST is an architectural style for creating web services and it defines a set of constraints.
Answer 2: The easiest way to create RESTful web service with Spring Boot is to use Spring Data REST starter package. By default, the Spring Data REST finds all public repositories and creates automatically RESTful Web Services for your entities.
Answer 3: By sending a GET request to the endpoint of the entity. For example, if you have entity class called Car the Spring Data REST creates the endpoint called /cars that can be used to fetch all cars.
Answer 4: By sending a DELETE request to the endpoint of the individual entity item. For example, /cars/1 deletes an car with id 1.
Answer 5: By sending a POST request to the endpoint of the entity. The header must contain the Content-Type field with the value application/json and the new item will be embedded in the request body.
Answer 6: By sending a PATCH request to the endpoint of the entity. The header must contain the Content-Type field with the value application/json and the updated item will be embedded in the request body.
Answer 7: You have to annotate your repository using the @RepositoryRestResource annotation. The query parameters are annotated using the @Param annotation.
Answer 1: Spring Security provides security services for Java-based web applications.
Answer 2: You have to add Spring Security started package dependency to your pom.xml file. You can configure Spring Security by creating a security configuration class.
Answer 3: JWT (JSON Web Token) is a compact way to implement authentication in modern web applications. The size of the token is small and therefore it can be sent in the URL, in the POST parameter or inside the header.
Answer 4: You can use the Java JWT library that is the JSON web Token library for Java. The authentication service class adds and reads the token. The filter classes handles the login and authentication process.
Answer 5: You have to add Spring Boot test starter package to your pom.xml file. Spring Boot test starter package provides a lot of nice testing utilities, for example JUnit, AssertJ, and Mockito. When using the JUnit, the basic test classes are annotated with the @SpringBootTest annotation and the test methods should start with @Test annotation.
Answer 6: The test cases can be easily executed with the Eclipse IDE by running the test classes (Run | JUnit test). The test results can be seen in the JUnit tab.
Answer 1: Node.js is an open source JavaScript-based server side environment. Npm is a package manager for JavaScript.
Answer 2: You can find the installation packages and instructions for multiple operating systems from https://nodejs.org/en/download.
Answer 3: Visual Studio Code (VSCode) is an open source code editor for multiple programming languages.
Answer 4: You can find the installation packages and instructions for multiple operating systems from https://code.visualstudio.com.
Answer 5: You have to install create-react-app globally using the npm. Then you create an app using the following command create-react-app projectname.
Answer 6: You can run the app using the following command npm start or yarn start.
Answer 7: You can start by modifying the App.js file and when you save the modification, you can see the changes immediately in the web browser.
Answer 1: The components are the basic building blocks of the React apps. The React component can be created using a JavaScript function or ES6 class.
Answer 2: The props and state are the input data for rendering the component. They are JavaScript objects and the component is re-rendered when the props or the state are changing.
Answer 3: The data flow is going from the parent component to child.
Answer 4: The components that have only props are called stateless components. The components that have both the props and the state are called stateful components.
Answer 5: JSX is the syntax extension for JavaScript and it is recommended to use with React.
Answer 6: The component life cycle methods are executed at the certain phases of the component's life cycle.
Answer 7: It is similar to handling DOM element events. The difference in React is that event naming uses camelCase naming convention for example, onClick or onSubmit .
Answer 8: The common case is that we want to invoke a JavaScript function that has access to form data after the form submission. Therefore we have to disable default behavior using preventDefault() function. You can use input field's onChange event handler to save the values from a input fields to the state.
Answer 1: A promise is an object the represents the result of an asynchronous operation. The use of promises simplifies the code when doing asynchronous calls.
Answer 2: The Fetch API provides fetch() method that you can use to make asynchronous calls using the JavaScript.
Answer 3: The REST API fetch() call is recommended to do inside the componentDidMount() life cycle method that is invoked when the component has been mounted.
Answer 4: You can access the response data using the promises with the fetch() method. The data from the response is saved to the state and the component is re-rendered when the state has changed.
Answer 1: You can find the React component from multiple sources for example, https://js.coach/ or https://github.com/brillout/awesome-react-components.
Answer 2: You can install React components using the npm or yarn package managers. When using npm, here is the command we use, npm install <componentname>.
Answer 3: You have to install React Table component. After the installation you can use the ReactTable component in the render() method. You have to define the data and the columns using the ReactTable props. The data can be an object or an array.
Answer 4: One way to create modal forms in React app is to use React Skylight component (https://marcio.github.io/react-skylight/).
Answer 5: You have to install Material-UI component library using the following command npm install @material-ui/core. After the library installation you can start to use components. The documentation of the different components can be found from https://material-ui.com.
Answer 6: Routing can be implemented using the React Router component (https://github.com/ReactTraining/react-router).
Answer 1: With the mock-up, it is much easier to discuss needs with the client before you start to write any actual code. Changes to the mock-up are really easy and fast to do, compared to modifications with real frontend source code.
Answer 2: There is lot of suitable applications available to do mock-ups easily. You can also use paper and pencil to create mock-up.
Answer 3: You can modify the security configuration class to allow access to all endpoints without authentication.
Answer 1: First you have to call REST API using the fetch() method. Then, you can access the response data using the promises with the fetch() method. The data from the response is saved to the state and the component is re-rendered when the state has changed.
Answer 2: You have to send a DELETE method request using the fetch() method. The endpoint of the call is the link to the item that you want to delete.
Answer 3: You have to send a POST method request using the fetch() method to the entity endpoint. The added item should be embedded in the body and you have to add Content-Type header with application/json value.
Answer 4: You have to send a PATCH method request using the fetch() method. The endpoint of the call is the link to the item that you want to update. The updated item should be embedded in the body and you have to addContent-Typeheader withapplication/json value.
Answer 5: You can use some third-party React component to show toast messages like React Toastify.
Answer 6: You can use some 3rd party React component to export data to CSV file like React CSV.
Answer 1: Material-UI is the component library for React and it implement the Google's Material Design.
Answer 2: First you have to install Material-UI library using the following command npm install @material-ui/core. Then you can start to use component from the library. The documentation of the different components can be found from https://material-ui.com/.
Answer 3: You can remove a component using the following npm command npm remove <componentname>.
Answer 1: Jest is a test library for JavaScript and it is developed by Facebook.
Answer 2: Create a test file using the .test.js extension. Implement your test cases inside the file and you can run the tests using the following command npm test.
Answer 3: For the snapshot testing you have to install react-test-render package and you have to import renderer to you test file. Implement your snapshot test cases inside the file and you can run the tests using the following command npm test.
Answer 4: Enzyme is a JavaScript library for testing the React component's output.
Answer 5: Using the following npm command npm install enzyme enzyme-adapter-react-16 --save-dev.
Answer 6: You have to import Enzyme and Adapter components to your test file. Then you can create you test cases to render a component. With the Enzyme, you can use Jest for assertions.
Answer 7: Enzyme provides the simulate method that can be used to test events.
Answer 1: You have to create a new component that renders input fields for the username and the password. The component contains also a button that calls /login endpoint when the button is pressed.
Answer 2: The call from the login component is made using the POST method and an user object is embedded in the body. If the authentication is succeeded, the backend sends the token back in the Authorization header.
Answer 3: The token can be saved to session storage using the sessionStorage.setItem() method.
Answer 4: The token have to be included to the request's Authorization header.
Answer 1: You can create an executable JAR file by using the following Maven command mvn clean install.
Answer 2: The easiest way to deploy Spring Boot application is to push your application source code to the GitHub and use GitHub link from the Heroku.
Answer 3: The easiest way to deploy the React app to Heroku is to use the Heroku Buildpack for create-react-app (https://github.com/mars/create-react-app-buildpack).
Answer 4: Docker is a container platform that makes software development, deployment, and shipping easier. Containers are lightweight and executable software packages that include everything that is needed to run software.
Answer 5: The Spring Boot application is just an executable JAR file that can be executed with Java. Therefore, you can create Docker container for Spring Boot application similar way than you create for any Java JAR application.
Answer 6: You can pull the latest MariaDB container from the Docker Hub using the following Docker command docker pull mariadb:latest.
Answer 1: It makes code more readable and easier to maintain. It also makes team work much easier because everyone are using the same structure in the coding.
Answer 2: It makes code more readable and easier to maintain. The testing of the code is easier.
Answer 3: It makes code more readable and easier to maintain. It also makes team work much easier because everyone are using the same naming convention in the coding.
© 2018 Packt Publishing Limited All Rights ReservedAuthor (1)
