• 기술 스택 / 라이브러리

• Schema

• 이번 주 한 일

  • 팀 전체
    • 기능구현 - 1차 MVP
  • 팀원 개인별로 작성해 주세요.

  정소채	기획/설계 총괄, 와이어프레임 디자인
  김도원	글쓰기/글수정/글 상세보기 / 유튜브api 컴포넌트/유튜브커스텀플레이어 컴포넌트/네이버지도api 컴포넌트/네이버 역지오코딩api 컴포넌트 / 유튜브 검색기능 구현 / redux 전역관리 / react-query 쿼리문 작성 / axios interceptor 관리 / 회원가입 로그인 토큰 관련 3계층 구현 / 액세스토큰/리프레시토큰/ 프론트 전역 토큰을 통한 자동로그인 기능 / test api 구현
  김혜경	메인페이지 구현 / 설정페이지 구현 / header&navbar 구현
  육정백	로그인 기능 / 회원가입 기능 / 유효성 검사 / (로그인,회원가입 css 수정) / 유저페이지 게시물 받아오기 정렬
  이도영	좋아요 게시물 / 내가 올린 게시물 개수 구현
  김형섭	메인 페이지 조회 구현 / 유저 페이지 조회 구현 / 게시글의 댓글 CRUD 구현 / 좋아요, 좋아요 취소 구현 / 신고 기능 구현
  어민규	게시물 CRUD 구현, multer-s3 & multer-s3-transform & sharp 기능 구현

BACKEND 질문:

| post.service.js에서 트랜잭션을 사용하여 DB에 있는 images 테이블과 s3버킷에 저장된 이미지를 삭제하는 것을 한번에 동작하게 하고 싶습니다.

문제점. 트랜잭션을 적용을 하게 된다면 s3버킷에 삭제하는 deleteImageFromS3 함수를 어떻게 트랜잭션을 넣어줘야 하는지 잘 모르겠습니다. 또한, 트랜잭션이 적용이 된다하더라도 S3버킷에 있는 이미지가 삭제된 후, DB에 있는 이미지가 삭제할 때 문제가 생겨 롤백을 하게 된다면 s3버킷의 삭제된 이미지가 과연 롤백이 될까 하는 의문도 들어서

// post.service.js

  deletePostWithImage = async(postId, userId) => {
    // Images테이블 url 찾기
    const findImageKey = await this.postRepository.findImageKey(
      postId,
      userId
    )
    
    // S3 버킷 삭제할 image.path 추출
    let filePath = []
    findImageKey.forEach(image => {
      // URL()에서 파일 경로 추출
      const urlParts = new URL(image["dataValues"]["url"]) // new URL(url)
      const decodedPath = decodeURIComponent(urlParts.pathname.substring(1)); // 인코딩된 문자열을 디코딩한다.
      filePath.push(decodedPath);
    })
    // console.log('filePath', filePath)

    // S3버킷 삭제 ( 재검토 필요)
    const deleteS3 = filePath.map( async(url) => {
      return await deleteImageFromS3(url)
    })

    // 게시글 삭제
    const deletePostWithImage = await this.postRepository.deletePostWithImage(
      postId,
      userId
    )

    return deletePostWithImage
  };

// multerMiddleware.js에서 s3버킷 이미지 삭제 함수

// S3 버킷 이미지 삭제 함수
async function deleteImageFromS3( imageKey ) {
  const params = {
    Bucket: 'hapoomimagebucket', // 버킷 이름
    Key: imageKey, // 삭제할 이미지의 키 'images/1691343931840_multer.png'
  };

  try {
    const command = new DeleteObjectCommand(params);
    await s3.send(command);
    console.log(`S3에서 이미지 삭제 완료: ${imageKey}`);
  } catch (error) {
    console.error('S3 이미지 삭제 중 오류 발생:', error);
  }
}

FRONTEND 질문:

1. 최적화를 위해 재사용이 가능할법한 페이지들을 굳이 추가생성하지 않고 가급적 한 페이지 및 컴포넌트 안에서 최대한 재활용을 하는 방향으로 전체적인 코드의 수를 줄이는 시도를 이어오고 있습니다. 이러한 시도가 성능에 어느정도 도움이 되는지와 이로 인해 코드의 가독성이나 개발의 복잡함이 증가하면 되려 마이너스가 되는지를 알고싶습니다.

2. 현재 저희가 완성한 1차 MVP의 기술적 완성도나 볼륨이 현재까지 항해에서 수료하신분들의 최종 프로젝트를 기준으로 어느정도로 평가를 받을 수 있을까요? 그리고 추가적으로 개선방향을 제시 받고 싶습니다.

3. 2차 MVP기능을 추가로 구현을 해야 하나요 아니라면 피드백 후에 기능수정과 추가 기능이 들어가야 할까요? 저희는 2차 MVP 볼륨이 적절하게 잡혔다고 생각하는데 혹시 어떻게 생각하시는지 궁금합니다!

아래 링크의 백로그에서 MVP 구성을 보실 수 있습니다!

<aside> 📌 https://projectworkman.atlassian.net/jira/software/projects/SCRUM/boards/1/backlog

</aside>

리더 코멘트:

안녕하세요, 멘토님! 6조 리더즈입니다. 지난주에 주신 멘토링 내용대로 기능구현을 차근차근 진행해나가고 있습니다. 세심하게 신경써주신 코멘트가 큰 도움이 되어 어느정도 방향성을 잡았습니다. 2차 MVP 구현 스프린트로 넘어가는 이 때, 팀 관리 측면이나 런칭을 앞두고 여러가지 고민스러운 부분이 있습니다.

1. 현재 기획에서는 PWA로 모바일앱을 대체하려는 판단이 맞는걸까요? 아니면 flutter나 react-native를 빠르게 배워서 크로스플랫폼으로 런칭을 시도하는게 맞을까요?
2. 기한적으로 조금 빠듯한 상황이 생겼을 때에는 어떤 식으로 스크럼 관리를 해야 하는지 궁금합니다. 예를 들어 예상치 못 한 상황으로 스프린트 내에 할당된 기능구현이 모두 완료되지 못했을 때, 기한 내에 CSS 구현에 필요한 디자인이 나오지 않았을 때, 어떤 식으로 매니지먼트를 할 수 있을까요? 현업에서는 어떤 식으로 관리가 되나요?

삐약 개발자들끼리 모여 일을 하다보니, 매니지먼트 적인 부분에서 좋은 코멘트를 받을 기회가 너무 적어 아쉬운 상황입니다. 지난번에 JIRA에 깃헙 연결을 한 번 해보라고 말씀주셨는데, 깃헙도 연결이 되지 않아 (퍼블릭으로 돌려두었는데도 왜 되지 않는지 알 수가 없습니다.) 직접 스프린트별 스크럼을 수정해나가고 있는 중입니다.

두 리더를 중심으로 최대한 체계적이고 효과적인 매니징을 하려고 부던히 노력하고 있으나… 부족한 점이 많다보니, 갈등 상황이 생기는 것을 최대한 배제하려고 외려 소통이 적어지는 리스크도 부담이 됩니다. 이런 부분에 대해서도 코멘트를 짧게 받을 수 있을까요? 늘 감사드립니다. ‘v`