개발일지

CSS 기초

sorrypark1127 — Tue, 9 Jun 2026 10:00:34 +0900

CSS3 : Cascading Style Sheets Level 3

HTML 구조 위에 시각적 표현을 정의하고, 우선순위 규칙(cascade)과 모듈화된 기능들로 동적,반응형 UI를 구현하는 스타일 언어 규격

-우선순위: !important > 인라인 스타일 > ID > 클래스/속성/의사클래스 > 태그

-소스순서 : 나중에 선언된 규칙이 우선

h1 { color : red; }

선택자 {스타일속성 : 스타일값;}

선택자의 종류:

전체 선택자 - HTML 페이지 내부의 태그를 모두 선택

태그 선택자 - HTML 페이지 내부의 특정 태그를 모두 선택

아이디 선택자 -특정 id 속성이 있는 태그 선택

클래스 선택자 - 특정 클래스가 있는 태그 선택

속성 선택자

후손 선택자

자손 선택자

반응 선택자

상태 선택자

구조 선택자

first-child : 가장 위에 위치한 자식
last-child : 가장 마지막에 위치한 자식
선택자: nth-child(2n) : 짝수번째에 위치한 자식/ 해당 자식이 선택자와 일치할 경우만 적용
nth-last-child(2n+1): 마지막 위치를 기준으로 마지막위치의 자식을 제외한 홀수번째에 위치한 자식
선택자:nth-of-type(2n) :선택자와 일치한 자식중 짝수번째에 위치한 자식

동위 선택자:

선택자A + 선택자B : 선택자 A바로 뒤에 위치하는 선택자 B를 선택
선택자A ~ 선택자B : 선택자 A 뒤에 위치하는 모든 선택자 B를 선택

크기단위: %, em(배수), cm, mm, inch, px

색상단위:

background-color: red;

background-color: rgba(255,255,255,0.5);

background-color: #00FF00

background-color: hsl(360, 100%, 50%); - 색상,채도,명도 / 색상 0~360

url단위:

background-image: url('경로');

속성:

margin : 바깥쪽 여백

padding : 안쪽 여백

border : 테두리

width, height ; 크기

margin 20px : 모든 방향

margin 20px 10px : 위 아래 20px, 좌우 10px;

margin 1px 2px 3px : 위 1px, 좌우 2px, 아래 3px;

margin 1px 2px 3px 4px : 상우하좌 순서대로

박스테두리:

border-width

border-style

border-color

가시속성:\

display: none - 안보임/ block - 블록/ inline - 인라인 / inline-block - 둘다 합친거

배경속성:

-image 이미지삽입

-size ; 크기

-repeat :반복여부

-attachment : 부착형태

-position : 위치/ top left면 상단좌측

글자속성:

font-size 폰트크기

font-family 글꼴, 'A','B'형식이면 A글꼴없으면 B로

글꼴종류:

serif : 끝에 장식이 있는 전통적인 인쇄체

sans-serif : 장식없는 현대적인 글꼴

monospace : 고정폭 글꼴

cursive : 필기체

fantasy : 장식적, 창의적인 글꼴, 판타지

글자 정렬:

text-align

요소 위치:

position, /absolute relative 절대위치/상대위치

top,

bottom, left, right 등..

z-index 깊이

hidden 영역 벗어나면 숨김

scroll 벗어나면 스크롤

overflow-y : scroll 위와 동일

float : left / 왼쪽에 요소 붙힘

그림자:

text-shadow: 1px 2px 3px black / 오른쪽 아래 흐림도 색상

그레이디언트: -moz-linear-gradient(top, 색상 0%, 색상 50%, 색상 ~ 100% . . .)

부정선택자:

not

MySQL +Java 연동

sorrypark1127 — Mon, 8 Jun 2026 23:28:43 +0900

만들어야할 테이블:

컬럼: ID, Title, Publisher, desc

DB 생성

DB세팅 끝

내부 클래스로 생성한 DTO, 원래 외부클래스로 만드는 것을 추천하는데 학습용이라 귀찮아서 패스

이런 객체를 DB에서 가져오는 메서드를 따로 담당하는 클래스는 DAO로 관리하는게 정석이지만 이것도 귀찮으니 패스

Refresh버튼과 연결

DB에 값 넣고 테스트

