$$config title: [mySQL] VS Code ↔ Github 동기화, Postman 설치 및 사용 keywords: - mySQL - Visual Studio Code - Github - Postman $$ # 1. VS Code를 Github에 업로드 및 연동하기 - VS code에서 새파일 작성 → 파일명 : .gitignore .gitignore 파일 내용 ``` node_modules package-lock.json *.log *.gz ``` - `이 파일은 업로드하지 않겠다`는 의미. ---

## 1-1. Git bash(터미널)에 아래 명령어를 순차적으로 입력 ``` git git init npm i //npm install의 단축 명령어. →적용한 gitignore을 .github 파일에 저장한다는 의미 git add . git config --global user.name "ahcoo" //"" 사이에는 본인 github ID(프로필에서 프로필사진 하단에서 확인 가능) git config --global user.email "mynameisjins@gmail.com" //"" 사이에는 github 로그인 e-mail git config --global core.autocrlf true git commit -m "express db 세팅" // ""안에는 수정한 사항 git remote add origin https://github.com/ahcoo/express_exam //로컬의 Git 저장소와 원격 저장소(Github)로의 연결 추가. //"ahcoo"자리에 본인 github ID //origin = 원격저장소의 이름(github링크) git remote -v git push -u origin master //push 로컬에 있는 내용 중에 아직 원격(Github)에 없는 것들을 업로드하겠다는 의미 //-u : 브랜치를 기본 branch로 설정시켜줌 git config --list ``` ---

## 1-2. VS Code 작업내용 Git hub에 업로드하기 - Git bash git add . git commit -m "`Github에 표시할 수정 내용 작성`" git origin master - 업로드 되지 않는다면? git log 확인 ( 하단 '번외' 기술 ) ## 2. 다른 사람 또는 내 Github 내용 체크하기 - 추가된 사항, 변경된 사항 체크 가능 [강사님 Github](https://github.com/xanqus/express_todolist) [내 Github](https://github.com/ahcoo/express_exam) ---

## 번외. 돌이킬수없도록 망했을 때 (가급적 사용하면 안됨) `git log` 로 로그 확인 →수정이 필요한 commit 문자열 확인 git checkout -f `commit 문자열` ---

# 3. SQL 데이터를 데이터 별(id=1, id=2)로 로드하기 ```js app.get("/todos/:id", async (req, res) => { // /todos/:id → id를 변수로 사용할 수 있음 const { id } = req.params; const [rows] = await pool.query(`SELECT * FROM todo WHERE id = ?`, [id]); //?가 2개라면 [id, id] if (rows.length === 0) { res.status(404).json({ msg: "not found" }); return; } res.json(rows[0]); }); ``` - [★HTTP 상태 코드★](https://developer.mozilla.org/ko/docs/Web/HTTP/Status) `200계열` : 성공 `300계열` : 다른 곳으로 가세요 `400계열` : 니가 잘못함, 데이터가 없음(존재하지 않음)이란 뜻. `500계열` : 내가 잘못함 ---

# 4. [[Postman] 다운로드](https://www.postman.com/downloads/) - Postman이란? - DB작업을 프론트(크롬, 파이어폭스 등)에서 수정 반영할 수 있도록 하는 SW # 5. Postman : 용도에 따른 collections + 폴더 + request 작성 - 각 메뉴별 성질 - `GET` 가져올때 - `POST` 전송할때 - `PATCH` 수정할때 - `body` -> `raw`선택 > 우측 `JSON` 선택 ![링크](https://i.imgur.com/39AtGwR.jpg) ---

## 5-1. Postman : Collection 만들기 - `New` → `Collection` ![링크](https://i.imgur.com/N5NPNFF.png) ---

## 5-2. Postman : 폴더 만들기 - `Collections` 내에 작성한 컬렉션 → 우측 더보기(`…`) → `Add folder` ![링크](https://i.imgur.com/M95aO4V.png) ---

## 5-3. Postman : request 만들기 - `Collections` 내에 작성한 컬렉션 → 우측 더보기(`…`) → `Add request` --- ![링크](https://i.imgur.com/FfuoaYr.png) ---

# 5-4. request별 설정하기 - 상단 `각 메뉴별 성질` 참고 ## 6-1. request GET ![링크](https://i.imgur.com/sEEpSO4.jpg) --- - `VALUE` = id 값 - `DESCRIPTION` = 다른 사용자가 알기 쉽도록 메모

## 5-5. request PATCH - 상단 `각 메뉴별 성질` 참고 ![링크](https://i.imgur.com/4RMEtWX.jpg) - 상단 입력박스 - 수정하고자 하는 코드 입력 - 하단 출력박스 - `Send`를 누른 결과값이 출력됨 ---

# 6. 기존에 만들었던 DB(SQLyog)를 이용하여 Postman에서 수정 가능하도록 하기 ## 6-1. VS code > app.js 기술 ```js //상단 app.use(express.json()); ``` ```js app.patch("/todos/:id", async (req, res) => { const { id } = req.params; const { perform_date, content } = req.body; const [rows] = await pool.query(`SELECT * FROM todo WHERE id = ?`, [id]); if (rows.length === 0) { res.status(404).json({ msg: "not found", }); } //"" > false, 실행안됨. !"" > true, 실행됨. if (!perform_date) { //!perform_date가 비어있다면 실행 res.status(400).json({ msg: "perform_date required", }); return; } if (!content) { //!content가 비어있다면 실행 res.status(400).json({ msg: "content required", }); return; } const [rs] = await pool.query( `UPDATE todo SET perform_date = ?, content = ? WHERE id = ?`, [perform_date, content, id] ); //console.log("id", id); //console.log("perform_date", perform_date); //console.log("content", content); res.json({ msg: `${id}번 할 일이 수정되었습니다.`, }); }); ``` ---

- `""` = false, 실행안됨. - `!""` = true, 실행됨. --- ```js if (!perform_date) { //!perform_date가 비어있다면 실행 res.status(400).json({ msg: "perform_date required", }); return; } if (!content) { //!content가 비어있다면 실행 res.status(400).json({ msg: "content required", }); return; } const [rs] = await pool.query( `UPDATE todo SET perform_date = ?, content = ? WHERE id = ?`, [perform_date, content, id] ); /* console.log("id", id); console.log("perform_date", perform_date); console.log("content", content); → 중간중간 출력이 제대로 되고 있는지 확인하면서 진행 (다 해놓고 에러가 나면 어디에서 잘못되었는지 찾기 어려우므로) */ res.json({ msg: `${id}번 할 일이 수정되었습니다.`, }); }); ``` # 7. Postman에서 삭제 가능하도록 하기 ## 7-1. VS code > app.js 기술 ```js app.delete("/todos/:id", async (req, res) => { const { id } = req.params; const [[todoRow]] = await pool.query( ` SELECT * FROM todo WHERE id = ?`, [id] ); if (todoRow === undefined) { res.status(404).json({ msg: "not found", }); return; } const [rs] = await pool.query( `DELETE FROM todo WHERE id = ?`, [id] ); res.json({ msg: `${id}번 할 일이 삭제되었습니다.`, }); }); ```

게시글 상세