{"id":15129867,"url":"https://github.com/pastjung/cors_react-springboot","last_synced_at":"2026-02-24T02:06:43.664Z","repository":{"id":256398746,"uuid":"855113842","full_name":"pastjung/CORS_React-SpringBoot","owner":"pastjung","description":"Docker를 사용해 React 프로젝트와 SpringBoot 프로젝트의 연결 및 CORS 설정 학습","archived":false,"fork":false,"pushed_at":"2024-09-10T13:10:34.000Z","size":240,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-11T17:13:52.465Z","etag":null,"topics":["cors","docker","docker-compose","node20","react","springboot3"],"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/pastjung.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"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}},"created_at":"2024-09-10T10:32:27.000Z","updated_at":"2024-09-10T13:13:41.000Z","dependencies_parsed_at":"2024-09-10T14:37:01.589Z","dependency_job_id":null,"html_url":"https://github.com/pastjung/CORS_React-SpringBoot","commit_stats":null,"previous_names":["pastjung/cors_react-springboot"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pastjung%2FCORS_React-SpringBoot","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pastjung%2FCORS_React-SpringBoot/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pastjung%2FCORS_React-SpringBoot/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pastjung%2FCORS_React-SpringBoot/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pastjung","download_url":"https://codeload.github.com/pastjung/CORS_React-SpringBoot/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247386903,"owners_count":20930732,"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":["cors","docker","docker-compose","node20","react","springboot3"],"created_at":"2024-09-26T02:22:00.572Z","updated_at":"2025-10-30T09:20:05.707Z","avatar_url":"https://github.com/pastjung.png","language":"Java","readme":"# Docker를 사용한 React 프로젝트와 SpringBoot 프로젝트의 연결 및 CORS 설정 방법 학습\n\n\u003e Initial written at September 10, 2024 \u003cbr/\u003e\n\u003e last updated at: September 10, 2024\n\n\n## Current: ver. 1.0.0\u003cbr/\u003e\n\u003e* ver 1.0.0.\n\u003e   * Init: 프로젝트 세팅 ( React + Spring Boot )\n\u003e   * CORS 설정\n\n# 1. 프로그램 (프로젝트) 설명\n- 본 프로젝트의 운영체제는 Linux OS를 기반으로 작성되었습니다.\n- 본 프로젝트는 Spring Security와 JWT를 고려하지 않은 프로젝트 입니다. ( 추후에 Spring Security를 도입할 경우 Filter와 연결해서 고려할 예정입니다. )\n- 본 프로젝트는 CORS 설정의 경우 Backend에서 설정하는 것이 바람직하다고 생각하여 Spring Boot 프로젝트에서 설정을 했습니다.\n\n# 2. Prerequisite\n\n- 본 프로젝트는 Docker를 사용하므로 `.env.template` 파일을 참고하여 `.env` 파일에 환경 변수값을 작성해주세요.\n    - `HOST_PORT` : 외부에서 컨테이너의 애플리케이션에 접근하는데 사용하는 포트 ( 노출되도 괜찮은 포트 )\n    - `SERVER_PORT` : 애플리케이션이 컨테이너 내에서 통신하는 포트 ( 노출되면 안되는 포트 )\n    - React에서는 보안이 필요한 환경변수의 유출을 막기 위해서 `REACT_APP_`으로 시작하지 않는 환경변수는 무시되기 때문에 `REACT_APP_SPRINGBOOT_HOST_PORT`가 필요합니다.\n    ```\n    # 예시\n    REACT_HOST_PORT=3001\n    REACT_SERVER_PORT=3000\n\n    SPRINGBOOT_HOST_PORT=8081\n    SPRINGBOOT_SERVER_PORT=8080\n\n    REACT_APP_SPRINGBOOT_HOST_PORT=8081\n    ```\n- 본 프로젝트는 Spring Boot 프로젝트가 포함되어 있으므로 `application.properties.template` 파일을 참고하여 `application.properties` 파일을 작성해주세요 \n    - 이때 `SPRINGBOOT_SERVER_PORT`와 `springboot-servie/src/main/resources/application.properties` 파일의 `server.port`를 일치시켜 주세요\n    ```\n    # 예시\n    spring.application.name=springboot-app\n    server.port=8080\n    ```\n\n# 3. 구동 방법\n\n## 3.1. 프로젝트 실행\n\n본 프로젝트는 Docker Compose를 사용하므로 이를 실행시켜주세요.\n\n```shell\n(sudo) docker compose up (--build)\n```\n\n## 3.2 프로젝트 종료\n\n본 프로젝트는 Docker Compose를 사용하므로 이를 실행시켜주세요.\n\n```shell\n(sudo) docker compose down (-v)\n```\n\n# 4. 디렉토리 및 파일 설명\n```\n    /project-root\n    ├── react-app/\n    │   ├── public/\n    │   │   ├── favicon.ico\n    │   │   ├── index.html\n    │   │   ├── logo192.png\n    │   │   ├── logo512.png\n    │   │   ├── manifest.json\n    │   │   └── robots.txt\n    │   ├── src/\n    │   │   ├── App.css\n    │   │   ├── App.js\n    │   │   ├── App.test.js\n    │   │   ├── index.css\n    │   │   ├── index.js\n    │   │   ├── logo.svg\n    │   │   ├── reportWebVitals.js\n    │   │   └── setupTests.js\n    │   │\n    │   ├── .gitignore\n    │   ├── dockerfile\n    │   ├── entrypoint.sh\n    │   ├── package-lock.json\n    │   ├── package.json\n    │   └── README.md\n    │\n    ├── springboot-app/\n    │   ├── gradle/\n    │   │   └── wrapper/\n    │   │       ├── gradle-wrapper.jar\n    │   │       └── gradle-wrapper.properties\n    │   ├── src/\n    │   │   ├── main/\n    │   │   │   ├── java/com/inha/springbootapp/\n    │   │   │   │   └── springbootAppApplication.java\n    │   │   │   └── resources/\n    │   │   │       ├── application.properties\n    │   │   │       └── application.properties.template\n    │   │   └── test/\n    │   │       └── java/com/inha/springbootapp/\n    │   │           └── springbootAppApplicationTest.java\n    │   │\n    │   ├── .gitignore\n    │   ├── build.gradle\n    │   ├── dockerfile\n    │   ├── entrypoint.sh\n    │   ├── gradlew\n    │   ├── gradlew.bat\n    │   └── settings.gradle\n    │\n    ├── .env\n    ├── .env.template\n    ├── .gitattributes\n    ├── .gitignore\n    ├── docker-compose.yml\n    └── README.md\n```\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpastjung%2Fcors_react-springboot","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpastjung%2Fcors_react-springboot","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpastjung%2Fcors_react-springboot/lists"}