getBooks() 메서드를 생성자의 마지막에 같이 넣어서, 프로그램을 실행하면 자동으로 가져오도록 설정

테이블 생성전에 이 메서드를 생성하면 오류 발생

이 방식대로 삽입 메서드도 추가

조회는 executeQuery() -> ResultSet 반환

삽입,제거,수정은 executeUpdate() -> int 반환

도서관리프로그램 레이아웃

sorrypark1127 — Mon, 8 Jun 2026 22:08:53 +0900

목표:

AI를 사용해 기본 디자인 불러오기

JMenuBar : File, Edit, View, Help

JPanel : 이건 뭐 넣어야할지 모르겠음/걍 장식용 빈칸

JToolBar : Add New Book, Refresh, Search, Delete

JSplitPane: Categories, JTable

JPanel(좌측 카테고리) : JList

기본구성

메뉴바 구성

상단에 배치 완료

메인컨텐츠는 패널 따로 생성해서 CENTER에 둠

외관만 따지만 JToolBar를 사용하는것보다 버튼만 배치하는게 이쁘겠지만, 학습이 목표이기 때문에 최대한 다양하게 써본다.

카테고리

테이블

다음에는 DB를 추가해볼 예정

GridBag 레이아웃

sorrypark1127 — Mon, 8 Jun 2026 20:17:25 +0900

GridBag레이아웃은 모든 격자의 크기가 동일하게 고정되어있는 Grid 레이아웃보다 더 자유롭다.

레이아웃 미적용

이를 2행 2열로 만들어보자.

우선 JFrame의 레이아웃을 GridBagLayout으로 설정

그리고GridBagConstraints 객체 생성.

이 객체는 재사용할 수 있다.

컴포넌트를 add()할때, 뒤에 필요한 gbc객체를 넣어주면 된다.

여백을 추가해보자.

Inserts파라미터는 첫번째부터 위,왼,아래, 오른쪽을 의미한다.

여기서 라벨 부분에 weightx를1 주고, 텍스트필드에 0을 주는 경우

반대로 라벨에 0, 필드에 1

0.3 0.7

여백 채우기

고정 위치 바꾸기

gbc.anchor = GridBagConstraints.EAST;

기본 센서등 간단정리

sorrypark1127 — Sun, 7 Jun 2026 00:25:50 +0900

버저(buzzer)

-단순한 소리내는 장치

사용법: tone()함수

tone(핀번호, 주파수, 소리길이/밀리초)

모션감지센서(PIR센서)

-적외선 인체감지 센서라고도 함

사용법: pinMode()함수에 핀번호, INPUT으로 초기화한 다음 digitalRead(핀번호)로 정수값 반환

초음파센서(ultrasonic 센서)

-초음파를 Trig로 내보내서 Echo로 받아옴
사용법: pinMode()함수를 사용해서 Trig핀을 OUTPUT, Echo핀을 INPUT으로 초기화

초음파를 10us 정도 발사하려면

digitalWrite(Trig핀, HIGH);

delayMicroseconds(10);

digitalWrite(Trig핀, LOW);

그리고 이 초음파의 거리를 받아오려면

int duration = pulseIn(Echo핀, HIGH);

초음파의 속도는 340 m/s -> 34,000 cm/s 이고, 1초는 1000밀리초 -> 1,000,000마이크로초 이므로
1마이크로초 동안 초음파는 34000/1000000 = 0.034cm/us 다.

여기서 Trig핀으로 발사된 초음파는 물체에 반사되어 Echo핀으로 돌아오는 것이므로

왕복거리까지 고려하여 계산한다면 0.034/2 = 0.017 cm/us고, duration에 0.017을 곱한값이 물체와 초음파센서의 거리(cm)다.

또는,

거리 = 속력x시간

시간 = 거리/속력

여기서 시간 t = 1cm/0.034us = 29.4... 이므로

초음파는 29.4 us마다 1cm 이동한다.

int microsecondsToCentimeters(int microseconds) { return microseconds / 29 / 2; }

조이스틱

손가락 움직임을 두개의 가변저항으로 측정

-얘는 아날로그다.

사용법:

조이스틱버튼은 pinMode()의 INPUT_PULLUP으로 초기화하고,

이 버튼은 digitalRead를 통해 정수값으로 반환됨, HIGH일시 미클릭/ 아닐시 클릭

