👀 TIL

2차 프로젝트 release 🎉

2차 프로젝트에는 총 2주가 주어졌다.
이번에 팀회고를 하면서 느낀 점은 우리팀은 시간분배에 좀 부족했던 것 같다
처음 1주는 루즈하게 진행돼서 그다음 1주는 굉장히 빡세게 진행될 수 밖에 없었다.
팀원들도 갈수록 지쳐가는것처럼 보였다 ㅎㅎ.. ㅠㅠ
팀원들에게 잘 설명해줄 수 있는것도 잘 못해줬던 것 같다

✔ github action

• 주말까지 하기로했으나 잘 안되었기 때문에 발표당일 새벽까지 애먹었다
  다른 팀원분들이 와주셔서 도와주셨느데 진짜 구세주가 온 느낌이었다
  ㅠㅠ 어쨋든 나도 이부분에 대해서 더 공부해야할 것 같다는 생각이 들었다

✔ s3

내가 s3에 이미지 업로드하는부분을 담당했는데 강의를 안보고 구글링해서 했더니 굉장히 보안상에 문제가 많았고 내꺼에서는 업로드가 잘되었지만 다른 팀원들이 업로드를 하면 내 버킷에 올라오지 않는 문제가 발생했다.
우선 내가 작성한 코드먼저 여기에 기록해야겠다.

• app.js

const putFile = file => {
  const albumBucketName = 'sparta-forposting'; // S3의 버킷 이름
  const region = 'ap-northeast-2'; // 서울
  const accessKeyId = ''; // IAM에서 생성한 사용자의 accessKeyId
  const secretAccessKey = ''; // IAM에서 생성한 사용자의 secretAccessKey

  AWS.config.update({
    region,
    accessKeyId,
    secretAccessKey
  });

  const upload = new AWS.S3.ManagedUpload({
    params: {
      Bucket: albumBucketName,
      Key: file.name,
      Body: file,
      ACL: "public-read"
    }
  });

  const promise = upload.promise();

  promise.then(
    function(data) {
      console.log("Successfully uploaded photo.");
    },
    function(err) {
      return console.log("There was an error uploading your photo: ", err.message);
    }
  );
};

이것이 s3에 업로드되는 기능을 구현한 함수인데 js 이기 때문에 모두가 내 aws 비밀키를 알 수 있어 보안에 아주 취약하다고 하셨다. 그래서 백엔드에서 업로드를 해야한다고 하셨고 하루전에 이사실을 알았기 때문에 이 기능은 다음 release 때 구현하기로 하였다.

• file_upload.js

const button = document.getElementById('button');
button.addEventListener('click', () => {
  const input = document.getElementById('files');
  putFile(input.files[0]);
})

버튼을 누르면 app.js의 putFile로 넘어가는 함수이다

✔ jwt token 인증방식

우리팀은 로그인을 해야 모든 서비스를 이용가능하게 만들었다. 로그인기능은 되는데 토큰전달이 제대로 안되는것같았고 이것을 구현하기 위해 나는 밤을 샜다 ....ㅎㅎ
수많은 구글링 한 3페이지까지는 하나도 안빼놓고 다 읽었고 서버와 클라이언트는 토큰을 수없이 던져주고 받아야한다.
클라이언트가 서버에 요청을 보낼 때는 토큰을 같이 보내야함을 깨달았다.

• 클라이언트의 토큰 전달 방식

 $.cookie('mytoken','{{ token }}', {path: '/index'});//토큰을 쿠키에 저장

이렇게 서버의 원하는 api로 경로를 저장해주고 서버에서 받은 토큰 {{ token }}을 전달해주면 된다.
그러면 서버에게로 내 토큰이 전달되고 서버의 /index api에서는

• 서버의 토큰 전달 방식

token_receive = request.cookies.get('mytoken')

이렇게 token을 받아주면 된다.

✔ release 후 내가 느낀점 😎

나는 프로젝트를 하면서 거의 백엔드를 담당했다. 이제는 대충 서버와 클라이언트가 어떻게 돌아가는지 이해를 한 것같다.
구현할때는 담당해야하는부분이 꽤 많은것같아서 벅찼는데 다하고나니 그래도 내머리에 쌓인게 있는 것 같아 발전한 느낌도 들고 꽤나 뿌듯하다 . 이제는 spring 이 남았는데 정말 열심히 해야할 것 같다.
그리고 다음 release에는 aws , 배포 , github action까지 모두 잘 다루고 싶다.