{"id":18048043,"url":"https://github.com/ivangfr/https-springboot-react","last_synced_at":"2025-04-10T09:46:02.184Z","repository":{"id":38310305,"uuid":"195555092","full_name":"ivangfr/https-springboot-react","owner":"ivangfr","description":"The goal of this project is to play with HTTPS and enable it in Spring Boot applications. For it, we will implement a Spring Boot Rest API that will have its endpoints ready to accept and server over HTTPS. Furthermore, a Spring Boot Shell Java application and a Frontend React application will be implemented to consume movies-api.","archived":false,"fork":false,"pushed_at":"2024-12-19T19:34:19.000Z","size":5798,"stargazers_count":17,"open_issues_count":0,"forks_count":9,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-24T08:42:05.725Z","etag":null,"topics":["h2","https","java","javascript","keytool","pkcs12","react","semantic-ui-react","spring-boot","spring-data-jpa","spring-shell","spring-web-mvc","springdoc-openapi"],"latest_commit_sha":null,"homepage":"","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ivangfr.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":"ivangfr"}},"created_at":"2019-07-06T15:32:15.000Z","updated_at":"2024-12-19T19:34:23.000Z","dependencies_parsed_at":"2023-02-08T05:45:23.688Z","dependency_job_id":"606b6051-45f1-4b96-8b68-54341d444d47","html_url":"https://github.com/ivangfr/https-springboot-react","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ivangfr%2Fhttps-springboot-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ivangfr%2Fhttps-springboot-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ivangfr%2Fhttps-springboot-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ivangfr%2Fhttps-springboot-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ivangfr","download_url":"https://codeload.github.com/ivangfr/https-springboot-react/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248196353,"owners_count":21063402,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["h2","https","java","javascript","keytool","pkcs12","react","semantic-ui-react","spring-boot","spring-data-jpa","spring-shell","spring-web-mvc","springdoc-openapi"],"created_at":"2024-10-30T20:11:05.057Z","updated_at":"2025-04-10T09:46:02.154Z","avatar_url":"https://github.com/ivangfr.png","language":"Java","readme":"# https-springboot-react\n\nThe goal of this project is to play with [`HTTPS`](https://en.wikipedia.org/wiki/HTTPS) and enable it in [`Spring Boot`](https://docs.spring.io/spring-boot/index.html) applications. For it, we will implement a `Spring Boot` REST API, called `movies-api` that will have its endpoints ready to accept and server over `HTTPS`. Furthermore, a `Spring Boot Shell` Java application, called `movies-shell`, and a Frontend [`React`](https://react.dev/) application, called `movies-ui`, will be implemented to consume `movies-api`.\n\n## Proof-of-Concepts \u0026 Articles\n\nOn [ivangfr.github.io](https://ivangfr.github.io), I have compiled my Proof-of-Concepts (PoCs) and articles. You can easily search for the technology you are interested in by using the filter. Who knows, perhaps I have already implemented a PoC or written an article about what you are looking for.\n\n## Applications\n\n- ### movies-api\n\n  `Spring Boot` Web Java application that exposes a REST API to manage movies. Its endpoints are ready to accept and server over `HTTPS`. `movies-api` stores its data in [`H2`](https://www.h2database.com/html/main.html) memory database.\n\n- ### movies-shell\n\n  `Spring Boot` Shell Java application that uses `movies-api` to get information about a movie or to even add/delete a movie. All the communication with `movies-api` is over `HTTPS`.\n\n- ### movies-ui\n\n  `React` frontend application where users can manage movies. All the communication with `movies-api` is over `HTTPS`. It uses [`Semantic UI React`](https://react.semantic-ui.com/) as CSS-styled framework.\n\n## Prerequisites\n\n- [`npm`](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)\n- [`Java 21+`](https://www.oracle.com/java/technologies/downloads/#java21)\n\n## Start applications\n\n- **movies-api**\n\n  - Open a terminal and, inside the `https-springboot-react/movies-api` folder, run the command bellow:\n    ```\n    ./mvnw clean spring-boot:run\n    ```\n\n  - Access Swagger website at https://localhost:8443/swagger-ui.html\n\n  - Once accessed for the first time, the following page will appear\n\n    ![your-connection-is-not-private-8443](documentation/your-connection-is-not-private-8443.jpeg)\n\n  - Click `Advanced` \u003e `Proceed to localhost (unsafe)`\n\n    Now, you should see:\n\n    ![movies-api-swagger](documentation/movies-api-swagger.jpeg)\n  \n  - To re-enable the security warning saying `Your connection is not private` for `https://localhost:8443/swagger-ui.html`, click `Not Secure` (in the address bar) \u003e `Re-enable warnings`\n\n- **movies-shell**\n\n  - Open a new terminal and navigate to the `https-springboot-react/movies-shell` folder\n  \n  - Run the command below to package the `jar`:\n    ```\n    ./mvnw clean package -DskipTests\n    ```\n\n  - Run the following command to start `movies-shell`:\n    ```\n    ./target/movies-shell-0.0.1-SNAPSHOT.jar\n    ```\n\n  - Sample of the shell interface and execution\n\n    ![movies-shell](documentation/movies-shell.jpeg)\n\n- **movies-ui**\n\n  - Open a new terminal and navigate to the `https-springboot-react/movies-ui` folder;\n\n  - Execute the command below if you are running it for the first time:\n    ```\n    npm install\n    ```\n\n  - To start `movies-ui` run:\n    ```\n    npm start\n    ```\n\n  - Access https://localhost:3443\n\n  - Once accessed for the first time, the following page will appear:\n\n    ![your-connection-is-not-private-3443](documentation/your-connection-is-not-private-3443.jpeg)\n\n  - Click `Advanced` \u003e `Proceed to localhost (unsafe)`\n\n    Now, you shoud see:\n\n    ![movies-ui](documentation/movies-ui.jpeg)\n\n    \u003e **Note:** In case `movies-ui` cannot communicate with `movies-api`\n    \u003e - Open `movies-api` Swagger website: https://localhost:8443/swagger-ui.html\n    \u003e - Click `Advanced` \u003e `Proceed to localhost (unsafe)`\n    \u003e - Reload `movies-ui` page\n  \n  - To re-enable the security warning saying `Your connection is not private` for `https://localhost:3443`, click `Not Secure` (in the address bar) \u003e `Re-enable warnings`.\n\n## Shutdown\n\nTo stop `movies-api`, `movies-ui` and `movies-shell`, go to the terminal where they are running and press `Ctrl+C`\n\n## Create PKCS12 self-signed certificate\n\n- In order to create a [`PKCS12`](https://en.wikipedia.org/wiki/PKCS_12) certificate, run the following command:\n  ```\n  keytool -genkeypair -alias localhost \\\n    -keyalg RSA -keysize 2048 -storetype PKCS12 \\\n    -keystore keystore.p12 -validity 3650 \\\n    -dname \"CN=localhost, OU=MyCompany, O=MyCompany, L=Berlin, ST=Berlin, C=DE\"\n  ```\n\n- Set a password. In this project, we will use `secret`:\n  ```\n  Enter keystore password: secret\n  Re-enter new password: secret\n  ```\n\n- To list the certificates `keystore.p12` run the command below. The password will be requested:\n  ```\n  keytool -list -v -keystore keystore.p12\n  ```\n\n## How to upgrade movies-ui dependencies to latest version\n\n- In a terminal, make sure you are inside the `https-springboot-react/movies-ui` folder\n\n- Run the following commands:\n  ```\n  npm upgrade\n  npm i -g npm-check-updates\n  ncu -u\n  npm install\n  ```\n\n## References\n\n- https://www.javadevjournal.com/spring-boot/spring-boot-ssl/\n- https://www.baeldung.com/spring-boot-https-self-signed-certificate\n- https://www.thomasvitale.com/https-spring-boot-ssl-certificate/\n- https://medium.com/@danielgwilson/https-and-create-react-app-3a30ed31c904","funding_links":["https://github.com/sponsors/ivangfr"],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fivangfr%2Fhttps-springboot-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fivangfr%2Fhttps-springboot-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fivangfr%2Fhttps-springboot-react/lists"}