조이스틱은 각각 analogRead()를 통해 vertical, horizontal를 정수형으로 반환

vertical(x축)과 horizontal(y축)의 범위는 0~1023이다.

가스센서

-공기 중 이산화탄소 측정함

사용법:

#include "MQ135.h" 라이브러리 불러오고,

MQ135 gasSensor = MQ135(아날로그핀)으로 객체생성,

float ppm = gasSensor.getPPM(); 으로 농도측정

RGB LED

-그냥 LED 빨강,초록,파랑 섞어놓은거

사용법:

포텐셔미터(가변저항기)로 읽는예제

서보모터

(모터의 종류는 DC모터,서보모터, 스텝모터가 있음)

-아날로그 출력기능으로 PWM신호 0~180도 자유조작

사용법:

#include <Servo.h> 라이브러리 사용

Servo servo; 객체선언

servo.attach(서보핀) 으로 서보 객체에 서보핀 초기화

servo.write(각도) 로 회전

여기서 포텐셔미터로 각도를 조절하려면

analogRead(포텐셔미터 핀)으로 정수값 0~1023을 받아오고

int angle = map(포텐셔미터값, 0, 1023, 0, 180); 으로 회전값 변환

map()함수는 특정값x를 a~z 에서 가-하 로 맵핑해서 선형적으로 변환함

온습도 센서

-말그대로 온도와 습도를 확인하는 센서

사용법:

#include <DHT.h> 라이브러리

DHT dht(핀,DHT11); //객체생성

dht.begin()으로 초기화

dth.readTemperature() 이나 dth.readHumidity()로 온습도 float값으로 반환

그런데 분명히

#include <Wire.h> 라이브러리랑

#include <DHT11.h> 불러오고

DHT11 dth; 객체 생성한다음에

int값으로 readTemperatureHumidity() 로 한번에 불러오는 방식이 있던것같은데 잊어먹음

적외선 센서

pinMode()로 INPUT(입력모드)로 초기화

digitalRead(핀)으로 정수값 반환하고, LOW면 탐지됨/HIGH면 탐지안된상태

LCD(Liquid Crystal Display 액정 디스플레이)

말그대로 액정을 사용한 디스플레이

사용법:

#include <LiquidCrystal_I2C.h> 라이브러리 사용

LiquidCrystal_I2C lcd(0x27, 16, 2); 객체생성, 0x27은 주소로 모듈마다 0x3F인 것도 있음/ 16열, 2행

lcd.init()

lcd.backlight()로 초기화

lcd.print()나 lcd.write()로 문자열출력

lcd.setCursor(0,1); 으로 개행가능

lcd.clear()로 다 지우기

LED matrix

-상점 간판의 LED 디스플레이와 유사

-8x8 = 64개의 LED

-세로(Column) 0~7, 가로(Row) 0~7

-세로/가로번호로 LED on/off가능

블루투스

#include <SoftwareSerial.h>

SoftwareSerial BTSerial(2,3);으로 TX,RX핀 초기화 -> 0,1번핀은 작동안됨, 우노보드에서 이미 USB시리얼통신에 사용되기때문

BTSerial.begin(9600);으로 초기화

BTSerial.available()이나 read(), write()가능 / Serial과 유사

블루투스 기기이름 바꾸려면 시리얼모니터에 AT -> OK뜨면

AT+NAMExxxx : xxxx로 이름변경

AT+VERSION : 버전확인

AT+PINxxxx : 페어링 비밀번호 xxxx로

------------------------------------------------------------

Serial(UART)

Hardware Serial

-아두이노 시리얼 통신이 대표적임

2개의 통신 라인이 크로스 되어 연결됨 (RX, TX)

비동기식 : Clock 라인 없이 양측이 미리 합의된 클럭 사용

-> 두 장치의 클럭 간격을 미리 맞춰줘야함

클럭 동기화 문제

-> 두 장치가 사용하는 클럭 생성기(crystal)의 주파수가 틀린 경우

-> 문제 방지를 위해 start/stop 비트 추가

Baudrate(통신속도 BPS), Start/Stop bit, Parity bit, Data chunk 9600 8N1 -> 9600 bps, 8bit data, No parity, 1 stop bit

통신간 1:1연결만 지원함

