[AYCI] front end 페이지 구현

[kmu-leeky]

프론트 페이지 구성에 대한 전반적인 트래킹.
세부 이슈는 채림학생이 직접 생성.

[workdd]

프론트 엔드 개발 사항

• sha256(modelname)_modelsize 로 s3에 저장
• file upload 시 해당 파일의 사이즈를 알 수 있어야 함
• 모델 업로드 시 zip이나 특정 형식이 지정되어야 할 듯 함

[subeans]

웹 프론트 개발에 대한 정리를 간단하게 했습니다! 확인하시고 진행하시면서 이해안되는 부분이 있으면 말씀해주세요
https://www.notion.so/AllYouCanInference-94c202a427f4427eb8f4798a94430555

[kmu-leeky]

오케이. 수빈 재강아 잘 정리해줬다.
@H0zzae @i-soj-ng 진행 상황 공유해주면 좋을것 같아요.

[H0zzae]

웹 진행상황 공유드립니다.
https://github.com/allyoucaninference
새로운 깃헙 계정을 만들어서 소정님에게 전달해 드렸습니다.
allyoucaninference-demo라는 레포로 깃헙 페이지 세팅을 하였고,
private으로 demo-src레포를 하나 만들어서 프론트 소스 코드를 공유할 예정입니다.
현재까지는 react setting과 github page 연결만 진행되었고,
아직 input box들에 대해 작업이 진행되지는 않았습니다.
데모 페이지는 아래 페이지로 확인이 가능하실 것 같습니다.
https://allyoucaninference.github.io/allyoucaninference-demo/
추후 다시 프론트 진행사항이 업데이트되면 이슈 올리도록 하겠습니다.

[kmu-leeky]

네 채림학생 업데이트 고마워요. 소정학생도 업데이트 되는 내용있으면 여기서 공유해주세요.

[i-soj-ng]

네, 알겠습니다!
현재 깃헙 계정 전달 받았고,
작업 세팅 모두 동일하게 완료하였습니다.
추후에 진행 상황이 추가되면 내용 남기도록 하겠습니다.

[i-soj-ng]

23일 오늘, 수빈님, 재강님과 현재 진행상황에 대해서 피드백하는 시간을 가졌습니다.

아래 페이지는 현재까지 개발된 페이지입니다.
https://allyoucaninference.github.io/allyoucaninference-demo/

오늘 중으로 각 버튼의 클릭 기능을 추가하고, 파일 업로드 부분을 수정할 예정입니다.
이번주 내로 오늘 수빈님과 재강님께 피드백 받은 내용들을 수정하고, 추후에는 디자인 요소들을 추가할 예정입니다.
또한, 수빈님과 재강님께 프로젝트의 소개와 설명을 받은 후 이 내용들을 페이지에 추가할 예정입니다.

업데이트 되는 내용이 생기면 또다시 이슈 올리도록 하겠습니다.

[i-soj-ng]

현재까지의 데모웹 업데이트 내용 남깁니다.

1. framework 선택 부분에서 tensorflow, mxnet 버튼 활성화
2. mxnet 버튼 클릭시 파일 선택 위젯 2개가 뜨는 기능 추가
3. framework 버튼 선택시, 선택된 버튼 표시 및 버튼 재클릭시 선택 해제 (여러개의 버튼 중복 클릭 불가능)
4. AllYouCanInference 타이틀과 내용 왼쪽 정렬 맞춤

업데이트 내용은 아래 페이지에서 확인 가능하십니다.
https://allyoucaninference.github.io/allyoucaninference-demo/

[kmu-leeky]

현재 해당 논문이 double blind 로 심사중이라 해당 링크를 비공개로 해서 작업을 진행하는게 좋을것 같아요.

[i-soj-ng]

네! 알겠습니다. 링크는 닫아두도록 하겠습니다.

[kmu-leeky]

https://github.com/allyoucaninference/allyoucaninference-demo 여기도 private 으로

[i-soj-ng]

https://github.com/allyoucaninference/allyoucaninference-demo 여기도 private 으로

네 모두 private 으로 전환하였습니다!

