πŸ“Έ Application Preview πŸ‘¨β€πŸ’»

Ekran.Kaydi.2023-07-10.03.21.54.mov

πŸŽ“πŸ’»πŸ“š Web Programming Lesson ~ Homework πŸ‘¨β€πŸ’»

This project is an assignment given by Hamit MΔ±zrak for the Web Programming course. The goal of the assignment is to develop a web application that allows users to enter their username and password. The application will then send the data to a Spring API, which will save it to the database. After saving the data, the application will retrieve it using a jQuery GET request and display it using console.log or in the UI.

πŸ“ Project Structure πŸ—‚οΈ

src
β”œβ”€β”€ main
β”‚   β”œβ”€β”€ java
β”‚   β”‚   └── com
β”‚   β”‚       └── koc
β”‚   β”‚           └── finalproject
β”‚   β”‚               β”œβ”€β”€ FinalprojectApplication.java
β”‚   β”‚               β”œβ”€β”€ controller
β”‚   β”‚               β”‚   └── UserController.java
β”‚   β”‚               β”œβ”€β”€ dto
β”‚   β”‚               β”‚   └── UserDto.java
β”‚   β”‚               β”œβ”€β”€ entity
β”‚   β”‚               β”‚   └── User.java
β”‚   β”‚               β”œβ”€β”€ repository
β”‚   β”‚               β”‚   └── IUserRepository.java
β”‚   β”‚               └── service
β”‚   β”‚                   └── UserService.java
β”‚   └── resources
β”‚       β”œβ”€β”€ application.properties
β”‚       β”œβ”€β”€ static
β”‚       β”‚   β”œβ”€β”€ background.html
β”‚       β”‚   β”œβ”€β”€ css
β”‚       β”‚   β”‚   β”œβ”€β”€ bootstrap.min.css
β”‚       β”‚   β”‚   β”œβ”€β”€ bootstrap.min.css.map
β”‚       β”‚   β”‚   └── style.css
β”‚       β”‚   └── js
β”‚       β”‚       └── main.js
β”‚       └── templates
β”‚           β”œβ”€β”€ getall.html
β”‚           β”œβ”€β”€ login.html
β”‚           └── register.html

πŸ“Œ The project structure is organized as follows:

  • src/main/java/com/koc/finalproject: Contains the Java source code files.
    • FinalprojectApplication.java: The main class of the Spring Boot application.
    • controller/UserController.java: Defines the REST API endpoints for user-related operations.
    • dto/UserDto.java: Data transfer object for user information.
    • entity/User.java: Entity class representing a user in the database.
    • repository/IUserRepository.java: Interface for user repository, which provides database operations.
    • service/UserService.java: Service class for handling user-related business logic.
  • src/main/resources: Contains the configuration files and static resources.
    • application.properties: Configuration file for Spring Boot.
    • static: Directory for static files used in the frontend.
    • background.html: HTML file for displaying animated circles in the background.
    • css: Directory for CSS files.
      • bootstrap.min.css: Minified version of the Bootstrap CSS framework.
      • bootstrap.min.css.map: Source map file for Bootstrap CSS.
      • style.css: Custom CSS styles for the application.
    • js: Directory for JavaScript files.
      • main.js: JavaScript file for handling form submissions and AJAX requests.
  • src/main/resources/templates: Contains the HTML templates for the frontend.
    • getall.html: HTML template for displaying all users in a table.
    • login.html: HTML template for the login page.
    • register.html: HTML template for the registration page.

πŸ“Œ Dependencies:

  • Lombok 🌟
  • Spring Boot Starter Data JPA 🌐
  • Spring Boot Starter Validation βœ…
  • Spring Boot Starter Thymeleaf πŸƒ
  • Spring Boot Starter Test πŸ§ͺ
  • Spring Boot Starter Web 🌐
  • Spring Boot DevTools πŸ› οΈ
  • H2 Database πŸ—„οΈ

πŸ“Œ Usage

To run the project, you need to have Java and Maven installed on your system.

  1. Clone the repository:
git clone <repository-url>
  1. Navigate to the project directory:
cd finalproject
  1. Build the project using Maven:
mvn clean install
  1. Run the application:
mvn spring-boot:run
  1. Access the application in your browser at -> http://localhost:8080 <-
Happy Coding! πŸ’»πŸŽ‰