start/stop 비트 때문에 오버헤드 발생

하드웨어 구성이 복잡해짐

Software Serial

하드웨어 UART포트가 부족할때 일반 디지털 핀을 이용해 가상의 시리얼 통신을 만드는 기능

-> 예를들어 블루투스 모듈과 같은 장치를 추가로 연결하려는데 시리얼 통신이 필요함

-> UNO보드는 UART가 1개뿐이기 때문에 SoftwareSerial 라이브러리가 디지털핀을 RX/TX처럼 소프트웨어ㄹ ㅗ동작

SoftwareSerial s(2,3); = 2번 핀 -> 수신(RX), 3번핀 -> 송신(TX)으로 가상의 시리얼포트 생성

CPU가 직접 타이밍을 계산하여 처리, 인터럽트를 사용하고 CPU 부하 증가됨

I2C는 대표적인 동기식 시리얼통신

클럭 핀과 데이터핀이 서로 연결됨 (SCL,SDA)

시리얼통신과는 다르게 1:N통신(Master-Slave 구조, 제한적 N:N)

연결이 간단하고 데이터1라인으로 양방향통신하므로 상대적으로 느림

여기서 Master는 아두이노, 다른기기가 Slave

Slave기기들은 고유 식별 ID(address)를 가짐

SCL(Serial Clock, 클럭 시그널), SDA (Serial Data, 데이터 전송)

-UNO 보드 계열 :A4(SDA), A5(SCL)

-Wire.h 라이브러리로 사용

I2C 통신구조

-메시지 기본구조 : 주소 프레임과 데이터 프레임 사용

-통신 시작 조건 : SCL(HIGH) -> SDA(HIGH to LOW)

-주소 프레임 : 통신 시작시 주소 프레임부터 전송, 수신할 slave 주소 표현, 1bit로 read/write, 마지막 1bit로 NACK/ACK표현

게임용 매크로 프로그램

sorrypark1127 — Wed, 3 Jun 2026 16:30:38 +0900

Grok으로 1분 딸깍해서 만든 게임용 매크로 프로그램

기존에 존재하던 일부 게임들은 키입력 매크로가 채팅창을 제외한 부분에서 씹혀서 이를 해결하기 위해 만들었다.

정상적으로 작동됨, 단일 클릭은 키 유지를 해제/ 계속 움직이게 만들고싶으면 키 유지 선택

다운로드는 아래 사이트에서 하실 수 있습니다.

https://sorrypgames.netlify.app/

SorryP — Downloads

Developer contact Questions, bugs, or feature requests — reach out anytime.

sorrypgames.netlify.app

[Mirror] #3 유니티로 데이터파일 직렬화/역직렬화

sorrypark1127 — Tue, 7 Apr 2026 09:37:22 +0900

이전 글에서 웹서버 -> 유니티로 데이터를 JSON파일로 받아옴

JSON의 기본문법

1. "키" : 값 형태

2. 객체는 { }, 리스트는 [ ]

그 외에 뭔가 더 있었던 것 같지만 일단 생략

위 JSON파일 구조 분석:

1. 리스트타입

2. 정수형 roomId, 문자열 roomName,문자열 hostAddress, 정수형 currentUserCount

이러한 JSON파일을 유니티의 클래스 형태로 반환하려면 역직렬화를 해야함

[Serializable]

public class Room{
    public int roomId;
    public string roomName;
    public string hostAddress;
    public int currentUserCount;
}

클래스 위에 System.Serializable이 붙으면 직렬화/역직렬화 가능

JSON파일의 구조와 똑같이 구성하면 됨

이러면 {"roomId":3,"roomName":"name" . . . .} 형태로 작성될텐데, 우리가 받아온 JSON은 리스트에 담겨있었음

[ {"roomId":3, "roomName":"name" . . . } , {"roomId":4,"roomName":"name" . . .} ]

    [Serializable]
    public class RoomList
    {
        public List<Room> rooms = new List<Room>();

    }

이렇게 받아온 JSON 파일을 역직렬화하기

  RoomList roomList = JsonUtility.FromJson<RoomList>(json);

반대로, 직렬화는 ToJson() (JSON 파일로)

웹서버에서 데이터파일을 JSON형태로 받아왔는데, 그렇다고 유니티에서 웹서버로 데이터를 전송할때 이같은 직렬화 방식 외에도

