Fix(docker): resolve infinite loading (Fixes #102)

docker-compose.yml

@@ -1,12 +1,24 @@
 services:
-  frontend:
-    build:
-      context: ./frontend/spec-trackr-app  # Dockerfile이 위치한 경로
-      dockerfile: frontend.dockerfile  # 사용할 Dockerfile 이름
-
-    container_name: react_frontend  # 컨테이너 이름 지정
+  spec-trackr:
+    build: 
+      context: ./frontend/spec-trackr-app
+      dockerfile: sta.dockerfile
+    ports:
+      - "3001:3001"  # 고정 포트 매핑
+    networks:
+      - spec-net
 
+  spectrackr-main:
+    build: 
+      context: ./frontend/spectrackr-main
+      dockerfile: main.dockerfile
     ports:
-      - "3002:80"  # 로컬 머신의 3002 포트를 컨테이너의 80번 포트에 연결
+      - "3003:3003"  # 고정 포트 매핑
+    networks:
+      - spec-net
+    depends_on:
+      - spec-trackr
 
-    restart: unless-stopped  # 컨테이너가 중지되었을 때 수동으로 중지하지 않은 경우 자동 재시작
+networks:
+  spec-net:
+    driver: bridge

frontend/spec-trackr-app/src/index.js

@@ -2,7 +2,6 @@ import React from 'react';
 import ReactDOM from 'react-dom/client';
 import './index.css';
 import App from './App';
-import ComSp from "./com_sp";
 import "./index.css";
 import reportWebVitals from './reportWebVitals';
 import 'bootstrap/dist/css/bootstrap.min.css';

frontend/spec-trackr-app/sta.dockerfile

@@ -0,0 +1,8 @@
+FROM node:18-alpine
+WORKDIR /app
+COPY package*.json ./
+RUN npm install
+COPY . .
+ENV HOST=0.0.0.0 BROWSER=none PORT=3001
+EXPOSE 3001
+CMD ["npm", "start"]

frontend/spectrackr-main/app/page.tsx

@@ -294,7 +294,7 @@ function HomePage() {
               transition={{ duration: 0.5, delay: 0.2 }}
             >
               <Button
-                onClick={() => { window.location.href = "http://localhost:3000" }}
+                onClick={() => { window.location.href = "http://localhost:3001" }}
                 className="bg-gradient-to-r from-cyan-500 to-blue-500 hover:from-cyan-600 hover:to-blue-600 text-white shadow-lg"
               >
                 시작하기 <ChevronRight className="ml-2 h-4 w-4" />
@@ -359,7 +359,7 @@ function HomePage() {
                 </h3>
 
                 <Button
-                  onClick={() => { window.location.href = "http://localhost:3000" }}
+                  onClick={() => { window.location.href = "http://localhost:3001" }}
                   size="lg"
                   className="mt-8 bg-gradient-to-r from-cyan-500 to-blue-500 hover:from-cyan-600 hover:to-blue-600 text-lg text-white shadow-lg"
                 >

frontend/spectrackr-main/main.dockerfile

@@ -0,0 +1,8 @@
+FROM node:18-alpine
+WORKDIR /app
+COPY package*.json ./
+RUN npm install
+COPY . .
+ENV HOST=0.0.0.0 PORT=3003
+EXPOSE 3003
+CMD ["npm", "run", "dev"]