슈코딩

오늘은 이거대여. 프로젝트에서 사용한 채팅기능을 복습할겸 정리해보려고 합니다. 우선 비동기적, 실시간 채팅을 구현하기 위해서 WebSocket을 사용했고 Django에서는 Channels 라는 라이브러리를 이용하면 WebSocket을 사용할 수 있게 됩니다. 여기서 데이터를 받는 비동기와 동기에 대해서도 알아야 하기때문에 제가 참고했던 블로그를 공유하겠습니다. https://velog.io/@alicia-mkkim/%EB%8F%99%EA%B8%B0-%EB%B9%84%EB%8F%99%EA%B8%B0%EB%9E%80 동기, 비동기란 동기는 순차적, 직력적으로 테스크를 수행한다.비동기는 병렬적으로 테스크를 수행한다.동기는 요청을 보낸 후 응답 (결과물)을 받아야지만 다음 동장이 이루어지는 방식을 말한다.모든 ..

✨Keep 커밋메시지 구체화- 저난 프로젝트때 ADD , FIX 두가지 위주로 컨벤션을 했었는데, 이번에는 더 구체적으로 나누어서 했던 점. 노션을 사용한 프로젝트 관리(담당 기능, API 명세서) 팀원 모두 프론트의 퀄리티를 희생하지 않고 깔끔한 UI 구현 파이썬, js 에서 사용하는 코드컨벤션 규칙을 잘 지켜 혼돈이 없었음 가장 어려운 파트를 뒤로빼서 LiveShare를 통해서 함께 작업을 해서 코드를 구현하는데에 있어서 서로 도움을 주고받으며 진행한 점 🏮Problem 채팅 기능을 구체적으로 기획하지 않아서 기능관련 코드의 정리가 어려웠음 처음부터 객체지향적 코드를 작성하지않아 코드 효율과 가독성 모두 좋지않았음. 도중에 바꿀려고 시도하였지만 구조적 한계가 있었음 CRUD 를 깊게 고민하지 않고 개..

요즘 프로젝트를 진행하면서 정말 자주 접하는 HTTP 에러 코드들이 있습니다. 매번 볼때마다 당황하지 않고 빠르게 해결하기 위해서 다시 한번 머릿속으로 복습해보려고 이 글을 써봅니다. #401 UnAuthorized 인증 문제 : Token을 잘못보낸 케이스 ( JS headers확인, Authorization: Bearer + token) 자주 발생. 주로 JS에서 api의 headers를 확인해보면 오타가 있거나 , token을 올바르지 않은 형식으로 보내고있거나, payload에서 토큰을 정상적으로 가져오고 있지 못할때 발생했었습니다. #403 Forbidden 주로 권한 문제, 현재 열려고 하는 웹페이지 또는 리소스가 액세스 할 수 없는 경우 발생을 합니다. 과거에 한번 발생을 했었는데, 검색을 ..

이번 프로젝트에서 맡은 기능중 list 페이지에서 물품들을 나열해서 보여주는 부분이 있었다. 데이터가 적을 땐 상관없지만, 데이터가 많은 상태에서는 어떻게 보여줄까를 고민하던중 단순히 커뮤니티 게시글처럼 보여준다면, 무한 스크롤이 아닌 페이지를 나눠서 1...2...3....이렇게 적용을 시켰을것이지만, 우리가 보여주는 형식은 이미지와 밑에 간단한 내용이 보이는 형태라서 무한스크롤이 더 UI에 맞고 자연스럽다고 생각했다. 또한 핸드폰에서 어플리케이션으로 확장성까지 생각 해본다면 무한스크롤이 더 이점이 있다고 생각해서 도전해봤다. 먼저 무한스크롤을 하려면 백엔드에서 데이터를 나눠서 보내줘야 할 필요가 있었다. 36개의 데이터가 있다고 생각했을 때 12개씩 나눠서 보내야 스크롤이벤트마다 호출을 통해 12개를..