폼 데이터를 "요청"하는 방식을 사용할 수 있다.

private string baseUrl = "http://localhost:8080/MarioGameServer";

IEnumerator CreateRoom()
{
    WWWForm form = new WWWForm();
    form.AddField("roomName", roomNameInputField.text);
    form.AddField("hostAddr", GetHostIP());
    using (UnityWebRequest www = UnityWebRequest.Post(baseUrl + "/createRoom", form)) {
        yield return www.SendWebRequest();
        if (www.result != UnityWebRequest.Result.Success) {
            Debug.LogError("Error: " + www.error);
        } else {
            Debug.Log("Room created successfully");
            Mirror.NetworkManager.singleton.StartHost();
            MyRoom.roomName = roomNameInputField.text;
            MyRoom.hostAddress = GetHostIP();
            SceneManager.LoadScene("Room");
                
        }
    }
}

마치 HTML의 <form> 태그안에 정보를 넣어서 전송하는 것과 같은 원리

서블릿은 위 데이터를 파라미터 형태로 받는다.

미러 네트워크로 방장인 경우 StartHost(), 클라이언트인 경우 StartClient()로 방에 참여할 수 있다.

 public string hostAddr;
 public void JoinRoomBtnPressed()
 {
     if (string.IsNullOrEmpty(hostAddr)) return;
     Mirror.NetworkManager.singleton.networkAddress = hostAddr;
     Mirror.NetworkManager.singleton.StartClient();
     SceneManager.LoadScene("Room");
 }

포스트맨으로 방을 여러번 추가한 결과

test방 생성한 결과:

[Mirror] #2 유니티 + 웹서버로 DB연동

sorrypark1127 — Sun, 5 Apr 2026 14:20:49 +0900

학습목표 : 유니티에서 웹서버로 요청(request) 보내기

요청 내용: 방 목록, 플레이어 정보 등...

웹서버 역할: DB에서 방 목록, 플레이어 정보등을 DB에서 가져와서 유니티로 응답함

웹서버를 사용하는 이유:

1. 데이터 저장,관리에 용이함.

2. 만들어두면 미러(Mirror)에서 로비, 방리스트, 계정 로그인 및 저장등을 간단하게 구현할 수 있음

3. 나중에 게임홈페이지도 외부에 만들어서 연동할 수 있음

4. JSP공부겸 병행

DBMS(오라클)에서 방 테이블 생성

CREATE TABLE ROOMS (
    ROOM_ID      NUMBER GENERATED AS IDENTITY PRIMARY KEY,
    ROOM_NAME    VARCHAR2(100) NOT NULL,
    HOST_ADDR    VARCHAR2(100) NOT NULL,
    PLAYERS      NUMBER(2) DEFAULT 1,
    LAST_UPDATE  DATE DEFAULT SYSDATE
);

방 테이블 : 방ID(기본키), 방이름, 방장 아이피, 플레이어 수, 방 생존신고 요청(?)

방장 아이피랑, 생존신고를 설명하자면,

원래는 단일 서버 아이피주소로 모든 플레이어가 한 서버로 접속하도록 구현할 수 도 있지만(포톤 네트워크처럼)

이러면 모든 네트워크 로직을 서버가 부담하게 됨

이후에 ngrok으로 무료 서버 도메인을 생성할건데, 클라이언트(플레이어) 수가 많을수록 부담이 갈까봐,

방장을 독립적은 서버로 설정하여 부담을 줄이려고함

(단, 방장이 나가면 방이 터짐)

생존신고 기능이란 유령방을 제거하기 위해 만든 기능으로, 살아있는 방은 주기적으로 LAST_UPDATE를

현재 시각으로 업데이트하여, 이후에 코드에서 업데이트 주기가 몇분 이내로 이루어지지않는 방은 자동으로 삭제하도록

만들 예정

- 자바 DTO로 이동

DTO는 DB의 테이블 구조와 똑같음

간단히 속성과 getter, setter로만 이루어져있음

DTO의 목적:말 그대로 DB의 테이블구조를 자바로

가져와서 사용하겠다는 것

-DAO 구성

DAO는 DBMS에서 사용하던 DML (조회, 수정, 삽입, 삭제)을 자바에서 처리하도록 함

싱글톤

