https://grokonez.com/spring-framework/spring-boot/kotlin-spring-boot/kotlin-springboot-restapi-angularjs-ajax-postget-messages-style-bootstrap-4

Kotlin SpringBoot RestAPI – AngularJs Ajax POST/GET messages – style with Bootstrap 4

In the tutorial, JavaSampleApproach will show you how to create a web application with Kotlin SpringBoot RestAPI, AngularJs Ajax POST/GET messages and styling with Bootstrap 4.

I. Technologies

– Java 1.8 – Maven 3.6.1 – Spring Tool Suite – Version 3.9.0.RELEASE – Bootstrap 4 – AngularJs – Spring Boot – 1.5.9.RELEASE - Kotlin

II. Goal

We create a Kotlin SpringBoot project that uses AngularJs Ajax to Post/Get messages, the project as below structure:

Run & check results
-> post message:

-> get message:

-> result:

III. Practice

Step to do: - Create Kotin SpringBoot project - Create Customer model - Implement Index view Controller - Implement RestAPIs - Create index view - Implement AngularJs Post/Get script

1. Create Kotin SpringBoot project

Use SpringToolSuite to create SpringBoot project with Kotlin language, see dependencies as below:

<properties>
	<kotlin.compiler.incremental>true</kotlin.compiler.incremental>
	<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
	<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
	<java.version>1.8</java.version>
	<kotlin.version>1.1.61</kotlin.version>
</properties>

<dependencies>
	<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-thymeleaf</artifactId>
	</dependency>
	<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-web</artifactId>
	</dependency>
	<dependency>
		<groupId>org.jetbrains.kotlin</groupId>
		<artifactId>kotlin-stdlib-jre8</artifactId>
		<version>${kotlin.version}</version>
	</dependency>
	<dependency>
		<groupId>org.jetbrains.kotlin</groupId>
		<artifactId>kotlin-reflect</artifactId>
		<version>${kotlin.version}</version>
	</dependency>

	<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-test</artifactId>
		<scope>test</scope>
	</dependency>
</dependencies>

<build>
	<sourceDirectory>${project.basedir}/src/main/kotlin</sourceDirectory>
	<testSourceDirectory>${project.basedir}/src/test/kotlin</testSourceDirectory>
	<plugins>
		<plugin>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-maven-plugin</artifactId>
		</plugin>
		<plugin>
			<artifactId>kotlin-maven-plugin</artifactId>
			<groupId>org.jetbrains.kotlin</groupId>
			<version>${kotlin.version}</version>
			<configuration>
				<compilerPlugins>
					<plugin>spring</plugin>
				</compilerPlugins>
				<jvmTarget>1.8</jvmTarget>
			</configuration>
			<executions>
				<execution>
					<id>compile</id>
					<phase>compile</phase>
					<goals>
						<goal>compile</goal>
					</goals>
				</execution>
				<execution>
					<id>test-compile</id>
					<phase>test-compile</phase>
					<goals>
						<goal>test-compile</goal>
					</goals>
				</execution>
			</executions>
			<dependencies>
				<dependency>
					<groupId>org.jetbrains.kotlin</groupId>
					<artifactId>kotlin-maven-allopen</artifactId>
					<version>${kotlin.version}</version>
				</dependency>
			</dependencies>
		</plugin>
	</plugins>
</build>

2. Create Customer model

More at:

https://grokonez.com/spring-framework/spring-boot/kotlin-spring-boot/kotlin-springboot-restapi-angularjs-ajax-postget-messages-style-bootstrap-4

Kotlin SpringBoot RestAPI – AngularJs Ajax POST/GET messages – style with Bootstrap 4

#kotlin #springboot #restapi #angularjs #ajax #bootstrap