M사 프로젝트 회고

🐜 프로젝트 개요

1. 프로젝트 기간 : 2024.07~2024.11 (4개월간)

2. 기술스택 

-퍼블리싱 : html, css, jquery

-프론트엔드 : vue.js, typescript, nuxt.js

-백엔드 :  java/ springboot / mysql / mybatis / JPA

3. 협업 툴 : GitLab, Figma, JIRA, Confulence, Teams, Discord

4.웹 유형 / 해상도 기준/ 디자인 너비 : 모바일 앱 / 500xp/ 360px

 

📝 프로젝트 설명

: 육류 거래 AI 서비스 플랫폼 개발. 

1)결제 서비스

구매자와 판매자가 B2C, C2C 거래를 할 때 메신저 창을 통해 충분한 협의 후 배송 방법을 선택, 각 배송방법에 맞는 결제와 환불,취소까지 제공하는 서비스 추가 개발

 

2)입찰 서비스

구매자와 판매자 원하는 품목과 가격으로 공고를 자유롭게 올리고, 입찰 제안 및 선정 , 결제, 취소까지 제공하는 서비스 추가 개발

 

 

😎 잘한점 

1. 바로 투입된 프로젝트임에도 기간 지체 없이 작업 끝낸 것.

: 기간이 촉박해서 바로 작업을 해야했는데 생각보다 너무 바쁘고 양이 많았다. 그리고 파악할 시간이 부족하다 보니까 수정해야하는 일도 많았는데 최대한 일정내로 기한을 맞추고 QA까지 최대한 빠르게 반영할 수 있도록 했다.

 

2. 첫번째 - 두번째 서비스 작업할 때 QA나 수정 요구사항이 줄어든 것

: 첫번째 서비스를 개발할 때는 고객사에서 주는 디자인 스타일이나 어떤 요구사항이 들어오는지 파악하고 두번째 서비스에서는 최대한 수정이 없도록 꼼꼼히 작업하려고 노력했다. 기획이나 설명에는 없어도 그 고객사의 스타일에 맞게 작업해야 하는 것들이 몇 가지가 있었는데(텍스트 길이 제한, 슬라이드 길이가 화면보다 좁으면 슬라이드 작동하지 않는 것 등등) 이 부분은 앞으로 다른 프로젝트를 하더라도 한번씩 고려해보며 해볼 수 있을 것 같다는 생각이 들었다.

 

😰 아쉬웠던 점

 

1.히스토리 파악이 어려웠던 것 

:내 전에 퍼블리셔가 두 명정도 있었는데, 제대로 히스토리 관리가 되지 않고 또 한 css 파일로 모든 것이 적혀져 있는데다가 정리가 되어 있지 않아서 파악하기 어렵고 기간에 쫓겨 주먹구구 식으로 하다보니 소스 파악이 어려웠다. 

💡_SCSS로 CSS소스를 컴포넌트화/ 재사용성 가능하도록 함수나 @mixin 선언하여 사용할 수 있도록 하기

💡_퍼블리싱 가이드를 만들어서 클래스 네이밍 컨벤션이나 작업 파일에 대한 설명, 스타일소스에 대한 정의를 정리해두어서 누가 작업을 들어가더라도 파악 가능하도록 정리해둔다.

 

2. 디자인 시안 꼼꼼하게 보는 것 :

1px까지 꼼꼼하게 봐야하는 부분이 있었는데 급하게 하다보니 거의 대부분 이런 수정 건들이 많았다. 이것도 1번의 아쉬웠던 점과 함께 공통화를 잘 시켜둔다면 이런 실수를 줄일 수 있지 않을까 생각한다. 시안을 꼼꼼하게 보고 검토하는 습관을 길러야겠다고 생각했다.

 

3. Git 충돌

종종 git 충돌을 내어서 해결하긴 했는데, 충돌낼 때 마다 당황스럽기도하고 되돌아보면 실수를 한적도 있기도하다. 정확히 PR정책에 대해 꼼꼼히 알아보고 진행해야겠고, 깃 공부도 꾸준히 해야겠다고 생각했다.

 

4.vue.js공부 (아쉽다기 보단 앞으로 공부하고 싶은것)

프로젝트 자체가 vue.js로 되어있다 보니까 내가 퍼블을 vue로 작업할 수 있다면 개발자분이 완전 html로 붙이는 것 보다는 작업이 수월할까 싶다. 간단한 기능(슬라이드, 어떤 경우에 보이고 안보이고 등등)은 vue로 작업해서 드리면 좋을 것 같다는 생각이 들었다.

 

🤓 배운 것들

1. PR 

깃 merge나 기본적인 기능은 배웠었는데 PR은 이번 프로젝트를 통해서 처음 배워봤다. 깃 소스가 오염되는 것을 막고 누군가가 확인한 후 최종으로 머지해준다는 것으로 프로젝트 소스 관리가 더 체계적일 수 있다는 것을 배웠다.

 

2. 일정 넓이보다 슬라이드 총 길이가 넓을 때만 슬라이드 작동하게 하기(swiper)

https://yunmee0704.tistory.com/153

 

3. JSON 파일 이용해서 이미지와 국가명 매칭 시켜서 보여주기

https://yunmee0704.tistory.com/152