여러 서블릿에서 이 DAO의 기능을 사용할때, 매번 DAO myDAO = new DAO () ... 이런식으로 사용하면

비효율적이니 싱글톤으로 만듦

DAO의 생성자와, DataSource

Context는 src/main/webapp/META-INF의 context.xml파일에서 참조할때 사용

웹 애플리케이션의 설정과 자원을 관리함

context.xml

<Resource /> 자원

name 리소스이름

auth 인증주체 (톰캣 = 컨테이너)

type 자원타입, DAO에서 ctx = javax.sql.DataSource로 사용중

driverClassName DB에서 제공하는 드라이버, 오라클은 odjbc17.jar, 오라클 홈페이지에서 다운받을수있음

반드시 lib에 넣어야 사용가능

username, password 오라클 DBMS에서 사용하던 계정정보

maxTotal 최대 커넥션(연결) 개수( 커질수록 서버 부담도 커짐 )

maxIdle 사용되지 않고 대기할 수 있는 최대 커넥션의 수

ds = (DataSource) ctx.lookup("java:comp/env/jdbc/myoracle");

Context.lookup 메서드의 파라미터는 반드시 리소스의 이름과 같아야함

DataSource를 사용하는 이유:

사실 DataSource를 사용하지 않고도 DB기능을 사용할 수 있는데,

예를들어 DAO에서 searchPlayerInfo(), getRoomList() 등의 메서드가 존재한다면

각 메서드에서 DriverManager로 커넥션을 생성하고 기능을 수행한다음 커넥션을 닫은 과정을 반복해야함

새로운 커넥션을 계속 만들때마다 딜레이가 생길 수 있고, 플레이어가 많다면 그만큼 커넥션이 생성되고 소멸하기를

반복하니까 서버에 부담이 늘어날 수 밖에 없음

DataSource를 사용하지 않는 경우

하지만 DataSource를 사용하면 미리 커넥션을 만들어두고, 필요할때마다 이 커넥션을 불러다가 재사용하니 효율이 훨씬 좋음

DAO 메서드 로직:

커넥션(Connection) 생성

PreparedStatement 생성

쿼리(sql)를 PreparedStatement에 대입

PreparedStatement를 실행(execute)

실행에도 두 종류가 있음

executeQuery() 와 executeUpdate()

Query는 Select (조회) 전용, 조회결과는 ResultSet으로 반환

Update는 실제 DB에 영향을 주는것 (Update, Delete, Insert)

실행 후에 ResultSet, PreparedStatement, Connection을 닫아야함

방생성 메서드 예시

public int insertRoom(Room room) {

Connection conn = null;

PreparedStatement pstmt = null;

String sql = "INSERT INTO ROOMS ( ROOM_NAME, HOST_ADDR, PLAYERS, LAST_UPDATE)"

+ "VALUES ( ?, ?, 1, SYSDATE)";

try {

conn = ds.getConnection();

pstmt = conn.prepareStatement(sql);

pstmt.setString(1, room.getRoomName());

pstmt.setString(2, room.getHostAddress());

return pstmt.executeUpdate();

}catch(Exception e) {

e.printStackTrace();

}finally {

closeAll(conn,pstmt, null); // 따로 만든 메서드임

}

return -1;

}

sql문 안에 ? 라고 적혀있는 부분은 try문 안에있는 PreparedStatement.setString에서 대입함

첫번째 ?는 setStirng(1, "내용")

두번째 ?는 setString(2, "내용")

executeUpdate()로 실행하고 닫기

