발표 세팅

Web	VSC	PPT	Slido
(frontend view, figma)	develop		Questions

• Light mode
• Full-frame window
• Zoom 150%

이야기 할 것들..

(중요) 절대로 오디오가 비어서는 안된다

Slido 질문

Slido 수시로 확인하기. 핸드폰 or 아이패드로 화면 띄워놓는 것이 좋을 듯?

Figma MCP 장점?

실무 협업 시 웹 디자이너가 Figma를 주로 사용할 것이다. Figma MCP를 쓰면 디자이너가 구현한 것을 그대로 구현 가능하다. 우리가 잘 몰라서 그렇지, Figma에도 컴포넌트 기능이 있다. 마치 React 컴포넌트 처럼 variable도 설정 가능하다. 예시 디자인의 경우 잘 몰라서 대충 만든 디자인이다. 그야 난 디자이너가 아니니까 ㅇㅇ. 이렇게 구현된 것을 Figma MCP를 통해 모델에 넘겨주게 되면? 더 구체적으로 Frontend를 구현할 수 있다.

GitHub Copilot은 AI 모델이 아니다

한번씩 헷갈려하는 사람이 있더라. Copilot은 AI 모델이 “아니다”. AI 모델을 사용하는 “클라이언트 애플리케이션” 이다.

API 문서

(바이브 코딩을 하든, 직접 코딩을 하든) 백엔드에서 정의한 API를 문서로 정의한 문서가 있다. 이것이 openapi.json 파일이다. 이 json 파일은 어떤 경로로 어떤 요청을 보내면 어떤 값을 return하고 에러 발생 시 어떤 값을 return하는지 정의한다. 이 문서를 참고해서 API를 연결하는거다.

Docker

프로젝트 관리를 하면 버전과 관련된 문제가 상당히 많다. 버전 뿐 아니라 추가적으로 설치해야하는 것들이 많다. 버전들 사이 충돌 생기면 또 골치아파진다. 내 컴퓨터에서는 안되는데요? 이런 상황이 생기는거다. Docker를 쓰면 이런 문제는 없어진다. 모든 컴퓨터에서 똑같은 환경에서 앱을 실행할 수 있게 해준다. VM보다 훨씬 가볍다.

Docker Compose

우리 프로젝트의 경우 프론트, 백, 총 두개의 Dockerfile이 있다. 지금은 두 개라서 괜찮을지 몰라도, 필요한 Dockerfile이 여러개(로깅 등)라면 일일이 치기 귀찮아진다. Docker compose를 쓴다면 여러 개의 Dockerfile을 한번에 정의하고 실행시킬 수 있다. 솔직히 Dockerfile 두개밖에 없다고 docker run docker run 두번 하기엔 그거마저 귀찮지않냐.