본문 바로가기

전체 글92

[A6조] 최종프로젝트 KPT 회고 Keep 팀원1 : 브랜치 병합을 자주하여 메인 브랜치의 버전 관리가 잘 되었던 점 팀원2 : 네이밍, git 컨벤션을 통한 효율적인 업무관리 및 점검, 데이터 송수신에 필요한 기본적인 자바스크립트 지식 공부 팀원3 : 서로 컨벤션을 공유하고 브랜치 병합을 함계 해서 머지충돌을 줄인 점 팀원4 : git main, develop branch를 나누고 활용한 점, 작업 공유가 잘 된점 팀원5 : 빠르게 작업 내용과 오류사항을 공유하여 함께 해결한 점 Problem 작성된 아키텍쳐 구조 일부 오류 서비스 기획 의도에 맞춰 덕질에 초점을 둔 화면 디자인이나 기능이 필요 Try 팀원1 : 커뮤니티에 적용할 수 있는 새로운 기능 고안하여 도입 사용자 친화적인 UI로 수정 (css 수정) 소셜 로그인 기능 보완(로.. 2022. 12. 30.
내일배움캠프_TIL_2022.12.16 지난번 작성했던 메인페이지 부분에서 본인이 신청한 워크샵 삭제 기능을 구현하기 위해 위와 같이 '삭제'버튼을 만들었는데 작성한 코드는 아래과 같다. onclick 버튼을 통해 'myPageAppliedWorkshop_del_fuc()'를 실행하도록 한 후, - 클릭 시 바로 삭제 시키는 것이 아닌, 선택/취소 여부를 결정하기 위해 'confirm' 사용 - 선택을 눌렀을 때 alert "삭제되었습니다"를 표시한 후 삭제 후 삭제된 정보를 바로 반영하기 위해 window.location.reload()실행 const awTableThDeleteNum = document.createElement('th') awTableThDeleteNum.setAttribute('class', 'mypage-appliedw.. 2022. 12. 17.
내일배움캠프_TIL_2022.12.15 오늘은 최종프로젝트 중간발표일로, KPT 회고로 TIL 작성하겠습니다. Keep 팀원1 : 각자의 브랜치에서 작업 후 바로 메인 브랜치에 합치지 않고, develop 브랜치에서 테스트 후 메인으로 합치는 점이 좋았고, 팀원 모두 활발한 커뮤니케이션으로 소통이 원활했던 점과 문제 발생 시 팀원 모두 적극적으로 해결하기 위해 도와주는 점이 가장 좋았습니다. 팀원2 : 수업 때 배운 백엔드 기능 외 추가적인 기능들도 다른 팀원분들을 통해 접하고 구현해볼 수 있어서 좋았고, drf의 중요한 내용들에 대한 개념을 확고히 다지는 계기가 되었다. 팀원3 : 다 같이 머지충돌을 해결하고 함께 풀리퀘스트를 올릴때 서로 알려주어 시간 단축이 되지않았나 팀원4 : 기능마다 서로 도우며 활발한 커뮤니케이션이 좋았고 컨벤션을 .. 2022. 12. 17.
내일배움캠프_TIL_2022.12.14 내일 프로젝트 중간발표가 있어서, 발표준비도 해야 하는 입장이다보니 발표자료 만드는데 많은 시간을 할애하였는데 금일 TIL은 발표자료로 대체하겠습니다. 2022. 12. 17.
내일배움캠프_TIL_2022.12.13 자바스크립트에서 getElemenyby~ 와 관련된 함수는 해당 Id 또는 ClassName 등의 모든 정보를 불러온다. 전체적인 정보를 불러오기 때문에 html에 표시되는, 가령 와 같은 코드를 불러오기 위해서는 반드시 뒤에 인덱스 '[0]' 를 붙여야 하고 input 태그의 경우, 입력한 정보를 불러오기 위해서는 .value를 입력해야 한다. (예시) // 마이페이지 좌측 프로필 사진 부분 const myPage = document.getElementsByClassName('mypage')[0] const mypageLeftSide = document.createElement('div') mypageLeftSide.setAttribute('class', 'mypage-leftside') myPage... 2022. 12. 17.
내일배움캠프_WIL_2022.12.11 아래 프로필 카드의 신청 또는 참여확정된 인원 수를 파악하기 위해서는 지난번 JSON 형태의 데이터에서 "workshop_apply_guest": [ { "guest": 2, "guest_name": "js", "workshop": "뷰티 클래스", "result": "대기", "created_at": "2022-12-16T18:44:06.745497" }, { "guest": 2, "guest_name": "js", "workshop": "배드민턴 클래스", "result": "대기", "created_at": "2022-12-16T18:44:10.909492" } ] 위와 같이 자신이 신청한 워크샵 정보들이 나올텐데 신청 결과는 대기, 승인, 거절 중 하나로 결정이 된다. 따라서 자바스크립트 부분을 .. 2022. 12. 17.
내일배움캠프_TIL_2022.12.12 마이페이지 부분 view와 serializer 부분을 작성할 때 가령, 내가 선택한 취미, 신청한 워크샵, 생성한 워크샵 정보를 각각 정리하는 것이 훨씬 더 가독성 있고, 필요한 정보들을 세부적으로 잘 구분하여 사용할 수 있다고 생각했는데 오히려 코드만 번잡해지고 백엔드 부분 뿐만 아니라 자바스크립트 부분에서도 함수를 여러번 호출해야 하는 번거로움이 있어서 한 번에 불러올 수 있도록 하는 것이 훨씬 효율적임을 깨달았다. 아래는 mypageSerializder로 통합한 부분이며 필요한 다른 필드는 다른 serializer를 도입하여 (class Meta 위에 있는 변수들) 작성할 수 있다. 여기서 many=True를 입력하지 않으면 정참조로 불러온 변수만 호출할 수 있고, 해당 serializer의 정보를.. 2022. 12. 17.
내일배움캠프_TIL_2022.12.09 자바스크립트에서 전역변수는 별도 js 파일에서 관리하면 훨씬 더 효율적으로 작성할 수 있다는 것을 알게 되었다. 가령, 프론트, 백엔드 및 소켓 관련 url 주소나 네비바, 채팅창 등 대부분의 페이지에서 활용되는 함수의 경우 global.js 에 코드를 입력하였고 다음은 팀원분들과 함께 작성한 js 파일이다. // 전역 변수 및 url을 가져오는 js 파일 // 전역변수는 어디서 사용하는지 적어주기 const front_end_url = "http://127.0.0.1:5500" // const front_end_url = window.location.host const back_end_url = "http://127.0.0.1:8000" const base_websocket_url = `ws://${w.. 2022. 12. 17.
내일배움캠프_TIL_2022.12.08 // mypage.js const mypageRightSide = document.createElement('div') mypageRightSide.setAttribute('class', 'mypage-rightside') document.body.prepend(mypageRightSide) const navbar = document.createElement('nav') navbar.setAttribute('class', 'nav nav-pills flex-column flex-sm-row') mypageRightSide.appendChild(navbar) const shNav = document.createElement('a') shNav.setAttribute('id', 'nav-selectedhob.. 2022. 12. 9.
내일배움캠프_TIL_2022.12.07 drf 정참조 역참조 개념이 아직도 헷갈려서 자료를 수집하고 있는 중인데 '분명 맞는 것 같은데 100% 확신하기는 어려움' 으로 정리할 수 밖에 없어서 이후에 개념이 더 명확해 지면 다시 정리하려고 합니다. # workshops/serializers.py class HobbySerializer(serializers.ModelSerializer): class Meta: model = Hobby fields = '__all__' class SelectedHobbySerializer(serializers.ModelSerializer): # 마이페이지 - 내가 선택한 취미 # hobby = serializers.StringRelatedField(many=True) # pk값 제외하고 string 데이터만 불러.. 2022. 12. 7.