private void closeAll(Connection conn, PreparedStatement pstmt, ResultSet rs) {

try {

if (rs != null) rs.close();

if(pstmt != null) pstmt.close();

if(conn != null) conn.close();

}catch(Exception e) {

e.printStackTrace();

}

방 목록 가져오기 메서드(SELECT 문)

public List<Room> getRoomList(){

deleteExpiredRooms(); //따로 만든 메서드임

List<Room> list = new ArrayList<>();

Connection conn = null;

PreparedStatement pstmt = null;

ResultSet rs = null;

String sql = "SELECT * FROM ROOMS ORDER BY ROOM_ID DESC";

try {

conn = ds.getConnection();

pstmt = conn.prepareStatement(sql);

rs = pstmt.executeQuery();

while(rs.next()) {

Room room = new Room();

room.setRoomId(rs.getInt("ROOM_ID"));

room.setRoomName(rs.getString("ROOM_NAME"));

room.setHostAddress(rs.getString("HOST_ADDR"));

room.setCurrentUserCount(rs.getInt("PLAYERS"));

list.add(room);

}

}catch(Exception e) {

e.printStackTrace();

}finally { closeAll(conn, pstmt, rs); }

return list;

}

Insert문과 비슷하지만 executeQuery는 ResultSet으로 반환함

당연히 반환되는 ResultSet의 값은 여러개일 수 있으니 while문으로 처리

rs.next() : result의 다음 행이 존재하면 true반환

방 제거도 insert와 비슷한 원리고, 오래된 방 제거하는 메서드는 다음과 같음

private void deleteExpiredRooms() {

Connection conn = null;

PreparedStatement pstmt = null;

String sql = "DELETE FROM ROOMS WHERE LAST_UPDATE < (SYSDATE - INTERVAL '2' MINUTE)";

try {

conn = ds.getConnection();

pstmt = conn.prepareStatement(sql);

pstmt.executeUpdate();

}catch(Exception e) {e.printStackTrace();}

finally {

closeAll(conn,pstmt, null);

}

다음은 LAST_UPDATE값을 새로고침(생존신고)하는 메서드

public void updateHeartbeat(int roomId) {

Connection conn = null;

PreparedStatement pstmt = null;

String sql = "UPDATE ROOMS SET LAST_UPDATE = SYSDATE WHERE ROOM_ID = ?";

try {

conn = ds.getConnection();

pstmt = conn.prepareStatement(sql);

pstmt.setInt(1, roomId);

pstmt.executeUpdate();

}catch(Exception e) {e.printStackTrace();}

finally {closeAll(conn,pstmt, null); }

}

지금까지 DTO와 DAO를 작성했다면 자바에서 남은건 서블릿 뿐.

서블릿이란 웹 애플리케이션에서 클라이언트의 요청을 받아 처리하고 응답으로 반환함

지금까지의 내용을 종합해보면

DTO : 테이블

DAO : DB에서 사용하던 쿼리를 쓰기좋게 메서드로 정리

서블릿 : 클라이언트-웹서버 통신

다음은 방생성 서블릿:

@WebServlet("/createRoom")

public class RoomCreateServlet extends HttpServlet {

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

request.setCharacterEncoding("UTF-8");

response.setContentType("application/json;charset=UTF-8");

String roomName = request.getParameter("roomName");

String hostAddr = request.getParameter("hostAddr");

Room room = new Room();

room.setRoomName(roomName);

room.setHostAddress(hostAddr);

RoomDAO dao = RoomDAO.getInstance();

int result = dao.insertRoom(room);

PrintWriter out = response.getWriter();

if(result > 0) {

out.print(new Gson().toJson("success"));

}else {

out.print(new Gson().toJson("fail"));

}

https://프로젝트이름/createRoom 이라는 사이트 주소로

들어가면 아래 클래스(서블릿) 실행한다는 뜻

서블릿을 사용하려면 HttpServlet을 상속받아야하고

doPost()메서드나 doGet()메서드를 작성할 수 있음

Post는 전송, Get은 가져오기 같은 느낌

여기서 클라이언트가 /createRoom 으로 들어갈때, 서버 입장에서는 이것은 요청(request)고,

방이름이랑 방장의 아이피주소 데이터를 같이 가지고 가는데 이러한 데이터는 파라미터다.

이 결과값을 클라이언트한테 반환할때는 응답(response)

이후 DTO에 위 데이터를 집어넣고 DAO의 방 만들기 메서드 호출

참고로 유니티 - 웹서버 간의 데이터 전송 타입은 JSON으로 할 예정이고

JSON을 사용할거면 손코딩으로 JSON형식으로 변환하던지, GSON이나 JACKSON라이브러리 사용은 개인취향에

맞춰서 사용하면 된다.

스프링부트는 JACKSON 라이브러리를 기본적으로 가지고있는걸로 알고있고, 글쓴이는 이클립스에서

GSON라이브러리를 따로 다운받아 사용중이다.

이런느낌으로 각 서블릿을 만들어서 사용하면 된다.

웹서버를 개발할때 POSTMAN을 사용하면 테스트할때 용이하다.

POSTMAN으로 실행결과에 문제가 없다면 유니티로 넘어갈 차례다.

using System.Collections;

using System.Collections.Generic;

using UnityEngine;

using UnityEngine.Networking;

public class NetworkManager : MonoBehaviour{

private string baseUrl = "http://localhost:8080/MarioGameServer";

void Start(){

StartCoroutine(GetRoomList());

}

IEnumerator GetRoomList(){

using (UnityWebRequest www = UnityWebRequest.Get(baseUrl + "/getRooms")){

yield return www.SendWebRequest();

if(www.result != UnityWebRequest.Result.Success){

Debug.LogError("Error: " + www.error);

}else{

string json = www.downloadHandler.text;

Debug.Log("Room List: " + json);

}

포스트맨에서 했던 것처럼

UnityWebRequest.Get타입으로 요청보내기

yield return SendWebRequest() 응답이 올때까지 대기

www.result 통신 성공여부 체크

downloadHandler.text : response.getWriter().print()로 보낸 JSON값

실행결과

[Mirror] #1 초기세팅

sorrypark1127 — Fri, 3 Apr 2026 10:03:54 +0900

에셋 스토어에서 Mirror Network 다운 및 임포트.

빈 오브젝트 생성 및 Network Manager 컴포넌트 추가

Network info 항목에 Transport 체크

None (Transport) 상태면 KCP Transport 컴포넌트 추가후 연결

네트워크 매니저는 싱글톤이기 때문에 2개 이상 생성시 충돌함

Player Object

서버 접속시 자동으로 플레이어 프리팹 생성 여부

빠른 테스트를 위해서 Network Manager HUB 추가

플레이어 프리팹 생성 후

Network Identity 컴포넌트 추가

네트워크 객체 식별용

실시간 위치 정보 동기화 컴포넌트

Network Transform Reliable (정확성 중심 , TCP)

Network Transform Unreliable (속도 중심, UDP )

Network Transform Hybrid (둘다 섞은거)

Hybrid 선택 후 추가, Network Manager에 플레이어 프리팹으로 추가

플레이어 생성됨

스프링부트 JS 클라이언트-서버 통신

sorrypark1127 — Wed, 25 Oct 2023 13:10:53 +0900

데이터 전달하기 (js)

 fetch('/api/give', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify(dataToSend)
    })
        .then(response => {
            if (response.ok) {
                console.log('데이터를 서버로 전송했습니다.');
            }
        })
        .catch(error => {
            console.error('데이터 전송 중 오류 발생: ' + error);
        });

데이터 받기 (js)

    fetch("/api/hello")
        .then(response => response.text())
        .then(data => {
            console.log(data);
        });

서버 (java)

@RestController
@RequestMapping("/api")
public class testHello {
    int n = 0;
    @GetMapping("/hello")
    public int sayHello(){
        return n;
    }

    @PostMapping("/give")
    public int giveHello(@RequestBody int n1){
        n = n1;
        return n;
    }
}

실행시 404 에러가 뜬다면

Mapping경로가 잘못됨

클래스 위치가 잘못됨

전체코드

package com.sorryp.helloworld.controller;


import org.springframework.web.bind.annotation.*;

@RestController
@RequestMapping("/api")
public class testHello {
    int n = 0;
    @GetMapping("/hello")
    public int sayHello(){
        return n;
    }

    @PostMapping("/give")
    public int giveHello(@RequestBody int n1){
        n = n1;
        return n;
    }
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>My Title</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
<div class="banner_top">

</div>
<div>
    <button id="testBtn">Get Data</button>
    <button id="receiveBtn">Send Data</button>
</div>
<script src="script.js"></script>
</body>
</html>

var btn = document.getElementById("testBtn");
btn.onclick = function() {
    fetch("/api/hello")
        .then(response => response.text())
        .then(data => {
            console.log(data);
        });
};

var re = document.getElementById(("receiveBtn"));

var dataToSend = 5;
re.onclick = function(){
    fetch('/api/give', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify(dataToSend)
    })
        .then(response => {
            if (response.ok) {
                console.log('데이터를 서버로 전송했습니다.');
            }
        })
        .catch(error => {
            console.error('데이터 전송 중 오류 발생: ' + error);
        });
}