냠냠님의 게시글

팀프로젝트

[사이드 프로젝트]부모와 아이가 함께 하는 소아비만 관리 서비스 프론트 모집

질문&답변

백엔드 프론트엔드 배포 흐름이 이해가 안갑니다.

백엔드와 프론트엔드 통신 구조를 찾아보며 좀 더 공부해보았는데 아래와같이 이해해도 괜찮을까요? 3000번 포트는 React 앱을 실시간으로 보여주기 위한 개발 전용 서버에서만 사용되며, 운영 환경에서는 React 앱을 build한 후 생성되는 정적 파일(index.html, CSS, JS 등)을 S3, Nginx, CloudFront 등에 업로드하여 정적 호스팅을 사용한다. 사용자가 www.home.com 과 같은 도메인에 접근하면 1. 브라우저는 해당 서버(S3/Nginx)로부터 index.html을 다운로드한다. 2. index.html은 내부에서 main.js(React 번들)를 로드한다. 3. 브라우저는 이 js를 실행하여 React 앱을 시작한다. 4. 이후 페이지 이동은 모두 React가 브라우저 내에서 js로 동적으로 전환한다. 사용자 액션(버튼 클릭 등)으로 인해 https://api.home.com/api/find 와 같은 백엔드 API 요청이 발생하면, 5. 브라우저에서 React 앱이 백엔드(Spring, 8080 포트)로 API 요청을 보내고, 6. Spring 서버가 응답을 반환한다. 7. React가 그 결과를 화면에 렌더링한다. 즉 사용자요청 → 3000번 포트로 화면 띄워줌 → 8080포트로 API 요청 후 응답 반환 → 3000번 포트로 화면 띄운 뒤 브라우저에 전달 → 브라우저가 사용자에게 보여줌 이 아니라 사용자 요청 -> https://www.home.com (포트는 443, HTTPS) -> CloudFront or S3 or Nginx (정적 파일 호스팅) -> index.html + main.js + CSS 등 React 정적 파일 다운로드 -> 브라우저가 main.js 실행 → React 앱 구동 -> React 앱이 필요할 때 백엔드 API (예: https://api.home.com/api/user ) 요청 -> Spring 서버 (8080포트) 응답 -> React가 받은 데이터를 화면에 렌더링 React가 3000번 포트를 쓰는 이유 npm start로 실행할 때, React는 Webpack Dev Server 라는 개발용 서버 를 띄운다. 이 서버는 HTML/CSS/JS를 실시간으로 제공하며, 코드가 바뀔 때마다 자동 리로드되는 기능이 있다(Hot Reload). 이 서버는 프론트 개발자 편의를 위한 것이지, 실제 서비스용 서버가 아니다. 기 본적으로 3000번 포트를 사용하지만, 다른 포트로 바꾸는 것도 가능합니다. 즉 운영 시점에서는 3000번 포트가 존재하지 않는다. Spring이 8080번 포트를 쓰는 이유 Spring Boot는 기본적으로 8080 포트를 사용해 API 서버를 연다. 이 서버는 클라이언트(브라우저, React 앱 등) 의 요청을 받아서 데이터를 주거나 비즈니스 로직을 처리한다. 운영 환경에서도 API 서버는 그대로 8080번 포트를 사용한다. [개발 중] 브라우저 → localhost:3000 → React 개발 서버 ↘ 요청시 ↘ localhost:8080 → Spring API 서버 [운영 중] 브라우저 → www.home.com (S3/Nginx) → 정적 파일(index.html 등) ↘ 브라우저 안에서 JS → api.home.com (8080 포트) → Spring 서버 이렇게 이해해도 괜찮을까요?

팀프로젝트

[백엔드] 사이드프로젝트 팀원 구합니다

질문&답변

SpringBoot로 RDS 연결 에러

오류를 해결했습니다! 혹시 EC2 인스턴스를 통해 SpringBoot를 배포하여 테스트를 하지않고, 로컬에서 스프링 부트로 RDS만 연결해서 로컬 서버에서 간단한 html을 만들어 유저가 저장될 수 있도록 로직을 작성한 뒤, 값을 넣었습니다. 이후 디비버에서 저런식으로 값이 들어왔다면 잘 연동되었다고 할 수 있을까요?

팀프로젝트

공공데이터 활용 공모전 백엔드 구합니다

질문&답변

@ExceptionHandler JSON 반환

해결했습니당. getMember()메소드에서 매개변수로 @RequestParam이 아닌 @PathVariable을 받았어야했는데 애노테이션을 잘못 달아서 일어났던 오류네요ㅠ..ㅠ

질문&답변

V5 save에서 500오류

모두 감사합니당.. Map param = new HashMap (); private Map createParamMap(HttpServletRequest request) { Map paramMap = new HashMap (); request.getParameterNames().asIterator() .forEachRemaining(paramName -> paramMap.put(paramName, request.getParameter(paramName))); return paramMap; } createParamMap이라는 메소드를 만들어놓고 Map param = createParamMap(request)를 했어야했는데 Map param = new HashMap (); 라고 하여 데이터 값이 없어서 난 오류였습니다..ㅜㅜ 해결하는데 다들 도움 주셔서 감사합니다