[항해99] 33일차 미니프로젝트

---

항해 99

 

33일 차: 

 Node Js 기본 + 심화 주차를 지나고 , 이제는 실전으로 프런트와 만나서 미니 프로젝트를 진행한다.

일전에 다면평가에 적어놓은 같이  프로젝트하고싶은사람에 썼던 팀원이 두 명이나 있어서 깜작 놀랐다.

내 응답이 반영이 되긴 하는구나....  

 

프로젝트 진행 은 간단하게 이 정도로 표현한다면...

프로젝트 아이디어  구상 -> 코딩 -> 밤샘 -> 밤샘 ->밤샘 -> 완료

 

오늘을 프로젝트 아이디어 구상 -> 와이어프레임 ->  API 설계  를했다.

 

아이디어는 저번부터 슬랙에서 사람들이 미니 항해 톡같은것을 모집하길래 생각하고있었던  미니 항해톡 모집 게시판 만들기를 하기로 했다. 

 

 

와이어프레임 : 

 

이거 만든 웹사이트는 내가 사랑하는

https://miro.com/app/dashboard/

Sign up | Miro | Online Whiteboard for Visual Collaboration

이거 저번에 어떤 교수님이었나? trello , miro, jira 모두 다 호주 대기업 atlassian 꺼라고 했는데 지금 찾아보니깐  miro는 호주꺼가아닌데?

머어쩃든... 협업할 때 쓰기 좋은 툴이다. 

 

 

 

API 설계 

질문 : 

API라우팅이랑 뭐가 다르냐?

확실하진 않지만 우리 결론:

페이지를 단순히 가져오는 건 라우팅? 

API는  http요청이인는건 다 api야

 

이 쪼그만 한 웹사이트 하나 만드는 데도 api가 이만큼이나 있는데, 더 큰 건 얼마나 쓸지 궁금하다.

 

 

 

 

그리고 express를 사용한 시작 code :

 

 

내 프로젝트 폴더 이름
├── app.js
├── assets
│   ├── index.html
│   └── static
├── models
│   ├── ads.js
│   ├── users.js
│   └── comments.js
├── package-lock.json
└── package.json

 첫 번째 이상한 점은 asset을 내가 만들어서 index.html 넣어놔도 들어갈 수가 없다.

강의에서 준 front 파일들을 다 넣은 다음에 필요 없는 부분을 삭제해야 들어가진다. 뭐가 문제일까

const express = require("express");
const bodyParser = require("body-parser");

const app = express();
const router = express.Router();

router.get("/", (req, res) => {
  res.send(" TEAM 18!");
});
app.use("/api", bodyParser.json(), router);
app.use(express.static("./assets"));

app.listen(8080, () => {
  console.log("서버가 켜졌어요!");
});

우리는 mysql을 쓰기로 했다.

정형화되어 잇는 data로 이루어진 사이트니깐 mysql이 더 좋기도 하고 배우고도 싶었다.

 

mysql 까는 것부터 쉽지 않았다.

mac기준으로

 

MySQL 설치하기 :

$ brew install mysql

$ brew services start mysql

$ mysql_secure_installation

 

로 설치를 할 수 있다. 

 

당연히 첫 시도에 막힌다.  보니깐 옛날에 설치했었는데 그거랑 충돌이 나고 뭐 비밀번호 설정에서 에러 나고 난리가 난다.

 

검색 결과 어떻게 하는지 모른다.

일단 다 지워보고,  commandline 말고  웹사이트에서 받았다.

https://dev.mysql.com/downloads/mysql/

MySQL :: Download MySQL Community Server

비밀번호도 잘 설정했다.

 

 

 mysql -h localhost -u root -p

 명령어로 mysql 접속할 수 있다. 비밀번호 처음에 설정한 값으로 넣는다 그럼 아래처럼 나온다면 mysql이 잘 작동하는 상태.

exit으로 나올 수 있다.

 

 

그다음은 mysql workbench를 깐다. robo 3T와 비슷한 프로그램이라고 생각하면 된다

 

mongodb -> robo 3T

mysql -> mysql workbench 랄까

 

이것도 옛날에 써봤다. 하지만 당연히  모른다.  

모르는 건 모른다. 내가 모르는 걸 아는 게 중요하다고 했다. 그래서 파워 당당하게 모른다.

workbecnh 키면 이게 나온다.

Schema추가는 밑에 사진처럼 추가 버튼 위에서 누루고

Char set utf8 *한국어?로 설정한다.

 

 

 지금까지  미니 프로젝트 1 , 주특기 과제 1,2를 지나면서,  기능 구현까지는 하겠는데

각각 라인이 무슨 의미를 하는지... 그것을 빼고 무엇을 넣어야 작동하는지 모른다.

이건 나뿐만 아니라 많은 분들...(?) 이 비슷할 거라고 생각하는데,  항해 99에서는 일단 만들어 보고 연습하면 된다고 한다.

 

아직 배우는 단계니 깐 그럴 수 있다 고치지만 나중에 취직을 할 때,  CRUD랑 로그인 기능은 눈감고도 만들어야 한다고 하는데, 

앞으로 미니 프로젝트, 클론 코딩, 파이널 프로젝트 를한다고해서 나중에 이 기능들을 참고 없이 혼자서 그냥 맨손으로 칠 수 있을 찌 궁금하다.

 

그래서 이번 프로젝트에는 좀 자세하게 하나씩 뜯어보면서 해보는 방향으로 잡았다.

왠지 기대가 되는 이번 프로젝트인 것 같다.