Refactor and convert project to a Maven multimodule project and sync with Spring Petclinic Rest project

.github/workflows/maven-build.yml

@@ -13,11 +13,15 @@ jobs:
 
     steps:
       - uses: actions/checkout@v2
+        with:
+          submodules: 'recursive'
+
       - name: Set up JDK 17
         uses: actions/setup-java@v2
         with:
           java-version: '17'
           distribution: 'temurin'
           cache: maven
+
       - name: Build with Maven
         run: mvn -B install --file pom.xml -Djacoco.skip=true -DdisableXmlReport=true

.gitignore

@@ -1,13 +1,40 @@
-target/*
-.settings/*
+target/
+!.mvn/wrapper/maven-wrapper.jar
+!**/src/main/**/target/
+!**/src/test/**/target/
+
+### IntelliJ IDEA ###
+.idea/modules.xml
+.idea/jarRepositories.xml
+.idea/compiler.xml
+.idea/libraries/
+*.iws
+*.iml
+*.ipr
+
+### Eclipse ###
+.apt_generated
 .classpath
+.factorypath
 .project
-.idea
-*.iml
-/target
+.settings
+.springBeans
+.sts4-cache
+
+### NetBeans ###
+/nbproject/private/
+/nbbuild/
+/dist/
+/nbdist/
+/.nb-gradle/
+build/
+!**/src/main/**/build/
+!**/src/test/**/build/
 
-generated/
+### VS Code ###
+.vscode/
 
-# Easier branch switching
-springboot-petclinic-client/
-springboot-petclinic-server/
+### Mac OS ###
+.DS_Store
+
+.idea

.gitmodules

@@ -0,0 +1,3 @@
+[submodule "spring-petclinic-rest"]
+	path = spring-petclinic-rest
+	url = https://github.com/spring-petclinic/spring-petclinic-rest.git

.mvn/wrapper/maven-wrapper.properties

@@ -1,2 +1,2 @@
-distributionUrl=https://repo.maven.apache.org/maven2/org/apache/maven/apache-maven/3.6.3/apache-maven-3.6.3-bin.zip
-wrapperUrl=https://repo.maven.apache.org/maven2/io/takari/maven-wrapper/0.5.6/maven-wrapper-0.5.6.jar
+distributionUrl=https://repo.maven.apache.org/maven2/org/apache/maven/apache-maven/3.9.5/apache-maven-3.9.5-bin.zip
+wrapperUrl=https://repo.maven.apache.org/maven2/org/apache/maven/wrapper/maven-wrapper/3.2.0/maven-wrapper-3.2.0.jar

README.md

@@ -0,0 +1,43 @@
+# Spring PetClinic Sample - Reactjs Version
+
+## Motivation
+
+> As a long-time enthusiast of both [Java](https://dev.java/) and [React](https://react.dev/) technologies, I saw an exciting opportunity to rework the **Spring PetClinic Reactjs Version** project and combine creativity and technical skills into something robust and modern. Having used Java and React since my student days, I wanted to restructure the project into a multimodule [Maven](https://maven.apache.org/) project, taking full advantage of React for the frontend and [Spring Boot](https://github.com/spring-projects/spring-boot?tab=readme-ov-file#spring-boot---) for the backend. - Firas Regaieg
+
+The project is composed of 2 subprojects:
+1. **Spring PetClinic Reactjs Client** – React-based web UI client application.
+2. **Spring PetClinic Rest** – [REST API](https://restfulapi.net/) backend, integrated as a [Git submodule](https://git-scm.com/docs/gitsubmodules).
+
+The choice of using **Spring PetClinic Rest** as Git Submodule ensures that the backend can be updated independently without requiring code duplication. It also keeps the project stable by locking a specific version whenever there are breaking changes in the **Spring PetClinic Rest** subproject.
+
+NOTE ⚠️: _Some CRUD functionalities in the client are not fully implemented yet due to unresolved issues in the **Spring PetClinic Rest** repository ((like fetching Pets of a specific Owner. Currently, there is an [opened issue](https://github.com/spring-petclinic/spring-petclinic-rest/issues/145) about this), these will be addressed as soon as the backend fixes are made (by community), ensuring that the client-side work can proceed smoothly._
+
+## Technology Stack Overview
+
+The **Spring PetClinic Reactjs Client** is built with a modern stack to ensure some interesting characteristics such as scalability and maintainability. Here's a brief overview of the key technologies used:
+
+### React Framework
+
+The UI is built with React, providing a component-based architecture for building interactive user interfaces. React's flexibility and ecosystem make it suitable for scalable and maintainable applications.
+
+### Build Tool
+
+To enhance the development and build process, [Vite.js](https://vitejs.dev/) was chosen as the [build tool](https://en.wikipedia.org/wiki/Build_automation). Compared to traditional tools like [Webpack](https://webpack.js.org/), Vite offers blazing-fast development times, hot module replacement (HMR), and an overall faster build process, which significantly improves the developer experience. Its focus on modern [ES modules](https://nodejs.org/api/esm.html#introduction) also aligns perfectly with the React.js ecosystem.
+
+### Language
+
+[Typescript](https://www.typescriptlang.org/) was selected to provide type safety and improve code maintainability. By using TypeScript, we reduce runtime errors and make the development process smoother through better [IDE](https://en.wikipedia.org/wiki/Integrated_development_environment) support, autocompletion, and refactoring tools. Strict typing ensures that the codebase is robust and reliable, making it easier to collaborate on.
+
+### Linting and Code Formatting
+
+To ensure code quality and consistency, [ESLint](https://eslint.org/) and [Prettier](https://prettier.io/) are used for linting and formatting. ESLint helps catch errors and enforce coding standards, while Prettier ensures consistent code formatting across the project. By integrating both tools into the development workflow, we can maintain a clean, readable, and standardized codebase.
+
+NOTE: _It's worth noting that a very useful tool has been used to configure ESLint and Prettier without boilerplate configurations. It's [ESLint Config Universe](https://github.com/expo/expo/tree/main/packages/eslint-config-universe#eslint-config-universe) developed by [Expo](https://expo.dev/) team._
+
+### Forms Management
+
+Forms are a critical part of any admin application. [React Hook Form](https://react-hook-form.com/) simplifies form management by providing a minimalistic and performant API for handling form state, validation, and submission. Paired with [Yup](https://github.com/jquense/yup?tab=readme-ov-file#yup), a schema validation JS library, the form-handling process becomes powerful and clean, making it easier to manage form data and enforce validation rules throughout the application.
+
+### Routing
+
+For _custom_ navigation, [React Router](https://reactrouter.com/en/main/start/overview) provides a declarative way to manage routes in React.