2023 계 모각소 

동모 

활동내용 및 발표자료

<팀원>

소프트웨어학과 심영준

소프트웨어학과 이은정

소프트웨어학과 김나영


<팀원별 활동내용>

심영준

Prefix를 Auth, Schedules, Stores로 나누고 기능별 API 명세서를 작성했습니다.

User table을 생성하였습니다.

Auth 관련 API를 설계했습니다.

AWS 계정을 만들고, IAM 권한과 Role을 팀원마다 지정해주었습니다.

EC2 인스턴스를 생성하고, Elastic IP를 붙여 인스턴스 public IP를 고정하였습니다.

인스턴스의 80번 포트를 3000번 포트로 포트포워딩하고, SG을 설정하여 http, https 프로토콜을 통해 접속 가능하도록 하였습니다.

Nginx와 무료 DNS를 사용하여 Backend endpoint를 제공해주고, 이를 frontend에 제공하였습니다.

이은정

키워드별 지도 생성 웹의 데이터베이스를 설계했습니다.

review, comment, photo, user, store, place, schedule 총 7개의 table을 생성했습니다.

table을 생성한 후 각 table의 매핑 관계를 설정했습니다.

리뷰와 댓글, 스케쥴의 API를 설계했습니다.

메소드, endpoint, 요청 방식, 응답 방식을 추가하였습니다.

DB와 API 명세서를 이용하여 실제 서버를 개발하였습니다.

설계된 DB를 보고 entity를 생성하고 매핑 관계를 설정했습니다.

API 명세서와 동일하게 각 endpoint와 메소드에 따라 클라이언트에서 제공한 정보를 저장하고 클라이언트에서 요청한 정보를 저장하였습니다.

AWS에서 새로운 인스턴스를 생성하여 개발한 서버를 배포하였습니다.

외부에서 접속 가능하도록 서버를 배포하였고 해당 인스턴스 내의 DB와 연동하였습니다.

김나영

초기 기획안을 바탕으로 서비스 디자인을 설계하였습니다.

FIGMA를 통한 서비스 디자인 설계와 팀원들 간 협업하는 방법을 배울 수 있었습니다.

디자인이 완성된 이후에는 React를 활용하여 서비스 프론트 페이지를 개발하였습니다.

서비스의 중심 소재였던 카카오 맵 api를 활용하여 화면 상에 지도를 띄우는 등 다양한 React의 기능들을 확인해보았습니다.

Git에 push하고 merge하며 git을 활용한 협업을 익히고 commit을 관리하는 방법을 배울 수 있었습니다.


<팀원별 최종성과>

심영준

Nest.js와 Typescript에 대해 배웠습니다.

API 명세서를 기능별로 작성하는 법에 대해 배웠습니다.

AWS의 VPC를 구성하는 요소를 배웠습니다.

EC2 인스턴스를 통한 배포 방식을 배웠습니다.

이은정

백엔드의 기초에 대해 배웠습니다.

API 명세서를 작성하는 법, DB를 설계하는 법에 대해 배웠습니다.

NestJS를 이용하여 API를 생성하는 법, entity를 생성하는 방법에 대해 배웠습니다.

Database와 연결하는 방법에 대해 배웠습니다.

실제 인스턴스에 서버를 배포하는 방법에 대해 배웠습니다.

김나영

다양한 map api의 차이점과 카카오 맵 api 구현 방법을 익힐 수 있었습니다.

mapview를 띄운 후, 카카오맵 독스에서 제공하는 다양한 기능(마커 등)을 구현해보며 적용 방법을 배웠습니다.

반응형 웹사이트를 제작하는 방법에 대해 공부하였습니다.

프론트 페이지와 데이터베이스(백엔드)를 연결하고 상호작용하는 방법을 배웠습니다.


<팀원별 향후계획>

심영준

모각소를 통해 배운 백엔드와 인프라에 대한 개념을 바탕으로 캡스톤 디자인 프로젝트에서 백엔드 및 인프라 개발을 할 예정입니다. 

추후 타 프로젝트의 Tekton과 ArgoCD를 이용한 CI/CD 파이프라인을 연동하여 해당 배포를 자동화하고, 

VPC를 구성하여 Frontend와 Backend의 동시 배포까지 구현할 예정입니다.

이은정

모각소를 통해 배운 백엔드의 기초를 바탕으로 캡스톤 디자인의 프로젝트에서 백엔드 개발을 할 예정입니다.

추가로 JWT 토큰을 이용하여 로그인 기능을 구현하는 방법에 대해 공부하고 실제로 구현할 예정입니다.

배포를 자동화하는 CI/CD를 공부하고 실제로 구현해 볼 예정입니다.

김나영

방학동안 이루어진 모각소를 통해 프론트 개발을 공부하며, 캡스톤 디자인 프로젝트 진행을 위한 기반을 닦을 수 있었습니다. 

React를 활용한 웹사이트 개발과 백엔드와의 상호작용, git을 통한 협업 등을 캡스톤 디자인 진행 전에 미리 테스트하고 익히며 개발에 익숙해지는 기회가 되었습니다. 

이후에는 프론트엔드 개발자로써 책임감 있게 서비스 프론트 페이지를 디자인하고, 제작하고, 개발하여 서비스를 완성시키고 싶습니다


<발표자료>