import org.springframework.web.bind.annotation.CrossOrigin; // React 개발 서버 허용 위해 추가 된 부분
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
@CrossOrigin(origins = "http://localhost:3000") // React 개발 서버 허용 위해 추가 된 부분
@RestController
public class HelloController {
@GetMapping("/hello")
public String hello(){
return "Hello, Spring Boot!";
}
}
##설명
프론트엔드(React)와 백엔드(Spring Boot)가 서로 다른 프로그램인데, HTTP 요청을 통해 데이터를 주고받는다는 점이에요.
🛠 구조 이해하기
Spring Boot
http://localhost:8080/hello 같은 주소에서 데이터를 제공 (API 서버 역할)
예: "Hello, Spring Boot!"라는 문자열을 반환
React
브라우저에서 실행되는 프론트엔드 앱
fetch("http://localhost:8080/hello") 코드로 Spring Boot 서버에 요청을 보냄
응답을 받아서 화면에 표시
연결 방식
React는 단순히 HTTP 요청을 보내는 클라이언트
Spring Boot는 그 요청을 받아서 응답을 돌려주는 서버
둘은 같은 PC에서 실행되지만, 서로 다른 포트(3000 vs 8080)로 동작
✨ 흐름 예시
브라우저에서 React 앱 실행 (localhost:3000)
React 코드(App.js) → fetch("http://localhost:8080/hello") 실행
Spring Boot 서버(localhost:8080) → "Hello, Spring Boot!" 응답
React → 응답을 받아서 <p>{message}</p>에 표시
브라우저 화면에 "Hello, Spring Boot!" 출력
✅ 결론
React는 백엔드(Spring Boot) API를 호출해서 데이터를 가져오는 역할을 합니다. 즉, JS 코드를 바꾼 건 단순히 “React가 어떤 API를 불러올지”를 지정한 거고, 실제 데이터는 Spring Boot가 제공하는 거예요.
PostgreSQL 컨테이너 띄우기 나중에 비교 학습을 위해 PostgreSQL도 준비해두면 좋아요:→ DBeaver에서 PostgreSQL 연결 추가.
docker run -d --name postgres -e POSTGRES_PASSWORD=postgres -p 5432:5432 postgres
Q1. postgre도 해보려고 하는데, docker run -d --name postgres -e POSTGRES_PASSWORD=postgres -p 5432:5432 postgres이 명령어로 설치 하고 난 다음에 PS C:\Windows\system32> docker exec -it postgres bash root@dad79a51ccad:/# psql -U postgres psql (18.2 (Debian 18.2-1.pgdg13+1)) Type "help" for help.
postgres=#
A1. 완벽합니다 🎉 지금 PostgreSQL 컨테이너도 정상적으로 올라가서 psql 프롬프트(postgres=#)까지 들어가신 거예요. 이제 Oracle과 PostgreSQL을 모두 준비하셨으니 DBeaver에서 두 DB를 연결해놓고 비교 학습을 시작할 수 있습니다.
🔗 PostgreSQL 접속 정보 (DBeaver에서 연결할 때)
Driver: PostgreSQL
Host: localhost
Port: 5432
Database: postgres
User: postgres
Password: 컨테이너 실행 시 지정한 POSTGRES_PASSWORD (지금은 postgres)
🧪 첫 실습 아이디어
Oracle에 테이블 생성
CREATE TABLE test_table ( id NUMBER PRIMARY KEY, name VARCHAR2(50) ); INSERT INTO test_table VALUES (1, 'Hello Oracle'); COMMIT;
PostgreSQL에 동일한 테이블 생성
CREATE TABLE test_table ( id SERIAL PRIMARY KEY, name VARCHAR(50) ); INSERT INTO test_table (name) VALUES ('Hello Postgres');
DBeaver에서 두 DB를 나란히 열고 비교
같은 SELECT 쿼리를 실행해보면서 결과와 문법 차이를 확인할 수 있습니다:
SELECT * FROM test_table;
✅ 정리
PostgreSQL 컨테이너 정상 실행 → psql 접속 성공
DBeaver에서 Oracle과 PostgreSQL을 모두 연결 가능
같은 테이블을 두 DB에 만들어놓고 쿼리 비교 실습 시작 가능
👉 원한다면 제가 Oracle과 PostgreSQL에서 자주 다른 SQL 문법 비교표를 만들어드릴 수 있습니다. 그러면 바로 실습할 때 참고하면서 차이를 체감할 수 있어요.
Q2. postgre에서는 select * from dual; 이 없어? 오류가 뜨네
A2. 맞아요 🙂 PostgreSQL에는 DUAL 테이블이 존재하지 않습니다.
🔍 이유
Oracle에서는 DUAL이라는 1행짜리 더미 테이블이 기본 제공돼서, 단순 계산이나 함수 테스트할 때 SELECT ... FROM dual;을 자주 씁니다.
PostgreSQL은 그런 더미 테이블이 필요 없어요. 그냥 SELECT 문만 실행하면 됩니다.
🛠 PostgreSQL에서 대체 방법
예시:
SELECT 1;
→ 결과로 1이 출력됩니다.
또는 함수 테스트:
SELECT NOW();
→ 현재 시간 출력.
문자열 테스트:
SELECT 'Hello Postgres';
✅ 정리
Oracle: SELECT * FROM dual;
PostgreSQL: SELECT 1;, SELECT 'text';, SELECT NOW(); 처럼 FROM 절 없이 바로 SELECT 가능
👉 원한다면 제가 Oracle과 PostgreSQL에서 자주 쓰이는 기본 쿼리 비교표를 만들어드릴 수 있습니다. 그러면 두 DB를 학습할 때 헷갈리지 않고 바로 차이를 확인할 수 있어요.