console.log

MSA 구조로 설계 했기 때문에 기능 별로 서버를 따로 두었다 ~!~! MSA 구조의 장점은, 독립적으로 배포되기 때문에 다른 기능을 사용하는 사용자들은 방해를 받지 않는다 !!

https://www.figma.com/file/6kXYa6QJ0kuDQ2f7ISOece/%EB%B0%9C%ED%91%9C%ED%8C%80-%EB%BD%91%EA%B8%B0-UI?type=design&node-id=0%3A1&mode=design&t=Squ34JS5Eqk6DPfx-1 Figma Created with Figma www.figma.com 마음 맞는 교육생들과 토이 프로젝트로 진행하려고 기획한 발표자 추첨 서비스 ....... 시간이 맞지 않아 중단됐지만 나름 잘 만들었다고 생각한다 : ) 가장 중요하게 생각한 것은 직관적으로 기능이 보이도록 구현하는 것이었다 ! 왜냐면 아주 간단한 서비스이기 때문에 ..... https://www.figma.com/file/Inf6SeyHfCxh5fEgaJ..

https://school.programmers.co.kr/learn/courses/30/lessons/152996 프로그래머스코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.programmers.co.kr 메모리: 76.6 MB 실행시간: 0.11 ms 문제분석배열을 순회하며 짝꿍을 찾는다 ! 이때 중요한 것은 같은 몸무게의 사람이 존재하는지, 또한 그 사람들을 제외하고 2배, 3배, 4배에 겹치는 사람과 짝을 이루는 것 ! 걸린시간1시간 ⏱️ 풀이방법a : 원본 몸무게 카운트 할 배열 [1001] b : 2,3,4배 몸무게 카운트 할 배열 [4001] 1. weights 배열 순회하기 2. 현재 사..

1. CDN NPM 방식을 통해 vue-router 설치 npm install vue-router 2. Vue-router 이동 및 렌더링 → to속성, a태그로 변경됨 → link에 호출된 컴포넌트 보여줄 영역 3. router 정보 등록 new VueRouter({옵션}) → routes: [{path, component, name, redirect, children}] new Vue({router 속성 설정 등록}) to=”/path” to=”{name: “name”, params:{no: 3}, query: {no: 3}}” 동적 바인딩은 : 붙이기 params : /board:no query : /board?no=no $router.push(to에 썼던 거) —> 프로그래밍적 방식 const r..

1. Vue 특징 Approachable 접근성 Versatile 유연성 Performant 고성능 2. MVVM Pattern Model + View + ViewModel ViewModel 이 Vue의 역할 View와 Model 연결하고 자동 바인딩 3. Vue Instance el : 적용될 요소 data : 사용될 정보 template : 화면에 표시 methods : 화면 동작 관련 로직 filter : {{ data | name }} → 해당 data에 대해 name 필터 적용… 텍스트 형식 변환 (ex. 천 단위마다 , 찍기) computed : 캐싱 이용, 종속된 데이터의 변경 실시간 처리 (종속된 데이터 작업) watch : 특정 property 변경에 실행 될 콜백 함수 (다른 데이터 작..

완료 / 사용X / 테스트전 /api/v1 기능명 요청 파라미터 반환값 완료여부 메서드 URL 위치 속성 데이터 타입 설명 위치 속성 데이터 타입 설명 프로필 /profile 프로필 등록(요청X) POST body profileId string 프로필 ID = 사용자 ID (PK) O body nickname string 닉네임 body image string 프로필이미지 프로필 정보 GET header userId string 사용자 ID PK) body nickname string 닉네임 O body image string 프로필이미지 body eco double 에코 body volume double 볼륨 프로필 수정 PUT body nickname 닉네임 O body eco double 에코 bo..

시퀀스 다이어그램 회원관리 로그인 / 회원가입 수정 / 탈퇴 친구관리 유저검색 / 친구추가 노래자랑 등록 WebRTC 방 생성 비즈니스 서버가 세션 서버에 방을 생성할 채널 정보를 요청 세션 서버는 채널들의 상태를 보고 부하가 적은 채널을 선택해 응답 해당 채널에 입장하게 되면 채널에 생성된 방 정보를 추가 방 목록 & 방 입장 방 입장을 요청하면 해당 방이 들어있는 채널 정보를 응답 방 입장 후 해당 방에 입장한 사용자 정보를 추가 친구 목록 & 친구 초대 세션 서버에 요청한 친구 목록이 있으면 바로 응답 없다면 DB에서 가져와 세션 서버에 저장 SSE(Server Sent Events)를 통해 접속한 사용자에게 알림 전송 노래 검색 & 노래 예약 세션 서버에 요청한 노래 목록이 있으면 바로 응답 없다..

📢 DB 명명 규칙 공통 소문자를 사용한다. 단어를 임의로 축약하지 않는다. ex) register_date (o) / reg_date (x) 가능한 약어의 사용을 피한다. 사용해야 하는 경우, 약어 역시 소문자로 사용한다. 동사는 능동태를 사용한다. ex) register_date (o) / registered_date (x) “_TB” 접미어나 “TB_” 접두어를 붙이는 것은 옛날 방식이다. 테이블 단수형을 사용한다. ex) articles, movies : 복수형 이름을 구성하는 각각의 단어를 underscore로 연결되는 snake case를 사용한다. 교차 테이블(many-to-many)의 이름에 사용할 수 있는 직관적인 단어가 있다면 해당 단어를 사용한다. 적절한 단어가 없다면 관계를 맺고 있..