{"id":19791777,"url":"https://github.com/making/ssr-react-spring-boot-graalvm-js","last_synced_at":"2025-05-01T01:32:49.980Z","repository":{"id":232198971,"uuid":"783735391","full_name":"making/ssr-react-spring-boot-graalvm-js","owner":"making","description":"Server Side Rendering example with React + React Router + Vite + GraalVM (JS) + Spring Boot","archived":false,"fork":false,"pushed_at":"2024-07-31T05:55:59.000Z","size":429,"stargazers_count":7,"open_issues_count":8,"forks_count":2,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-07-31T07:22:03.951Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://ssr-react-spring-boot-graalvm-js-demo.apps.ik.am","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/making.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","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}},"created_at":"2024-04-08T13:21:17.000Z","updated_at":"2024-07-31T05:55:56.000Z","dependencies_parsed_at":"2024-04-09T16:39:15.684Z","dependency_job_id":"50ac5fa5-e9c6-4d57-a68e-f7899b771644","html_url":"https://github.com/making/ssr-react-spring-boot-graalvm-js","commit_stats":null,"previous_names":["making/ssr-react-spring-boot-graalvm-js"],"tags_count":0,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/making%2Fssr-react-spring-boot-graalvm-js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/making%2Fssr-react-spring-boot-graalvm-js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/making%2Fssr-react-spring-boot-graalvm-js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/making%2Fssr-react-spring-boot-graalvm-js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/making","download_url":"https://codeload.github.com/making/ssr-react-spring-boot-graalvm-js/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":224231433,"owners_count":17277386,"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":[],"created_at":"2024-11-12T07:04:52.468Z","updated_at":"2025-05-01T01:32:49.975Z","avatar_url":"https://github.com/making.png","language":"Java","readme":"# Server Side Rendering example with React + React Router + Vite + GraalVM (JS) + Spring Boot\n\nThis project demonstrates server-side rendering (SSR) using React with Spring Boot and GraalVM's JavaScript engine. The approach allows for faster page loads and improved SEO compared to client-side rendering.\n\nDemo: https://demo-blog.ik.am\n\n\u003e [!NOTE]\n\u003e This implementation assumes the use of GraalVM 21, however, except for native image creation, it should work with other JDK 21 implementations as well.\n\nBefore running the application in your IDE, please execute the following command to bundle the required JavaScript resources:\n\n```\n./mvnw compile\n```\n\n## Running the local server\n\nStart the application with proper code formatting applied:\n\n```\n./mvnw spring-javaformat:apply spring-boot:run\n```\n\nOnce the application is running, you can access it in your browser at:\n\nhttp://localhost:8080\n\n\u003cimg width=\"1024\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/854990cb-c1e5-4e75-b3f4-aba3cb3ce1b0\" /\u003e\n\nYou can also test the server-side rendering by making a request to one of the routes:\n\n```\ncurl -s http://localhost:8080/posts/1\n```\n\nThis will return the fully rendered HTML for the requested route.\n\n## UI development only\n\nFor UI development with hot-reloading capabilities, navigate to the UI directory and start the Vite development server:\n\n```\ncd ui\nnpm run dev\n```\n\nNote that for UI development, you need to have the backend server (localhost:8080) running. The UI development server will proxy API requests to the backend.\n\n## Creating an executable jar file\n\nBuild an executable JAR file with the following command:\n\n```\n./mvnw package -DskipTests\n```\n\nRun the packaged application:\n\n```\njava -jar target/ssr-react-spring-boot-graalvm-js-0.0.1-SNAPSHOT.jar \n```\n\nTest that the application is working correctly:\n\n```\ncurl -s http://localhost:8080/posts/1\n```\n\n## Native image creation\n\nNative images provide faster startup and reduced memory usage. To build a native image, ensure your `JAVA_HOME` points to GraalVM 21:\n\n```\n./mvnw -Pnative native:compile -DskipTests\n```\n\nRun the compiled native executable:\n\n```\n./target/ssr-react-spring-boot-graalvm-js --management.otlp.tracing.endpoint=https://httpbin.org/post\n```\n\nVerify the application is working:\n\n```\ncurl -s http://localhost:8080/posts/1\n```\n\nYou can also create a docker image as follows:\n\n```\n./mvnw spring-boot:build-image -DskipTests -Dspring-boot.build-image.imageName=ghcr.io/making/ssr-react-spring-boot-graalvm-js:native -Pnative\n```\n\nRun the docker image:\n\n```\ndocker run --name demo --rm ghcr.io/making/ssr-react-spring-boot-graalvm-js:native --management.otlp.tracing.endpoint=https://httpbin.org/post\n```\n\nThis containerized approach ensures consistent runtime environments across different deployment platforms.","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmaking%2Fssr-react-spring-boot-graalvm-js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmaking%2Fssr-react-spring-boot-graalvm-js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmaking%2Fssr-react-spring-boot-graalvm-js/lists"}