• 아이디어 선정 및 선정된 아이템에 대한 개발 컨셉 설정
• Figma를 이용한 초기 WireFrame 작성
• Miro를 이용한 Flow Chart 작성
• DBdiagram을 이용한 Schema 초안 작성
• API 초안 작성

• 
• Role : Team Leader
• Position : Front-end
• Stack : React, Hooks, React Router Dom, Axios,CKeditor ,Illustrator, Photoshop
• Works :

[PM]

• 프로젝트 기획 및 상황관리
• Frontend-Backend 의견조율 및 팀원 기록관리

1) UI 기획 및 디자인

• 포토샵을 이용한 애플리케이션 소스 및 로고 제작
• 일러스트를 이용한 필요한 소스제작
• 애플리케이션 컨셉 및 UI 디자인

2) 메인페이지

• 레이아웃 설정 및 UI 디자인
• 컨텐츠 기획

3) 모달창

• Modal template 계획
  • 로그인/로그아웃 기능
  • 모달창 라우터 관리
  • O-auth [Github] setting
• 로그인/비로그인에 따른 Application authorization 구분

4) 게시판

• 게시판 UI 설계
• 게시물 생성 및 게시판 컴포넌트 계획
• 방정보에서 참여 및 등록, 댓글 기능
• 컨텐츠 이용 시 회원 아이디 체크 [사용자가 계정관리에서 회원양식을 맞추지 않았을 시 이용제한]
• 사용자의 게시물 참여 여부에 따른 반응 계획
• 카테고리(Project, Study, Question)에 따른 기능 분리
• CKeditor을 이용한 게시물 생성 계획
• 게시물 생성 시 카테고리에 따른 양식 폼 계획 및 필수 양식을등록하지 않았을 경우 알람 출력
• Question 카테고리 이용 시 사용자 익명성 기능구연 [질문 전용아이디 발급 및 출력]

5) 마이페이지

• 마이페이지
  • UI 디자인
  • 기능 컨셉 계획
• 계정관리
  • 계정관리 양식 폼 및 UI, 기능 계획
  • 스택 선택부분 디자인 및 계획
  • 사용자 아이디 생성 시 양식에 맞춰 입력 유도 [양식에 맞지않을 경우 앱 사용기능 제한]
• 히스토리
  • UI 계획, 기능 컨셉 및 컴포넌트 설계
  • 회고 작성 및 출력 기능 계획
• 마이페이지 utils 관리

• 
• Role : Team Member
• Position : Front-end
• Stack : React, Hooks, React Router Dom,Axios, Email.js
• Works :

1) 메인페이지

• 메인페이지 UI 설계
• 메인페이지 섹션 설계
• 검색 필터 기능 구현(게시물 유형, 인원수, 검색어 필터링)

2) 마이 페이지

• 사용자 프로필 UI 설계(사용자명, 기분상태, 관심 스택)
• 사용자 참여 게시물 UI 설계(열린 게시물, 닫힌 게시물 필터링)

3) 회고 관리 페이지

• 사용자 회고 작성 & 회고 기록 UI 설계와 조회, 삭제 기능 구현
• 회고 기록 Email 보내기 기능 구현(원하는 이메일로 회고기록 전송 가능)

4) 게시물 정보 페이지

• 게시물 정보 UI 설계(사이드바에서 게시물 유형 필터링 가능, 게시물제목, 사용스택 등등..)
• 게시물 댓글 기능 구현

5) 계정 관리 페이지

• 사용자 계정 수정 폼 UI 설계
• 사용자 정보 수정 기능(사용자명, 성향, 기분상태, 관심스택 등등...)

• 
• Role : Team Member
• Position : Back-end
• Stack :
  • Server : Node.js(Express), TypeScript
  • Database : MYSQL
  • ORM : TypeORM
  • Auth : oAuth(Google, Github)
  • Deploy : AWS S3, CloudFront
• Works :

[Server]

1) 개발환경 구축을 위한 기본 서버 setting

• Typescript Config, Typeorm Config 작성
• Route 분기 처리

2) Typeorm을 통한 스키마디자인에 따른 JoinTable 작성 및 교차 데이터 호출을 위한 로직 작성

• Post - Comment 간 관계 설정, JoinTable생성
• Post - User간 관계 설정과 JoinTable 생성

3) Typeorm을 통한 MVC패턴의 Models에 해당하는 entity 및 static 커스텀 메소드 작성

• Post

  전체 게시물 조회, 유저별 게시글 데이터 조회, 작성자와 유저가 동일할 때 게시글 종료 기능, JoinTable 데이터조회, 게시글 고유번호에 따른 조회, 해당 게시글 참가 유저의 요청 시 JoinTable에서 데이터 삭제 기능, 게시글 작성 기능

• Comment

  전체 댓글 조회, 게시물 별 댓글 조회, 댓글 작성 기능, 댓글 삭제 기능, 유저-게시글 JoinTable 데이터조회, 유저별 댓글 조회 기능

4)Typescript 기반 MVC 패턴을 이용한 Controller 비지니스 로직 작성

• OAuth - 깃허브 oauth / google oauth 로그인
• Search - 카테고리, 인원, 타이틀을 통한 검색
• Comment - 게시글 내, 댓글 작성, 조회, 삭제 구현(CRD)
• Posts - 게시글 작성, 조회, 삭제 구현(CRD)
• Profile - 로그인/로그아웃시 세션 부여 및 세션 삭제 기능

[DevOps]

5) AWS 기반 S3, Route53, CloudFront를 이용한 배포

• 
• Role : Team member
• Position : Backend
• Stack :
  • Server : Node.js(Express), TypeScript
  • Database : MYSQL
  • ORM : TypeORM
  • Deploy : AWS EC2, RDS, ELB, ACM, Route53
• Works :

[Server]

1) 세션 기반 서버 기초 설계, module선정과 설치, Routes 작성

2) 서버 MVC로직 설계, TypeORM으로 Entity, Static Method 및 Controller작성

• User : 정보 조회, 이메일 확인, 프로필 변경, 회원가입 로직, Post와 N:N관계 연결
• Diary : 회고록 작성, 해당 게시물 회고록 조회, 회고록 삭제, 유저 또는 게시물과 join맺기
• Post : 신청 게시물과 유저 join table연결 맺기

3) 프로젝트, 스터디 참여 신청 로직 작성

• 프로젝트 신청시 해당하는 포지션 인원 수 만큼을 빼고 DB에 입력
• 스터디 신청시 전체 인원 수에서 빼고 DB에 입력
• 프로젝트 포지션 인원이 0 또는 스터디 총 인원이 0이 될 때 게시물 닫히는 로직

4) node-schedule을 활용한 로직 작성

• 게시물 생성 후 7일이 지난 게시물은 자동으로 닫히는 로직

[DevOps]

• Route53 도메인 구입 및 https통신을 위해 ACM으로 SSL 인증서 취득
• ELB와 EC2, RDS 배포 및 에러 핸들링
• CloudFront를 활용한 S3, Route53 연결 및 에러핸들링

[SR]

• Miro를 활용한 Client Workflow, Server Endpoint 작성
• PowerPoint로 Stack이미지 작성
• Cloudcraft로 Deployflow 이미지 작성