Part one: My first java web development app using spring boot in the backend

Learning new technology is fun and gives you more passion to learn. After learning all concepts of web-development in Bootcamp, it’s so easy to learn new tech, new programming language, new tech library, and new framework. By self-study, I added new skills to my web development skills, this technology called java full-stack development using Spring framework. In this post we will talk about the server-side (backend) technology, in the next post, we will talk about the client-side (front end) development by using JavaScript library react. The best way to learn new technology is a hands-on practice with making a small new project. To learn java full-stack development technology, you should have java core experience or enough knowledge. The tool we have used in this technology is a Spring ToolSuite4 that contains a spring boot framework which is a java-based backend lightweight framework that makes development faster than other Java-based frameworks. We started by making new repository in the github called java-react-crud, then we followed this steps steps :

We started our project by using the spring initializr website it is a website that can create a basic spring boot structure for use after we fill out the necessary fields needed in this project:


Project: Maven Project

Language: Java

Spring Boot. version: 2.4.3

Project Metadata

Groupid: com.something => group id

Artificid: java-react-crud => project name

Package name => gives one pacakge that include main class

Packaging: jar

dependencies : jpa , spring web, h2-database

Click on generate


Maven project: This is a management tool or java dependency management to run a web application, it is not necessary in spring but makes it easier to manage. It used for project build, dependencies, documentation, based on POM(project object model). POM: Is an XML file that contains information about the project and configuration details used by maven to build the java-based project or kotlin . Spring web: To build web includes web RESTFUL, and application using MVC.

JPA: Uses spring data and Hibernate, it provides ORM(object-relational mapping) for java developers, JPA entity is a java class that present structure of database table and fields of an entity class appear as a column of database table.

Hibernate: This is a kind of java-based JPA persistence API implementation used by spring by default. It is used in large scale applications

After we generated our spring initialize structure, we will import it our Spring toolsSuite4, Import => maven=> existing maven project

UML relation for this simple project is two domain class

User and Appointment tables, and we made the relation between them, a user has many appointments and an appointment has one user.

The structure of the spring project is like this :

In src/main/java, we have made the main package called com.pack.main, this package includes :

1- package called com.pack.main.domain => includes two classes

2- package called com.pack.main.repository => includes all repository

interface that extends CrudRepositorinterfacey.

3- package called com.main.pack.webcontroller => includes all classes necessary for web controller

4- main class called JavaReactCrudApplication => to run application

5- package called => we will add this package and his class when we start to work on react front end and request posts we will make another package for CRUD services Called

How main class woks?

In Our main class, the main static method includes an important class called

SpringApplication: Is a Class that can be used to bootstrap and launch a Spring application from a Java main method by using a run method that takes two arguments JavaReactCrudApplication.class and args.

In the main class we also used CommandLineRunner():

CommandLineRunner is an interface used to indicate that a bean should run when it is contained within a SpringApplication, we used here as a seed file to store some data to databases. CommandLineRunner will call and run before static main method to prove that we used method in both inside static main method and inside CommandLineRunner, and we saw the result :

com.pack.main.JavaReactCrudApplication: Afandy AHMED, I’m in CommandLineRunner and i should run before the static main method

2021–03–06 16:04:51.256 INFO 92576 — — [ main] com.pack.main.JavaReactCrudApplication: Hello AHMED, I’m in the static main method

We run some data inside CommandLineRunner

User user1 = new User(“Ahmed Afandy”,””));

User user2 = new User(“Aylin Afandy”,””)) Appointment(“appointment with Doctor”,”health”,”03/12/2021",”2:30pm”,user1));

We referenced a variable called user1 type User object, we called .save method from user repo object that extends from CrudRepository that Interface for generic CRUD operations on a repository for a specific method will accept object type User as an argument, that we created new object by new keyword and class name, this class will fill with all his object attributes.

After we created some users and injected them into the database we will create some appointments and will be injected into the database, it will take the same process as a user created. Because we have many relationships with a user, then we will add user id or user object to appointment attributes to complete the process.

After we run our data, we will see our data in the application server Apache Tomcat, which uses 8080 port

We can see our data in the database by using the H2 console provided by H2-database(fast in-memory database).


Some important annotations we used in our applications :

@SpringBootApplication: Includes multi annotation uses as configuration class declares one or more bean methods.

Bean: This is a java class that encapsulates many objects into a single object.

@Entity: means this class is an entity and is mapped to the database.

@Id: Specifies the primary key of an entity

@GeneratedValue(strategy=GenerationType.AUTO): Id is automatically generated by the database.

@ManyToOne(fetch = FetchType.EAGER): a strategy for fetching data, Lazy means when user fetched from DB, all the appointments will fetch when needed, EAGER mean will fetch immediately.

@JoinColumn(name=” user”): Specify the joining column associates with another table. Appointments table contains users column.

@OneToMany( mappedBy=”user”,cascade=CascadeType.ALL) : associations user has many appointments, ascadeType.ALL: cacadeType.ALL means if the user deleted, all his appointment also will be delete.

@RestController: This annotation combines two annotations @Controller and @ResponseBody used for Restful controllers.

@Autowired: enables the dependency injections. This injection used to pass dependencies into an object.

@RequestMapping: is used to mapping a particular HTTP request method to an object.

Junior software developer

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Optimization and Linear Programming

Type-Safe HTML in Swift

Pulsar Function Deep Dive

How Ghosts Could Be Real

Photo by cottonbro from Pexels

Top Things to Consider When Choosing a Functional Testing Tool

The Showmax Engineering story, Part II.

Upswing Product Update — May 14, 2020

Climb Up To Pyramid And Stop At The Second Floor

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store


Junior software developer

More from Medium


CS373 Spring 2022: Presley Heikkila

Visualizing your experience

What is an API?