[kmu-leeky]

소정학생. 프론트엔드 개발의 전체적인 계획이나 진행상황은 어떤가요? 마지막으로 봤을때 디자인적으로나 완성도 측면에서 조금 더 작업이 되기는 해야겠더라구요. backend 와 병합하는 계획은 어떤지도 이야기해주면 좋겠어요.

[i-soj-ng]

네 교수님! 6월 29일 수요일 재강님, 수빈님과 미팅을 통해 현재까지 개발된 페이지에서 추가할 사항을 전달받았습니다.
현재, 페이지에 프로젝트에 대한 설명과 각 기능에 대한 comment가 추가되었습니다.

재강님과 수빈님께서 모델 선택 버튼 추가를 요청해주셔서 이 작업은 주말동안 이루어질 예정입니다.
디자인에 대한 디테일 또한 보완할 예정입니다.
월요일 전까지, 업데이트된 내용들을 정리해서 이슈 남기도록 하겠습니다.

백엔드에 대한 부분은 다음주 재강님, 수빈님과의 미팅날, 페이지에 업로드 되는 파일의 크기를 파악한 후 계획을 구체화하도록 하겠습니다.

[kmu-leeky]

네 좋습니다. 중간중간 업데이트 상황 생기면 코멘트 남겨주면 좋을것 같아요.

[i-soj-ng]

현재 페이지 캡쳐사진 남깁니다.
재강님과 수빈님께서 추가되기를 요청해주신 컴포넌트를 추가하였습니다.

이 이후로는

1. 파일 업로드 부분 디자인 수정 (드래그&드롭 방식의 파일 업로드 창으로 디자인 예정)
2. 오류 사항 수정
3. 반응형 페이지 기능 적용
   작업들이 이루어질 예정입니다.

파일 업로드 부분 디자인이 완성되면 또다시 이슈 남기도록 하겠습니다.

[kmu-leeky]

오케이. 좋습니다. 지금처럼 private 하게 작업을 해주고, 공개전에 단어와 서술 정도를 고치면 될것 같아요.

[i-soj-ng]

네 알겠습니다!
Description 수정은 수요일에 수빈님, 재강님과의 미팅을 통해 고쳐나가도록 하겠습니다.
수요일 이후, 피드백 받은 내용들을 페이지에 업데이트한 뒤 이슈 남기도록 하겠습니다.

[i-soj-ng]

7월 10일자 진행상황 공유드립니다!

1. 페이지 헤더 부분 타이틀 변경 (AllYouCanInference -> AYCI)
2. 컴포넌트 및 폰트 크기 더 크게 변경
3. 각 버튼의 설명 comment 수정
4. Model Select 드롭박스 추가
5. 파일 업로드 및 모델 선택 컴포넌트 디자인 변경 진행중

5번 사항이 완료되면 스크린샷과 함께 또다시 이슈 남기도록 하겠습니다.

[i-soj-ng]

페이지 진행상황 공유드립니다.

1. 컴포넌트 재배치 완료
2. 재강님, 수빈님께 피드백 받았던 디자인 수정사항 적용
3. 파일 업로드 부분 수정 완료 (모델 셀렉트 컴포넌트와 결합)

위 사항들이 완료되었고, 현재는 사용자로부터 업로드받은 파일을 AWS s3에 저장하는 기능을 개발중에 있습니다.

[kmu-leeky]

오케이. 좋습니다. 화면도 깔끔하고 좋아보이네요.

[i-soj-ng]

페이지 진행상황 공유드립니다.

현재 파일 이름 해쉬 함수를 전달받아 페이지에 적용 완료하였습니다.
페이지에서 사용자가 파일을 업로드 시, 파일 이름이 일정한 규칙대로 변경되고, 파일의 크기도 반환합니다.

�이번주부터는 API 호출 작업이 진행될 예정입니다.
API를 통해 사용자가 선택한 내용들과, 업로드한 파일에 대한 내용(파일 size, 해쉬된 파일 이름)이 전달됩니다.

API 호출 작업 완료 후 다시 이슈 남기도록 하겠습니다.