JIE0025

✅ 개요 99‘nasty kidz의 공연을 보러갔다. 이날 친구의 남친분을 첨 뵙게 되었는데 대단한 개발자분이셨다. 그리고 그분과 대화를하다가 99‘nasty kidz의 팬페이지를 개발하자는 이야기가 나와버렸다. 둘 다 찐 ENTJ 개발자인게 함정 프로젝트 올리신것 클론을 하고, 이제 개발을 해볼까!? 하는 와중에 정해진 게 하나도 없다는것을 깨달아 화면기획을 하게 됐다. ⏺️ 화면 구성 1. 로고 (Home) 로고를 클릭하면 맨 위로 움직인다. 2. 뮤비/영상 설정한 URL의 영상이 자동재생된다. 3. 멤버 소개 스크롤을 내리면 인터랙티브한 효과로 멤버들이 왼쪽, 오른쪽에서 나오도록 설정한다. 각멤버를 누르면 멤버의 인스타 계정으로 들어갈 수 있다. 4. 앨범 리스트 Album, Party, DJ, A..

✅ 선행개념 three.js의 개념과 핵심객체 (Renderer, Scene, Camera) https://jie0025.tistory.com/614 [three.js] 3D를 웹에 렌더링하는 라이브러리 (개념 & 핵심 객체 Renderer, Scene, Camera) three.js Web 상에서 3D를 띄울 수 있는 Javascript 라이브러리 중 하나 * 선행개념으로 html, css, Javascript가 있다. ✅ 장점 가장 인기 있는 라이브러리 중 하나로, WebGL 작업 프로세스를 단순화했다. 플러 jie0025.tistory.com ✅ npm을 이용해 three.js 설치하기 터미널에서 npm을 이용해 three.js 를 아주 간단하게 설치할 수도 있다. 만약 npm이 없다면 npm 설치..

three.js Web 상에서 3D를 띄울 수 있는 Javascript 라이브러리 중 하나 * 선행개념으로 html, css, Javascript가 있다. ✅ 장점 가장 인기 있는 라이브러리 중 하나로, WebGL 작업 프로세스를 단순화했다. 플러그인 없이 애니메이션 2D, 3D 그래픽을 만들 수 있다. 렌더링, 그림자, 카메라, 조명 등 다양한 기능을 제공한다. WebGL, CSS3D, SVGRenderer와 같은, 다양한 렌더러를 지원한다. 문서가 광범위하고, 커뮤니티 역시 활발하다. 다양한 플랫폼에서 동작할 수 있다. ✅ 왜 공부하고자 하는가? 요즘 마케팅 컨텐츠를 볼 때마다 3D요소가 어디에나 무수히 많은것을 볼 수 있다. 사용자에게 몰입감과 생동감있는 경험을 줄 수 있는 웹페이지를 구성하기 위해..

✅ User 관련 ⏺ 회원가입 인증 페이지 Q . 김준표: 인증번호 보내기하고 인증번호 인증 버튼은 하단의 회원가입 완료로 하는걸까요? A. 강지은 : 인증번호 보내기랑 인증버튼이 분리되어야 한다면 아래에 추가 해놓겠습니다. ⏺ 마이페이지 - 유저의 활동(프로젝트/스터디 등) 활동을 안한 년도는 띄어줄 필요가 없음. 매년 활동을 했다는 가정하에 해도 많은 활동이 불가하긴 하지만, 데이터가 너무 많을 경우[멤버 프로필 보기] 연차가 오래된 멤버에 대해서 참여한 활동은 어떻게 띄울지 고민해야합니다. [FLAG 소개에 있는 동아리 활동 이력처럼 페이징 처리해주는 방향을 고려할까 생각중 어떻게 생각하시나요? → 김준표: 동아리 활동 이력이랑 비슷하게 년도별 처리해주면 되는거라서 페이징 처리해서 보여주는 방식 좋..

✅ User 관련 회원가입 절차별 페이지에 가입구분 따로 넣기 탈퇴절차 모달창 간단하게 생성 비밀번호 입력 확인 정말로 탈퇴하겠습니까 ? 로그아웃 버튼 위치 삽입 (고민중) 회원정보수정 tab 컴포넌트 디자인 개선 ✅ Activity 관련 활동 만들기 모달창 만들기 활동 만들기 버튼 추가에 의한 모집중 이동 ✅ Post/Reply 관련 게시글 세부화면 댓글 수 추가 댓글 숫자 빼기 (반영했으나, 변경된 부분이 없어서 이미지 추가 x) 게시판 화면 좋아요 수 추가

✅ 회원가입 절차 약관동의 아이디 비밀번호 입력 개인정보 입력 이메일 입력 과 동시에 인증 버튼이 존재한다. Login 페이지 - Redirect 1️⃣ 약관동의 2️⃣ 아이디 비밀번호 입력 3️⃣ 개인정보 입력 4️⃣ 이메일 입력과 동시에 인증 버튼

✅ 모달창 (활동/글쓴이 ver) ✅ 모달창 (활동/신청자 ver) ✅ Activity + 모달창 목업디자인

✅ Design ver 모집중, 모집완료 활동 리스트는 모집 마감일을 기준으로 보여준다 ✅ Frontend 레이아웃 가이드라인 ⏺ 목차 ⏺ 컨텐츠 내부 간격 ⏺ 헤더 - 목차 - 컨텐츠 사이 간격

✅ 통합 검색 페이지 ⏺ 공통 01. 유저 검색 유저는 동명이인이 존재할 수 있으므로, 학과까지 보여준다. 가장 활동이 활발한 순서로 정렬한다. 02. 인기글 검색키워드가 제목/제목+컨텐츠/컨텐츠에 매핑되는 애들 중 좋아요가 높은 순서로 보여준다. 03. 카테고리별 게시글 검색 여러개의 카테고리에 매칭되는 정보가 있고 내용이 많을 수 있으므로, 인피니티스크롤 페이징처리 매칭 조건 우선순위 생성 (같은 우선순위일 경우 날짜기준 정렬한다) 0순위 : 제목에 키워드 이 존재 +컨텐츠에도 존재 + 작성자의이름까지 매칭되는 특이케이스 (없을수도?) 1순위 : 제목에 키워드 이 존재하면서 컨텐츠에도 존재 2순위 : 제목에만 키워드 이 존재 3순위 : 컨텐츠에 키워드 존재 + 작성자의 이름이 4순위 : 작성자의 이름..