diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000..a07d956 Binary files /dev/null and b/.DS_Store differ diff --git a/README.md b/README.md index 1160530..5d4fef7 100644 --- a/README.md +++ b/README.md @@ -1,64 +1,101 @@ # TypeScript + Colyseus 입문 스터디 (2025) -📌 운영 방식 - • 진행 기간: 2025년 4월 12일 ~ 6월 26일 (총 6주차) - • 진행 방식: 비대면 / 매주 자료 제공 + 실습 또는 회고 / PR로 제출 - • 제출 기한: 각 주차 금요일에 자료 제공 → 다음 목요일 밤까지 제출 - • 과제 제출: 동아리 GitHub 레포에 각자 폴더 생성 후 .md 또는 코드 파일 업로드 - • 관리 방식: 포크 또는 브랜치 생성 후 PR 요청, 스터디장이 머지 담당 - -⸻ - -📁 폴더 구조 예시 - -ts-colyseus-study-2025/ -├── week1/ -│ ├── yoonad16/ -│ │ └── reflection.md -│ ├── seyeong/ -│ │ └── 실습.ts -├── week2/ -│ ├── yoonad16/ -│ │ └── reflection.md -... - - • weekX는 각 주차별 과제 제출 폴더 - • 자신의 GitHub ID나 닉네임으로 폴더 생성 - • .md, .ts, .js 등 자유롭게 작성 가능 - -⸻ - -✅ 과제 제출 방법 - 1. 레포지토리를 포크하거나 브랜치를 생성합니다 - 2. 주차별 폴더(weekX) 안에 본인 폴더를 생성합니다 - 3. 실습/회고 파일을 작성하여 업로드합니다 - 4. 커밋 후 Pull Request를 요청합니다 - 5. PR 제목은 아래처럼 써주세요: - • [week1] yunatype 회고 제출 - 6. 스터디장이 확인 후 머지합니다 - -⸻ - -🧩 참여자 목록 - -이름 GitHub ID -정윤아 yoonad16 -공세영 -기지현 -김혜원 -김유리 -박채윤 - -⸻ - -🧾 기타 안내 - • 코드를 올릴 때는 가능하면 실행 결과 캡처나 간단한 설명도 함께 써주세요! - • PR에 질문이 있으면 코멘트로 남겨주세요. - • 노션을 쓰고 싶은 분은 회고용 템플릿도 따로 공유해드릴게요. 자유롭게 선택하셔도 됩니다! - -⸻ - -감사합니다! - -이번 스터디는 결과물이 중요한 게 아니라 서버와 프레임워크 개념을 내 손으로 한번 만져본다는 데 의의가 있어요. -부담 없이, 재미있게, 궁금한 건 바로 물어보면서 함께 해봐요 :) +## 📌 운영 방식 +- **진행 기간**: 2025년 4월 12일 ~ 6월 26일 (총 6주차) +- **진행 방식**: 비대면 / 매주 자료 제공 + 실습 또는 회고 / PR로 제출 +- **제출 기한**: 각 주차 금요일에 자료 제공 → 다음 목요일 밤까지 제출 +- **과제 제출**: 동아리 GitHub 레포 각자 폴더에 `.md` 또는 코드 파일 업로드 +- **관리 방식**: 포크 또는 브랜치 생성 후 PR 요청, 스터디장이 머지 담당 + +--- + +## 📁 폴더 구조 예시 + +``` +ts-colyseus-study-2025/ +├── week1/ +│ ├── 15정윤아/ +│ │ ├── .gitkeep +│ │ └── reflection.md ← 예시 제공됨! 해당 파일을 만들어 추가하고 푸시하면 됩니다. +│ ├── 15공세영/ +│ │ └── .gitkeep +... +``` + +- `weekX`는 각 주차별 과제 제출 폴더 +- 자신의 이름 폴더 안에 `reflection.md` 또는 실습 코드 작성 +- `.gitkeep` 파일은 폴더 유지를 위한 용도입니다 + +--- + +## ✅ 과제 제출 방법 + +1. 본인의 브랜치(`week1/본인이름`)로 체크아웃 (미리 생성되어 있음!) +2. 해당 주차 폴더 → 본인 폴더 안에 `reflection.md` 파일 작성 +3. GitKraken으로 변경사항 감지 확인 +4. 변경사항 Stage → 커밋 (예: `docs: add week1 회고`) +5. 푸시(Push) → GitHub에 브랜치 업로드 +6. PR(Pull Request) 생성 + - PR 제목: `[week1] 15정윤아 회고 제출` + - PR 메시지: 간단한 요약 또는 빈칸 OK +7. 스터디장이 확인 후 머지합니다 + +> ❗ 브랜치와 폴더는 미리 세팅되어 있으니, 자신의 폴더에만 작성해주세요! + +--- + +## 🧩 참여자 목록 + +| 이름 | GitHub ID | +|------|-----------| +| 정윤아 | yoonad16 | +| 공세영 | 7amm_0302 | +| 김유리 | uri-git23 | +| 김혜원 | nyamic | +| 박채윤 | profobbb | +| 기지현 | itisjeon94 | +| 박서영 | sum-young | + +--- + +## 📄 회고 예시 파일 (`reflection.md`) + +```md +# Week 1: 서버와 프레임워크, Colyseus 구조 이해 + +## 새로 알게 된 개념 3가지 +1. 서버는 요청을 받고 응답을 주는 역할을 한다는 것 +2. 프레임워크는 반복적인 구조를 미리 구성해둔 도구라는 것 +3. Colyseus는 Room, State, Client 구조로 실시간 게임 서버를 구성한다는 것 + +## 헷갈렸던 부분 +- 클라이언트와 서버의 실제 작동 흐름이 머릿속에 그려지지 않음 + +## 한 문장 요약 +Colyseus는 여러 플레이어가 공유하는 상태를 서버 중심으로 효율적으로 동기화해주는 프레임워크이다. + +## 느낀 점 +게임을 만들면서도 서버를 이렇게 직접 다뤄볼 기회가 많지 않았는데, 이번에 흐름을 이해해보는 계기가 됐다! +``` + +--- + +## 🛠️ GitKraken으로 과제 제출하는 방법 + +1. GitKraken 실행 → 좌측 상단에서 레포 열기 +2. 좌측 브랜치 목록에서 본인 브랜치(`week1/이름`) 선택 (더블클릭으로 체크아웃) +3. Finder에서 `week1/이름/` 폴더 열고 `reflection.md` 파일 작성/수정 +4. GitKraken 돌아와서: + - 변경사항 자동 감지됨 + - Stage All → 커밋 메시지 작성 (예: `docs: add 회고 week1`) + - Commit → Push 버튼 클릭 +5. 우측 상단 “Create Pull Request” 클릭 → GitHub에서 PR 생성 + +> 📌 머지 전까지는 본인 브랜치 안에서 계속 수정 가능해요! + +--- + +감사합니다! +> 이번 스터디는 결과물이 중요한 게 아니라 **서버와 프레임워크 개념을 내 손으로 한번 만져본다**는 데 의의가 있어요. +> 부담 없이, 재미있게, 궁금한 건 바로 물어보면서 함께 해봐요 :) + diff --git a/reflection.md b/reflection.md new file mode 100644 index 0000000..fb8c96e --- /dev/null +++ b/reflection.md @@ -0,0 +1,19 @@ +# week1 : Server, Framework, Colyseus + +## 기본 개념 +1. 서버 = 클라이언트의 요청에 대한 서비스 제공 +2. 클라이언트 = 서비스 요청 +3. 프레임워크 = 개발 템플릿 소프트웨어 + -Colyseus = 실시간 멀티 플레이어 게임 서버를 쉽게 만들 수 있게 해주는 프레임워크 + + +## 알게 된 점 +1. 서버와 클라이언트의 관계와 서버 소프트웨어의 역할에 대해 알게 됨. +2. 서버의 물리적인 모습은 컴퓨터이나 특정 컴퓨터에게 네트워크를 통해 요청을 받고 응답을 하게 만든 것임을 알게 됨. +3. 개발자가 라이브러리를 불러오는 반면 프레임워크는 프레임워크의 규칙을 개발자가 따라야 함 + + +## 느낀 점 +1. 서버, 프레임워크, 라이브러리 등 평소에 많이 쓰거나 들은 단어이지만 그 이름과 작동을 명확히 알 수 있어서 도움이 되었다. +2. 프레임워크의 규칙을 따라 템플릿과 컨트롤러 등을 넣는다는 부분이 구체화되지 않아 이해가 어려웠다. + diff --git a/week1/.DS_Store b/week1/.DS_Store new file mode 100644 index 0000000..908ec93 Binary files /dev/null and b/week1/.DS_Store differ diff --git "a/week1/15 \352\263\265\354\204\270\354\230\201/.gitkeep" "b/week1/15 \352\263\265\354\204\270\354\230\201/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week1/15 \352\263\265\354\204\270\354\230\201/reflection.md" "b/week1/15 \352\263\265\354\204\270\354\230\201/reflection.md" new file mode 100644 index 0000000..bc09583 --- /dev/null +++ "b/week1/15 \352\263\265\354\204\270\354\230\201/reflection.md" @@ -0,0 +1,46 @@ +# WEEK 01 : 서버, 클라이언트, 프레임워크의 이해 / Colyseus 맛보기 + + +## 배운 것 요약 + +1. 서버(Server) +서빙 - 제공자, 요청에 응답하는 쪽 +용도 다양(게임, 웹, DB, 프록시, 메일, 앱...etc) + +2. 클라이언트(Client) +갑, 요청하는 쪽. a.k.a 프론트엔드 + +>> Web Browser(Firefox, Chrome, etc) ⇄ Web Server(Apache, Nginx, etc) ⇄ PHP Engine +Client - Web Browser : 요청을 HTML로 보내고 받은 HTML를 렌더링 +Server - Web Server : HTML 받으면 그대로 제공 / PHP 파일이면 엔진에게 하청 넣음. +PHP Engine : PHP 파일 읽고 OS 무관 요청 처리 후 HTTP(정적)로 서버에게 올림. + +3. 프레임워크 vs 라이브러리 +Framework - 이미 만들어진 뼈대에 내가 맞춤, 프레임워크가 내 코드를 읽음(호출?) +Library - 필요할 때 꺼내 쓰는 레토르트 공구, 코드에 넣고 호출하면 됨. +>> 건축 설계도 vs 도구 상자라고 보면 된다. + +4. Colyseus +- 프레임워크, Room이라는 개념을 사용. +룸으로 인스턴스를 생성한다는 것으로 미루어 보아 객체지향 설계 구조체인 듯. +>> 자바 Object/Class와 비슷한? 추상 클래스? +- State Synchronisation : 서버-클라이언트 동기화로 무결성/일관성 유지 +- 확장이 용이하고 클라우드 서비스 제공. + + +## Questions +1. React 같은 JS 프레임워크를 이용하면 Web Browser, 즉 클라이언트/프론트엔드 쪽에서 동적으로 HTML을 이용할 수 있다. +그럼 이제 PHP나 PHP engine은 필요성을 잃은 건가 궁금함. + +2. Colyseus = 실시간 / 멀티플레이어 게임 / 서버 / 프레임워크 +그래서 언어 뭐 쓴다는 건지 모르겠음. +>> 찾아보니 Node.js 환경에서 동작하므로 TypeScript(추천), JavaScript(가능, 근데 경우에 따라 불리할 수 있음.) +>> 클라이언트는 그냥 엔진 따라 언어 달라짐. 당연함. Colyseus는 서 버 엔 진 이 니 까. + + +## 주저리 +정통공 일부의 빅픽쳐를 다시 본 기분. +서버는 항상 클라우드 서비스 이용하거나 호스팅 받았는데 직접 건드려 볼 기회가 생겨서 기대가 됩니다. +웹사이트 만들겠다고 500원 내고 호스팅 받던 게 어제 같은데...... 실제로도 어제네요. +Colyseus가 무료 호스팅을 제공하면 수익은 어떻게 내는 건지 좀 신기. +>> 찾아보니 프레임워크만 오픈소스로 제공하고 클라우드 쓰려면 플랜 결제해야 하는 것이었음. 당연함. diff --git "a/week1/15 \352\270\260\354\247\200\355\230\204/.gitkeep" "b/week1/15 \352\270\260\354\247\200\355\230\204/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week1/15 \352\270\260\354\247\200\355\230\204/reflection.md" "b/week1/15 \352\270\260\354\247\200\355\230\204/reflection.md" new file mode 100644 index 0000000..efbc4d3 --- /dev/null +++ "b/week1/15 \352\270\260\354\247\200\355\230\204/reflection.md" @@ -0,0 +1,34 @@ +# 1. 새로 알게 된 개념 3가지 + +1. 서버-클라이언트 관계 + 1. 서버 : 제공자, 클라이언트 : 요청자 의 관계 + 2. 클라이언트 sw : 클라이언트 머신 위에서 동작하는 sw + 3. 서버 sw : 서버머신에서 구동하는 프로그램들 +2. 서버란? + 1. 네트워크를 통해 서비스를 제공하는 것 + 2. 웹 서버, 메일 서버, 게임 서버, 프록시 서버 등이 존재 (서비스명 + 서버) + 3. 운용형태에 따라 : 온프레미스 / 클라우드 (AWS, GCP, Azure) +3. PHP (server side script) + 1. php를 이해하기 위해, html을 알아야 한다. + 2. web client → web server로 (ex)topic.php를 전달하면, web client 측에서 이를 해석할 수 없기에 php engine이 대신 동작한다… 이런 개념. + 3. CGI(common gateway interface) : web server 와 php engine 사이의 통신규약(약속) +4. 프론트엔드 백엔드 + 1. 고객 - client = front end - server=back end +5. 라이브러리와 프레임워크 + 1. 라이브러리 : 내가 필요할 때 쓰는 것. + 2. 프레임워크 : 가 나를 부름. (나에게 규칙을 정할 권한이 없다.) (ex.django) + 3. 리액트는 라이브러리도, 프레임워크도 될 수 있다. + 1. 라이브러리일 때 : 나의 애플리케이션의 UI를 빌드할 때, 리액트를 부른다면 이때는 라이브러리 + 2. 프레임워크일 때 : 리액트가 우리의 컴포넌트를 부를 때 + +# 2. 헷갈렸던 부분 + +api 문서를 읽는 방법 : 요청 + 응답 이라는 부분이 확실하게 와닿지 않음. + +# 3. 한 문장 요약 + +서버-클라이언트의 관계성, 비전공자도 알아야 하는 api 문서, 프론트엔드와 백엔드, 라이브러리와 프레임워크. + +# 4. 느낀 점 + +서버와 클라이언트의 개념에 대해 공부해볼 수 있었다. 추상적으로 알고 있던 개념을 구체적으로 배워볼 수 있어 유익했고, 프론트엔드와 백엔드라는 단어의 뜻을 새롭게 알 수 있었다. diff --git "a/week1/15 \352\271\200\354\234\240\353\246\254/.gitkeep" "b/week1/15 \352\271\200\354\234\240\353\246\254/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week1/15 \352\271\200\355\230\234\354\233\220/.gitkeep" "b/week1/15 \352\271\200\355\230\234\354\233\220/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week1/15 \353\260\225\354\204\234\354\230\201/.gitkeep" "b/week1/15 \353\260\225\354\204\234\354\230\201/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week1/15 \353\260\225\354\204\234\354\230\201/reflection.md" "b/week1/15 \353\260\225\354\204\234\354\230\201/reflection.md" new file mode 100644 index 0000000..38782d4 --- /dev/null +++ "b/week1/15 \353\260\225\354\204\234\354\230\201/reflection.md" @@ -0,0 +1,42 @@ +# Week1: 서버, 프레임워크, 및 Colyseus 입문 + +## 1. 새로 알게된 점 + +- 서버 소프트웨어: 서버가 구동하는 부분 + 예: Apache, My SQL, PHP 등이 존재 + + - 서버의 종류: 온프레미스(on-premise), 클라우드 + - 온프레미스(on-premise): 스스로 설비를 보유하여 시스템을 운용관리함 + - 클라우드: 다른 사업자가 보유한 설비로 시스템을 운용관리 예: AWS, GCP, Azure + +- PHP: 서버 스크립트 언어. html과는 다르게 ~~.php의 url로 서버에 요청한다면, + 서버에서 바로 처리할 수 없음 (html은 바로 처리 가능), PHP 엔진 호출 후 처리 + + - 서버의 기술 (구분되는 느낌): + - Apache, IIS + - PHP, python, Java + - My SQL, Oracle (아마 데이터베이스?) + +- 서버 개발자: + - 서버의 목적: 24시간 365일 안정적으로 서버를 구동하는 것 + - 리눅스 => 인기있는 서버 올리는 OS + - 리눅스 OS는 다양한 언어를 지원하지 않지만, 자바처럼 파이썬, 자바스크립트, 루비 등 이용가능. + +- API 문서: 프로그램의 특정 기능이 어떻게 작동하는지 정리하는 문서 + +- 프레임워크 vs 라이브러리 + 라이브러리는 개발자가 필요에 의해 호출하여서 사용하는 것을 말하고, 반대로 프레임워크는 호출을 당해서 프레임워크의 규칙에 따라야함. 하지만, 이 구분이 항상 명확한 것은 아님. + +- Colyseus: Colyseus는 JavaScript/TypeScript/Node.js를 사용해 직접 멀티플레이어 게임서버를 쓸 수 있는 프레임워크. + => 선호하는 프론트엔드/게임엔진과 쉽게 합칠 수 있음 +## 2. 헷갈렸던 부분 + + Apache랑 PHP의 차이점이나 다른게 무엇인지, 그리고 프레임워크의 개념에 대해서 헷갈리고 이해가 어려운 부분이 있었습니다. 넓은 관점으로 서버의 동작을 파악하는 것이 쉽지 않았습니다. + +## 3. 한 문장 요약 + + 서버라는 개념과 서버를 이루는 다양한 요소들에 대해서 학습하고 파악할 수 있었습니다. + +## 4. 느낀점 + + 웹 서버라는 단어는 익숙했는데, 생각해보니 게임에서도 정말 서버가 필요한 것 같아서 흥미로웠고, Colyseus에 대해 더 알아보고 싶어졌습니다. 몇 번 들었던 단어들/개념들이 무엇인지 정확하게 알게되어서 좋았습니다! \ No newline at end of file diff --git "a/week1/15 \353\260\225\354\261\204\354\234\244/.gitkeep" "b/week1/15 \353\260\225\354\261\204\354\234\244/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week1/15 \353\260\225\354\261\204\354\234\244/reflection.md" "b/week1/15 \353\260\225\354\261\204\354\234\244/reflection.md" new file mode 100644 index 0000000..0eeee40 --- /dev/null +++ "b/week1/15 \353\260\225\354\261\204\354\234\244/reflection.md" @@ -0,0 +1,15 @@ +#Week 1: 서버와 프레임워크, Colyseus 구조 이해 + +## 새로 알게 된 개념 3가지 +1. 서버와 클라이언트의 관계와 서버 소프트웨어의 역할에 대해 알게 됨. +2. 서버의 물리적인 모습은 컴퓨터이나 특정 컴퓨터에게 네트워크를 통해 요청을 받고 응답을 하게 만든 것임을 알게 됨. +3. 개발자가 라이브러리를 불러오는 반면 프레임워크는 프레임워크의 규칙을 개발자가 따라야 함 + +## 헷갈렸던 부분 +프레임워크의 규칙을 따라 템플릿과 컨트롤러 등을 넣는다는 부분이 구체화되지 않아 이해가 어려움 + +## 한 문장 요약 +Colyseus는 실시간 멀티 플레이어 게임 서버를 쉽게 만들 수 있게 해주는 프레임워크이다. + +## 느낀 점 +서버, 프레임워크, 라이브러리 등 평소에 많이 쓰거나 들은 단어이지만 그 이름과 작동을 명확히 알 수 있어서 도움이 되었다. diff --git "a/week1/15 \354\240\225\354\234\244\354\225\204/.gitkeep" "b/week1/15 \354\240\225\354\234\244\354\225\204/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week1/15 \354\240\225\354\234\244\354\225\204/reflection.md" "b/week1/15 \354\240\225\354\234\244\354\225\204/reflection.md" new file mode 100644 index 0000000..b49d4a6 --- /dev/null +++ "b/week1/15 \354\240\225\354\234\244\354\225\204/reflection.md" @@ -0,0 +1,220 @@ +# Week1 - 서버의 개념 정리 + +## 🌐 서버(Server) + +- **제공하는 쪽**. 네트워크를 통해 서비스를 제공하는 시스템. +- 서비스의 종류에 따라 이름이 다름: 웹 서버, 메일 서버, 게임 서버, DB 서버, 파일 서버, 사운드 서버, 프록시 서버 등. +- 서버가 클라이언트의 역할(포지션)이 되기도 함. +- 일반 컴퓨터처럼 생겼지만, 대규모 서비스는 수많은 컴퓨터를 연결한 형태로 구성됨. +- **정의**: 네트워크를 통해 특정 컴퓨터에게 요청을 받고, 그에 대한 응답을 처리하도록 구성된 시스템. + +## 🛠 서버의 운용 형태 + +### 온프레미스 (On-Premise) +- 직접 설비를 보유하여 시스템을 운용·관리 +- 구축과 조달에 시간 소요됨 +- 구조를 자유롭게 구성 가능 +- 트러블 발생 시 직접 원인 파악이 쉬움 + +### 클라우드 (Cloud) +- AWS, GCP, Azure 등의 서비스 이용 +- 설비 구축 시간 거의 없음 +- 사업자가 제공하는 설비 범위 내에서만 운영 가능 +- 트러블 슈팅이 어려울 수 있음 + +--- + +## 🙋‍♀️ 클라이언트(Client) + +- **요청하는 쪽**, 서버가 제공하는 서비스를 받는 사용자 혹은 프로그램 +- 웹 브라우저 = 클라이언트 (e.g., Chrome, Safari, Firefox 등) +- 클라이언트 머신(아이폰, 노트북 등)과 클라이언트 소프트웨어로 구성됨 + +> 웹 브라우저에서 사용자가 URL을 요청 → 그 요청을 서버가 처리 + +--- + +## 🖥 서버 구성 요소와 관련 기술 + +| 역할 | 예시 | +|------|------| +| 서버 소프트웨어 | Apache, IIS, Nginx | +| 서버 언어 | PHP, Python, Java | +| 데이터베이스 | MySQL, Oracle 등 | + +--- + +## 📜 정적 웹 vs 동적 웹 + +- HTML은 정적 웹 문서를 만들 수 있음 +- 사용자가 많아지면 정적 웹 페이지로는 한계 발생 → **동적 웹 페이지 필요!** + +--- + +## 🔁 동적 웹의 탄생과 CGI (Common Gateway Interface) + +1. 사용자가 웹 브라우저에서 URL 입력 +2. 웹 서버는 요청받은 파일의 확장자를 확인함 +3. `.html` 파일이면 바로 전송 +4. `.php`와 같은 서버 사이드 파일이면 **웹 서버가 직접 처리 못함** +5. 대신, PHP 엔진 같은 프로그램에게 처리를 위임 +6. PHP 엔진이 파일을 실행하고 그 결과를 HTML로 돌려줌 +7. 웹 서버는 그 HTML을 다시 웹 브라우저에게 전송함 + +- 브라우저는 HTML만 이해할 수 있음 → **php인지 아닌지 알 수 없음** +- 이 과정에서 CGI는 웹 서버와 외부 엔진(PHP, Python 등) 간의 통신 표준 역할을 함 + +--- + +## 💡 CGI의 장점 + +- 다양한 기술들(PHP, Python, Java 등)을 독립적으로 바꿔 끼울 수 있음 +- 프로그램 간 통신의 **표준화**를 통해 유지보수와 확장성이 높아짐 + +--- + +## 🧠 PHP란? + +- 서버 사이드 스크립트 언어 +- 정적인 HTML 파일 대신, **동적인 웹페이지를 자동으로 생성** 가능 +- 하나의 PHP 파일로 여러 사용자에게 각기 다른 내용을 보여줄 수 있음 + +--- + +## 🧩 OS (Operating System) + +- **운영체제(Operating System, OS)**는 하드웨어와 소프트웨어 사이에서 중재자 역할을 하는 시스템 소프트웨어 +- 사용자의 명령을 하드웨어가 이해할 수 있도록 바꿔주고, 소프트웨어가 안정적으로 작동하게 돕는 필수 시스템 +- 대표적인 OS 종류: + - Windows, macOS, Linux (데스크탑/노트북) + - Android, iOS (모바일) + - Ubuntu, CentOS, Red Hat 등 (서버) + +--- + +## 👨‍💻 클라이언트 vs 서버 개발자의 OS 활용 + +### 클라이언트 개발자 +- 웹 개발자와 애플리케이션 개발자로 나뉨 +- 애플리케이션 개발자는 OS별 대응이 필요함 (ex. iOS용 앱, Android용 앱은 따로 만들어야 함) + +### 서버 개발자 +- 서버는 하나의 프로그램이 OS 위에서 실행됨 +- 보통 서버는 **리눅스(Linux)** 위에서 작동함 (안정성 + 비용 효율성 때문) +- macOS는 고가이고 GUI 중심이라 서버 용도로는 비효율적임 + +> 💬 "서버도 결국 하나의 컴퓨터이며, 그 위에 OS가 존재해야만 동작할 수 있다." + +--- + +## 🧬 OS 독립적인 개발 + +- 예전에는 OS마다 별도 개발이 필요했음 → 유지보수 어려움 +- 현대에는 OS에 독립적인 개발 방식이 대세 (한 번 만들면 어디서든 돌아가게!) +- 대표적 예시: **Java** + - JVM(Java Virtual Machine) 위에서 실행되므로 OS에 관계없이 작동함 + - 한번 작성하면 모든 플랫폼에서 실행 가능: "Write once, run anywhere" + +--- + +## 🔁 API와 서버 응답 흐름 + +- 서버는 클라이언트의 다양한 요청을 처리하고, 그에 맞는 응답을 보내는 프로그램 +- 클라이언트는 웹, 앱 등 다양한 형태로 서버에 요청을 보냄 +- 서버는 **기능별 요청을 구분**하고 **적절한 응답을 보냄** +- 이때 "요청과 응답 간의 규약"을 정리해 놓은 문서가 **API 문서** + +### 📄 API 문서란? +> 프로그램의 특정 기능이 어떻게 작동하는지 정리해 놓은 문서 +> - 요청 (Request): 요청할 때 어떤 데이터가 필요한지 +> - 응답 (Response): 응답에는 어떤 데이터가 담겨 있는지 +> - 예: 로그인 API +> - 요청: username, password +> - 응답: access token, user id + +--- + +## 🧑‍💻 프론트엔드 vs 백엔드 + +| 구분 | 설명 | +|------|------| +| 프론트엔드(Frontend) | 클라이언트 프로그램 개발자. 웹이든 앱이든 사용자가 직접 보게 되는 UI 개발 담당 | +| 백엔드(Backend) | 서버 개발자. 사용자 요청을 처리하고, DB 연동, 비즈니스 로직을 처리하는 시스템 구축 담당 | + +--- + +## 🧱 라이브러리 (Library) + +> 내가 필요할 때 **내가 호출해서** 사용하는 도구 + +- 개발자가 주도권을 가짐 (내 코드가 주도) +- 특정 기능이 필요할 때 꺼내 쓰는 도구 느낌 +- 내가 원하는 방식대로 코드를 구성하고, 라이브러리는 기능만 보조해주는 역할 +- 자유롭고 유연하지만 통일된 구조는 없음 + +**📌 예시**: +- `jQuery`: HTML 요소 선택, 애니메이션 처리 등 DOM 제어에 특화된 JS 라이브러리 +- `Lodash`: 배열, 객체 등 JS 데이터 처리 기능 강화 +- `ReactJS`: UI를 컴포넌트화해서 관리할 수 있는 라이브러리 (하지만 구조화된 방식 덕분에 종종 프레임워크처럼 쓰이기도!) + +--- + +## 🏗 프레임워크 (Framework) + +> 나는 **프레임워크가 호출하는 입장**, 즉 규칙을 따라야 하는 구조 + +- 개발자가 주도권을 일부 넘겨줌 (프레임워크가 구조와 흐름을 정함) +- "어디에 코드를 넣을지" 정해져 있고, 그 틀에 맞춰 개발함 +- 강력한 기능 제공 + 일관된 구조 → 빠르고 안정적인 개발 가능 +- 대신, 구조에 대한 이해가 부족하면 진입 장벽이 높음 + +**📌 예시**: +- `Django`: Python 기반 웹 프레임워크. MVC(MTV) 구조가 뚜렷함. +- `Angular`: 구글이 만든 프론트엔드 프레임워크 +- `NestJS`: 백엔드용 TypeScript 프레임워크. Express 기반. + +## 🎮 Colyseus Multiplayer Framework란? + +> Colyseus는 **JavaScript/TypeScript + Node.js** 환경에서 **멀티플레이어 게임 서버를 구축**할 수 있게 해주는 오픈소스 프레임워크! + +- 서버와 클라이언트 간 상태 동기화(State Sync)를 **자동화**해주고 +- 클라이언트가 룸(Room)에 쉽게 매칭되도록 도와주는 기능 제공 +- 프론트엔드나 Unity, Godot 등 **게임 엔진과 쉽게 연동 가능** + +### 🌟 주요 특징 요약 + +- 👥 **Match-making into Rooms** + → 하나의 Room 정의만으로 여러 클라이언트가 자동으로 해당 Room 인스턴스에 매칭됨 + +- 🔁 **State Synchronization** + → 서버에서 클라이언트로 상태 정보를 자동 동기화! (게임에서 유닛 위치, 체력 같은 정보가 실시간으로 동기화됨) + +- 📈 **Scalable (확장성)** + → 수평/수직적 확장이 가능하게 설계되어 큰 규모의 게임 서비스도 대응 가능 + +- ☁ **Cloud agnostic** + → 자유롭게 자체 서버에 호스팅 가능하고, 상용 서비스인 [Colyseus Cloud]도 사용 가능 + +--- + +## 🧾 Node.js란? + +> **자바스크립트를 브라우저 밖, 즉 서버에서도 실행할 수 있게 해주는 런타임 환경** + +### ✨ Node.js의 핵심 기능 + +- 원래 JS는 웹 브라우저 안에서만 동작했는데, Node.js 덕분에 서버에서도 사용할 수 있게 됨 +- **V8 엔진** 기반 (크롬 브라우저에서 쓰는 JS 엔진) +- 비동기 I/O, 이벤트 기반 구조 → 서버에서 많은 클라이언트를 동시에 처리하는 데 최적화됨 +- 파일 읽기/쓰기, 네트워크 요청 처리, 데이터베이스 접근 등 서버 작업 가능 + +### 💡 Node.js의 장점 + +- 프론트엔드와 백엔드 모두 **같은 언어(JS/TS)**로 개발 가능 → 개발 효율성 증가! +- 속도가 빠르고 확장성이 뛰어나서 **실시간 채팅, 게임 서버, REST API** 개발에 많이 사용됨 + +--- + + +📁 작성자: 정윤아 +📅 Week1 - 서버 기본 개념 정리 diff --git "a/week2/15 \352\263\265\354\204\270\354\230\201/.gitkeep" "b/week2/15 \352\263\265\354\204\270\354\230\201/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week2/15 \352\270\260\354\247\200\355\230\204/.gitkeep" "b/week2/15 \352\270\260\354\247\200\355\230\204/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week2/15 \352\271\200\354\234\240\353\246\254/.gitkeep" "b/week2/15 \352\271\200\354\234\240\353\246\254/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week2/15 \352\271\200\355\230\234\354\233\220/.gitkeep" "b/week2/15 \352\271\200\355\230\234\354\233\220/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week2/15 \353\260\225\354\204\234\354\230\201/.gitkeep" "b/week2/15 \353\260\225\354\204\234\354\230\201/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week2/15 \353\260\225\354\204\234\354\230\201/reflection.md" "b/week2/15 \353\260\225\354\204\234\354\230\201/reflection.md" new file mode 100644 index 0000000..e2b232a --- /dev/null +++ "b/week2/15 \353\260\225\354\204\234\354\230\201/reflection.md" @@ -0,0 +1,29 @@ +# Week2. TypeScript 기초 (변수타입, 조건문, 함수) + +## 1. 새로 알게된 점 +- 기본 타입: string, number(정수, 실수), boolean (참, 거짓), null, undefined, bigint, symbol (number로 정수/실수 구분 없이 사용하는게 새로운 느낌..?) +- 튜플(tuple): 고정된 길이 + **각 요소의 타입이 다른 배열** + let t : [number, string, string]; //이렇게 하나의 배열안에서 타입이 다른 자료형 +- any: 아무 타입이든 허용 (지양할 것) +- union: 복수타입허용 + let u : string | number; //복수 타입을 가질 수 있는게 신기한 느낌..? +- 객체-객체 선언 방식이 달라서 헷갈릴 것 같은 느낌..? (은근히 비슷한 것도 있지만) + let 학생 {이름: string, 나이: number} = { + 이름: "이화", + 나이: 20, + }; +- 조건문 = C언어/자바와 상당히 비슷한 느낌! + +- 함수 = 큰 틀은 비슷하지만, **타입 선언** (매개변수, 반환타입) 등이 다른 느낌 + function f1 (type1 : number, type2: string) : string{ + return type2 + ":" + type1; + } +-출력문: console.log("출력할 내용");의 형식으로 + +## 2. 실습 중 헷갈렸던 부분 +- 타입 선언하는 방식이 평소에는 (타입) (변수명) 순서였는데, 순서도 달라지면 :(콜론)을 사용하는게 익숙하지 않아 헷갈렸던 것 같습니다! +- 튜플이라는 타입을 처음 제대로 접해 선언이나 사용에 신경 쓴 점? +- 함수의 반환 타입 명시가 매개변수 뒤에 :(콜론)을 사용해서 진행하는걸 계속 까먹게 되었다... + +## 3. Playground 사용 소감 +기존 IDE에서 사용하는 다른 방법이 궁금해서, vscode에서 typescript 작성후에 실행시켜보기도 했는데, 이 경우 추가적으로 다른 것들을 설치하지 않으면, node.js 설치 후 터미널 명령어를 통해 ts를 컴파일, js로 실행시켜야하는 번거로움이 존재했습니다.. 결론적으로 그냥 코드만 타이핑해서 실행시켜볼 수 있는 Playground의 편리성을 느끼게되었습니다! \ No newline at end of file diff --git "a/week2/15 \353\260\225\354\204\234\354\230\201/\353\260\260\354\227\264\352\263\274\355\212\234\355\224\214.ts" "b/week2/15 \353\260\225\354\204\234\354\230\201/\353\260\260\354\227\264\352\263\274\355\212\234\355\224\214.ts" new file mode 100644 index 0000000..f24bd01 --- /dev/null +++ "b/week2/15 \353\260\225\354\204\234\354\230\201/\353\260\260\354\227\264\352\263\274\355\212\234\355\224\214.ts" @@ -0,0 +1,12 @@ +//2. 배열과튜플: 좋아하는 음식 3개 string 배열로 선언 +// (학교이름, 학년)을 담은 튜플 선언 + +//배열 number[] 또는 Array +let 좋아하는음식 : Array = ["샌드위치", "떡볶이", "파스타"]; + +//튜플: 고정된 길이+각 요소의 타입이 달라도 됨 +// : [string, number, boolean] 이래도 되는 것 +let 정보 : [string, number] = ["이화여자대학교", 22]; + +console.log(좋아하는음식); +console.log(정보); \ No newline at end of file diff --git "a/week2/15 \353\260\225\354\204\234\354\230\201/\353\263\200\354\210\230\354\204\240\354\226\270.ts" "b/week2/15 \353\260\225\354\204\234\354\230\201/\353\263\200\354\210\230\354\204\240\354\226\270.ts" new file mode 100644 index 0000000..5f6022b --- /dev/null +++ "b/week2/15 \353\260\225\354\204\234\354\230\201/\353\263\200\354\210\230\354\204\240\354\226\270.ts" @@ -0,0 +1,11 @@ +//1.변수선언: 이름, 나이, 합격여부 변수 타입 명시해서 선언하기 + +//타입: string-문자열, number -정수/실수, boolean-참/거짓 +let 이름 : string = '박서영'; +let 나이 : number = 22; +let 합격여부 : boolean = true; + +//console.log -> print같은 느낌? +console.log(이름); +console.log(나이); +console.log(합격여부); \ No newline at end of file diff --git "a/week2/15 \353\260\225\354\204\234\354\230\201/\354\241\260\352\261\264\353\254\270.ts" "b/week2/15 \353\260\225\354\204\234\354\230\201/\354\241\260\352\261\264\353\254\270.ts" new file mode 100644 index 0000000..eb93903 --- /dev/null +++ "b/week2/15 \353\260\225\354\204\234\354\230\201/\354\241\260\352\261\264\353\254\270.ts" @@ -0,0 +1,11 @@ +//3. 조건문: 점수 선언, 60점 이상이면 합격, 미만이면 불합격 + +let 점수 : number = 30; + +//조건문은 다른 문법들과 유사 +if(점수 >= 60){ + console.log("합격"); +} +else{ + console.log("불합격"); +} \ No newline at end of file diff --git "a/week2/15 \353\260\225\354\204\234\354\230\201/\355\225\250\354\210\230\354\204\240\354\226\270.ts" "b/week2/15 \353\260\225\354\204\234\354\230\201/\355\225\250\354\210\230\354\204\240\354\226\270.ts" new file mode 100644 index 0000000..84c1f7a --- /dev/null +++ "b/week2/15 \353\260\225\354\204\234\354\230\201/\355\225\250\354\210\230\354\204\240\354\226\270.ts" @@ -0,0 +1,11 @@ +//4.함수선언: 두 숫자를 입력받아 합을 반환. + +//함수: 매개변수에 타입 명시, 함수 반환타입 명시 +function addition (x: number, y: number) : number { + return x+y; +} + +let a : number = 10; +let b : number = 20; + +console.log(addition(a,b)); //함수 호출 diff --git "a/week2/15 \353\260\225\354\261\204\354\234\244/.gitkeep" "b/week2/15 \353\260\225\354\261\204\354\234\244/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week2/15 \354\240\225\354\234\244\354\225\204/.gitkeep" "b/week2/15 \354\240\225\354\234\244\354\225\204/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git a/week2/arrayTuple.ts b/week2/arrayTuple.ts new file mode 100644 index 0000000..53f3d89 --- /dev/null +++ b/week2/arrayTuple.ts @@ -0,0 +1,11 @@ +// 2-배열과튜플.ts +// 좋아하는 음식 이름 3개를 string 배열로 선언 +// `(학교이름, 학년)`을 담은 튜플 선언 + +let favFood : Array = ["떡볶이" , "닭갈비" , "토마토스프"]; +let schoolID : [string, number] = ["Ewha Womens' Univ.", 2]; +// Tuple = 고정된 길이 + 형태 다른 요소 + +console.log(favFood, schoolID); +// 출력 시 배열 형태 그대로 출력 + diff --git a/week2/condition.ts b/week2/condition.ts new file mode 100644 index 0000000..9ba5c6f --- /dev/null +++ b/week2/condition.ts @@ -0,0 +1,14 @@ +// `3-조건문.ts` +// 점수(number)를 하나 선언하고 +// 60점 이상이면 "합격", 미만이면 "불합격"을 출력하는 if/else문 작성 + +let score : number = 75; +// 값 선언 + +if (score >= 60) { + console.log("Pass"); +} +else { + console.log("Fail"); +} +//if else 를 통해 조건에 따른 결과 출력 \ No newline at end of file diff --git a/week2/function.ts b/week2/function.ts new file mode 100644 index 0000000..8851456 --- /dev/null +++ b/week2/function.ts @@ -0,0 +1,10 @@ +// `4-함수선언.ts` +// 두 숫자를 입력받아 합을 반환하는 함수 선언 (매개변수 타입, 반환 타입 명시) +// 함수를 호출해서 결과 출력 + +function addition(x: number, y: number) : number { + return x + y; +} +// function 함수 이름(변수: 타입, 변수: 타입) : return 타입 { 함수 content } + +console.log(addition(3,25)); \ No newline at end of file diff --git a/week2/reflection.md b/week2/reflection.md new file mode 100644 index 0000000..bc7c485 --- /dev/null +++ b/week2/reflection.md @@ -0,0 +1,30 @@ +# week2 : Variable, Type, Condition and Function + +## 기본 개념 +1. 자료형 +-기본 타입 = string(문자열), number(정수, 실수), boolean(TF), null(값X), undefined, bigint, symbol(고유 식별자) +-배열, 튜플(길이 고정+형태 다른 요소) +-객체, any(아무거나 가능), unknown, union(복수 타입 가능), literal type(정해진 값만), enum(상수 그룹) +2. 조건문 +-조건식 결과는 무조건 T OR F +-타입 비교 틀리면 컴파일 에러 +3. 함수 선언 +-매개변수 타입 지정 필요 +-정해진 타입, 정해진 개수를 전달하지 않으면 에러 + +## 알게 된 점 +1. any(아무 타입이나 가능), unknown 같은 타입이 있음 +2. 조건식의 결과가 무조건 true OR false +3. 매개변수 타입은 지정 필수; BUT 반환 타입은 선택 + +## 헷갈렸던 점 +1. C나 Java와는 변수 선언 방식이 다르다 +2. 매개변수 타입도 반드시 지정해줘야 한다(무려 컴파일 단계에서 에러!) +3. +사소한 거지만 let으로 변수 선언한다(근데 직관적이어서 좋음) + +## 느낀 점 (Playground or StackBlitz 포함) +1. Playground는 온라인 에디팅이 간단해서 편리했다(설치 필요X) +2. 컴파일 단계에서 에러 내주는 것도 좋다(코드 확인하기 쉬움) +3. 다른 컴퓨터 언어와는 명령 체계 같은 것이 또 달라서 헷갈린다 +4. 사용자에게 직접 input 받는 것도 짜보고 싶어졌다! +5. 타입 체크를 any로 하면 함수 가독성이 떨어져서 문제인가요??? \ No newline at end of file diff --git a/week2/variable.ts b/week2/variable.ts new file mode 100644 index 0000000..057fe16 --- /dev/null +++ b/week2/variable.ts @@ -0,0 +1,11 @@ +// 1-변수선언.ts +// 이름(string), 나이(number), 합격여부(boolean) 변수를 타입을 명시하여 선언 +//`console.log`로 출력해보기 + +let firstname : string = "youri"; +let age : number = 23; +let pf : boolean = true; +// (변수 이름) : (타입) = (값); 꼴 + +console.log(firstname, age, pf); +// console.log()를 통해 출력 \ No newline at end of file diff --git "a/week3/15 \352\263\265\354\204\270\354\230\201/.gitkeep" "b/week3/15 \352\263\265\354\204\270\354\230\201/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week3/15 \352\270\260\354\247\200\355\230\204/.gitkeep" "b/week3/15 \352\270\260\354\247\200\355\230\204/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week3/15 \352\271\200\354\234\240\353\246\254/.gitkeep" "b/week3/15 \352\271\200\354\234\240\353\246\254/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week3/15 \352\271\200\355\230\234\354\233\220/.gitkeep" "b/week3/15 \352\271\200\355\230\234\354\233\220/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week3/15 \353\260\225\354\204\234\354\230\201/.gitkeep" "b/week3/15 \353\260\225\354\204\234\354\230\201/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week3/15 \353\260\225\354\261\204\354\234\244/.gitkeep" "b/week3/15 \353\260\225\354\261\204\354\234\244/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week3/15 \354\240\225\354\234\244\354\225\204/.gitkeep" "b/week3/15 \354\240\225\354\234\244\354\225\204/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week4/15 \352\263\265\354\204\270\354\230\201/.gitkeep" "b/week4/15 \352\263\265\354\204\270\354\230\201/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week4/15 \352\270\260\354\247\200\355\230\204/.gitkeep" "b/week4/15 \352\270\260\354\247\200\355\230\204/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week4/15 \352\271\200\354\234\240\353\246\254/.gitkeep" "b/week4/15 \352\271\200\354\234\240\353\246\254/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week4/15 \352\271\200\355\230\234\354\233\220/.gitkeep" "b/week4/15 \352\271\200\355\230\234\354\233\220/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week4/15 \353\260\225\354\204\234\354\230\201/.gitkeep" "b/week4/15 \353\260\225\354\204\234\354\230\201/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week4/15 \353\260\225\354\261\204\354\234\244/.gitkeep" "b/week4/15 \353\260\225\354\261\204\354\234\244/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week4/15 \354\240\225\354\234\244\354\225\204/.gitkeep" "b/week4/15 \354\240\225\354\234\244\354\225\204/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week5/15 \352\263\265\354\204\270\354\230\201/.gitkeep" "b/week5/15 \352\263\265\354\204\270\354\230\201/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week5/15 \352\270\260\354\247\200\355\230\204/.gitkeep" "b/week5/15 \352\270\260\354\247\200\355\230\204/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week5/15 \352\271\200\354\234\240\353\246\254/.gitkeep" "b/week5/15 \352\271\200\354\234\240\353\246\254/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week5/15 \352\271\200\355\230\234\354\233\220/.gitkeep" "b/week5/15 \352\271\200\355\230\234\354\233\220/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week5/15 \353\260\225\354\204\234\354\230\201/.gitkeep" "b/week5/15 \353\260\225\354\204\234\354\230\201/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week5/15 \353\260\225\354\261\204\354\234\244/.gitkeep" "b/week5/15 \353\260\225\354\261\204\354\234\244/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week5/15 \354\240\225\354\234\244\354\225\204/.gitkeep" "b/week5/15 \354\240\225\354\234\244\354\225\204/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week6/15 \352\263\265\354\204\270\354\230\201/.gitkeep" "b/week6/15 \352\263\265\354\204\270\354\230\201/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week6/15 \352\270\260\354\247\200\355\230\204/.gitkeep" "b/week6/15 \352\270\260\354\247\200\355\230\204/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week6/15 \352\271\200\354\234\240\353\246\254/.gitkeep" "b/week6/15 \352\271\200\354\234\240\353\246\254/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week6/15 \352\271\200\355\230\234\354\233\220/.gitkeep" "b/week6/15 \352\271\200\355\230\234\354\233\220/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week6/15 \353\260\225\354\204\234\354\230\201/.gitkeep" "b/week6/15 \353\260\225\354\204\234\354\230\201/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week6/15 \353\260\225\354\261\204\354\234\244/.gitkeep" "b/week6/15 \353\260\225\354\261\204\354\234\244/.gitkeep" new file mode 100644 index 0000000..e69de29 diff --git "a/week6/15 \354\240\225\354\234\244\354\225\204/.gitkeep" "b/week6/15 \354\240\225\354\234\244\354\225\204/.gitkeep" new file mode 100644 index 0000000..e69de29