이번에 매번 도전해왔지만 끝내 성공하지 못했던 소셜로그인을 드디어 처음으로 성공을 했다. 구글링을 통해서 나오는 자료들은 대부분 프론트와 백엔드가 분리되어있지 않은 상태에서의 코드들이거나 함수 베이스의 View라서 현재 진행 하는 프로젝트와는 어울리지 않는 코드들 뿐이었다. 하지만 그동안 배운지식과 나름(?) class 기반으로 작성한 코드를 발견해서 그 코드를 custom해서 프로젝트에 적용 시킬 수 있게 만들었다. 우선은 JavaScript부터 보면 function kakaoLogin() { window.Kakao.Auth.login({ scope: 'profile_nickname, account_email', success: function (authObj) { window.Kakao.API.req..

S.A 상세 Notion😀 https://quixotic-wok-871.notion.site/12-S-A-3183ff7202e942099238af3effd956ea 머선12조 파이널 프로젝트 S.A 🍀 제목 및 주제 quixotic-wok-871.notion.site Project Github😸 https://github.com/MeoSeon12/egodaeyeo-backend GitHub - MeoSeon12/egodaeyeo-backend Contribute to MeoSeon12/egodaeyeo-backend development by creating an account on GitHub. github.com https://github.com/MeoSeon12/egodaeyeo-frontend G..

✨Keep 객체 지향 코딩 커밋 메시지를 팀에서 정한 규칙에 맞게 작성 시간이 짧았던거에 비해, 많은 페이지를 기획했었는데 모두 구현을 한 점 노션을 사용한 프로젝트 관리(담당 기능, API 명세서) JS / Python 코드 컨벤션 지키기 Netlify 활용한 프론트엔드 배포 팀원간 활발한 의사소통 프로젝트 마무리단계에서 Print문, 미사용 import, console 점검 후 제거 프론트 백 나누고 프론트도 페이지 별로 디렉토리를 만들어서 관리한 점 🏮Problem 목업과 와이어프레임 계획이 부실해서 프론트엔드 작성시 시간이 더 많이 소요되고 수정이 잦았음 이미지 변환후 업로드시, 드래그앤 드롭방식 실패(serializer 인풋의 형식 차이)하고 input type=file로 파일을 저장하는 방식으..

이번에 시작한 프로젝트는 딥러닝을 활용한 유화 제작 프로젝트이다. 우리팀은 프로젝트 기획을 노션으로 만들었고, 메인 주제는 경매가 될것같다. 경매로 선정한 이유는, 우선 포인트제도가 들어가고 유저간의 포인트를 주고받는 트레이딩 시스템을 백엔드로 구현해보고 싶었던 마음이 있어서 그렇게 선정을 했다. 물론 유화니까 미술작품은 경매로도 많이 거래가 되는 품목이라 떠오른것도 있었다. 자세한 프로젝트의 개요와 기능명세서, API설계까지 모두 노션에 있으니 노션 주소로 들어가면 이번 프로젝트에 대한 내용들을 자세하게 볼 수 있다. https://www.notion.so/12-df4f63382fb146e69b3b5b96231bb792 머선12조 딥러닝 유화제작 프로젝트 🧾Project S.A www.notion.so..

이번 애니메이션을 주제로한 추천시스템 프로젝트에서 DB에있는 정보들을 불러오는 view 그리고 컨텐츠기반 추천모델, 유저기반 모델 등 한번에 내것으로 만들기가 어려웠던 부분들이 있었다. 그래서 오늘은 각 APP 별로 코드를 짜는데 잘 이해가 안갔던 부분을 중점으로 코드를 정리를 해보려고 한다. 1. user 앱 views.py 장르 선택 페이지 필요한 기능 아이콘 선택시 선택이 된걸 확인 할 수 있게 색상 변경 ( 핑크색, 하트 ) 아이콘 선택시 선택한 정보가 DB에 저장 add() 중복 선택시 저장되었던 정보가 DB에서 삭제 exists(), remove() 선택은 3가지만 할 수 있게 제한 (1,2 or 4도 안된다. only 3) count() 3개 미만 선택시에 선택완료 버튼 비활성화 (숨김) v..

#문제 추천시스템 프로젝트를 진행하던 중 크롤링을 통해 데이터를 수집해서 csv 파일로 만들었었다. 이제 데이터는 수집을 하였는데, 정작 이것을 DB에 넣어야하는데 그 방법을 몰라서 당황을 했다. 1. csv to json 우선은 장고의 loaddata라는것을 활용해서 데이터를 넣기위해 csv파일을 json파일로 변형을 시켰다. https://csvjson.com/csv2json CSV to JSON - CSVJSON Embed all the functionality of csvjson in any web application with Flatfile. Auto-match columns, validate data fields, and provide an intuitive CSV import experie..