• -
  • -

코리아IT아카데미

직영점만의 특별함! 높은 취업률을 자랑하는 코리아IT아카데미학원

아카데미소개 자세히 보기
아카데미소개

코리아IT아카데미의 모든 국비지원 과정은 NCS를 준수합니다.

국비지원 교육과정 보기
국비지원과정

코리아IT아카데미만의 높은 취업률! 우수 취업 프로그램을 소개합니다.

취업프로그램 자세히 보기
취업지원센터

내게 맞는 전공분야와 취업까지 한번에! 전문가가 1:1로 상담해 드립니다.

온라인 상담신청
고객상담센터

코리아IT아카데미 수강생들의 프로젝트를 소개합니다.

내게 맞는 교육과정 찾기
프로젝트
수강료 조회하기

Project프로젝트

코리아IT아카데미의 수강생들의 프로젝트를 소개합니다.
제목 애견인 커뮤니티 윗독(WithDog)
작성일 2022.06.15 조회수 3709

코리아IT아카데미 프로젝트

애견인 커뮤니티 윗독(WithDog)

과정명
프론트엔드(웹) 과정
발표일
2022.06.08
담당강사
김용희 강사님
팀원 & 담당파트
김소희
김혜연
서형원
 
컨셉

전국 애견인들이 강아지와 함께 하는 일상을 공유하고, 다양한 애견 관련 정보를 얻어갈 수 있는 종합 커뮤니티

기능

※ Auth
- 파이어베이스를 활용한 로그인, 로그아웃, 회원가입, 회원정보 관리 기능
- 로그인, 회원가입 유효성 검사 기능 (ex. 비밀번호가 틀렸습니다. 올바른 형식의 이메일을 입력하세요.)
- 개인정보 수정, 본인이 쓴 게시물 모아보기 기능(MyPage)
- 도로명 주소 API를 이용한 간편한 주소 입력 기능 (회원가입, MyPage)
- 로그인/로그아웃 전후 출력 페이지 다르게 설정(INFO, Doggitter 글쓰기 등)
- 로그인/로그아웃 전후 사용 기능 다르게 설정 (아바타 버튼 클릭 시 - 로그인 전에는 로그인, 회원가입 / 로그인 후에는 마이프로필, 로그아웃)

※ Design
- 테마 컬러 설정 : primary : 오렌지 secondary : 블랙.
각 메인 테마 컬러 별 main, light, dark 색상 별도 설정으로 조화롭게 컬러 배치
- 메인 컨셉 설정 : 심플 + 친근함
- 가독성 좋은 메인화면, 각 요소를 개별 컴포넌트로 구성 (배너 + 소개 + 반려견칼럼 + 애견핫플레이스 +광고 배너)
- 모든 페이지 반응형 (PC, 태블릿, 모바일 호환)
- 네비바 반응형 (모바일 환경으로 접속시 메뉴가 리스트아이콘으로 축소됨)
- 로그인 시 네비바 아바타에 사용자 이름 출력 (로그아웃 상태에서는 랜덤 강아지 사진)
- 로그인/메인화면 재접속 시 배너 이미지 랜덤으로 출력 (총 7개의 강아지 이미지)
- 전 페이지에 스크롤 업 버튼 추가(숨겨져 있다가 화면을 일정 길이만큼 내리면 자동으로 생성됨)

※ Doggitter(CRUD)
- 아바타 + 사진 + 제목 + 내용 + 좋아요 + 댓글기능 등 SNS 기본 기능 모두 탑재
- 게시글 작성하기 : 제목, 내용, 이미지 첨부파일 입력시 리스트에 게시물 추가
- 게시글 수정, 삭제 : 본인 게시글 Edit, Delete 가능 (타인 게시글 불가)
- 좋아요 : ID당 한 개만 가능. 자동 카운트
- 코멘트 : 각 게시글별 코멘트 작성 가능. 본인 코멘트일 경우에만 삭제 가능

※ Dog MBTI(심리테스트)
- 문항, 문답, 이미지를 개별 파일에 있는 배열, 객체로 저장한 후 페이지에서 불러와서 보여주는 기능
- 각 문항별로 할당된 점수를 카운트한 후, 최종 점수에 따라 16가지의 각각 다른 결과값과 이미지 도출
- 진행 상황에 따라 바뀌는 프로그레스 바 구현
- 테스트 페이지별 썸네일, 결과 내용이 함께 나오는 카카오톡 공유하기 기능

※ INFO(지도 API)
- 회원가입 시 입력한 주소 정보를 기반으로, 내 근처에 있는 강아지 산책 가능 공원을 확인하는 기능
- 지도에 주변 산책 가능 공원이 마크됨
- 지도 옆에는 공원 이름, 정보, 위치, 전화번호가 표시된 텍스트 리스트가 있어 간편하게 정보 파악 가능
- 스크롤 시 지도 확대,축소 기능을 on/off 할 수 있는 버튼
- 회원가입 시 입력한 주소뿐만 아니라, 직접 위치정보를 입력하는 방식으로도 검색 가능
- 회원 정보 변경시 자동으로 지도 업데이트 됨

※ 기타
- 이미지, 사이트 정보 등 Meta OG 태그 들어가있어 SNS 공유시 사람들의 흥미를 끌 수 있음

특장점

- 간편한 회원가입, 로그인만으로 쉽게 SNS 활동을 할 수 있음.
- 게시글 업로드, 코멘트, 좋아요 기능으로 사람들과 소통 가능
- 사람들의 흥미를 끌 수 있는 심리테스트 페이지와 카카오톡 공유하기 기능이 구현되어 있어, 사이트 홍보 효율적으로 가능
- 클릭 한 번으로 강아지 산책 공원 정보를 한 눈에 확인할 수 있음.
- 웹뿐만 아니라 모바일에서도 가독성이 좋은 반응형 홈페이지
- 색깔, 디자인 컨셉이 잘 잡혀있는 홈페이지

사용기술 및 개발환경

- 개발환경 :  PC
개발도구 : VSC
개발언어 및 프레임워크 : HTML, CSS, javascript, REACT
API : 다음 지도 API, 다음 주소(도로명) API

의류 쇼핑몰 고객 응대 챗봇
2022.08.11

롯데월드 어드벤처
2022.08.08

OOLOL.PS
2022.07.29

Deep Learning을 활용한 유방암 표적화 모델
2022.07.28

우리아토(WOORIATO)
2022.07.22

No Product 패션 멀티 쇼핑몰
2022.07.08

Last Fresh
2022.07.06

누구나 작가가 되어 컨텐츠를 제작할 수 있다. / stelling
2022.07.06

Project FG (FG Mall)
2022.06.23

애견인 커뮤니티 윗독(WithDog)
2022.06.15

Shopping
2022.06.14

공연 예매 사이트 , Freddo
2022.06.10

빠른수강료조회 빠르고 간편하게 관심있는 교육과정의 수강료를 조회할 수 있습니다.

학과선택 희망하시는 학과를 선택해 주세요.
  • 코리아IT
    SIGNATURE

  • 코딩과정

  • 방학
    특강과정

  • 국비
    교육과정

  • 취업
    정규과정

  • 자격증
    취득과정

  • 단과과정

    시그니처 과정 다른학과 희망 시 위 학과선택에서 클릭해 주세요.
    국비 교육과정 다른학과 희망 시 위 학과선택에서 클릭해 주세요.
    취업 정규과정 다른학과 희망 시 위 학과선택에서 클릭해 주세요.
    자격증 취득과정 다른학과 희망 시 위 학과선택에서 클릭해 주세요.
    단과 과정 다른학과 희망 시 위 학과선택에서 클릭해 주세요.
    방학특강 과정조회 다른학과 희망 시 위 학과선택에서 클릭해 주세요.
    부산지점 특화과정 다른학과 희망 시 위 학과선택에서 클릭해 주세요.
    코딩과정 다른학과 희망 시 위 학과선택에서 클릭해 주세요.
기타과목
15자 이내로 입력해 주시기 바랍니다.
과목 입력 후 엔터키를 눌러주세요.
희망 교육과정

    희망하시는 교육과정을 선택해 주세요.

      지점 선택
        신청자
        이름
        핸드폰
        - -
        개인정보 동의

        개인정보처리방침

        코리아IT아카데미의 개인정보처리방침은 다음과 같은 내용을 담고 있습니다.
        가. 수집하는 개인정보 항목 및 수집방법
        나. 개인정보의 수집 및 이용목적
        다. 수집한 개인정보의 보유 및 이용기간
        라. 동의를 거부할 권리가 있다는 사실과 동의 거부에 따른 불이익 내용

        가.수집하는 개인정보 항목 및 수집방법
        코리아IT아카데미는 고객님의 온라인상담류(온라인상담신청, 수강료조회,내일배움카드제(계좌제)조회, 고용보험환급,재직자국비과정조회, 시간표조회, 지점별위치조회, 위탁교육문의)을 위해 개인정보를 아래와 같이 수집하고 있습니다.
        - [필수]이름, 핸드폰

        코리아IT아카데미는 다음과 같은 방법으로 개인정보를 수집합니다.
        - 홈페이지 내 수강가이드(온라인상담신청, 수강료조회,내일배움카드제(계좌제)조회, 고용보험환급, 재직자국비과정조회, 시간표조회, 지점별위치조회, 위탁교육문의)를 통해 개인정보를 수집하고 있습니다.

        나.개인정보 수집 및 이용목적
        코리아IT아카데미는 수집한 개인정보를 다음의 목적을 위해 활용합니다.
        - 과정문의에 대한 학과담당자들의 전화 및 이메일 상담

        다.수집한 개인정보의 보유 및 이용기간
        모든 검토가 완료된 후 5년간 이용자의 조회를 위하여 보관하며, 이 후 해당정보를 지체없이 파기합니다.

        라. 동의를 거부할 권리가 있다는 사실과 동의 거부에 따른 불이익 내용
        이용자는 코리아IT아카데미 홈페이지에서 수집하는 개인정보에 대해 동의를 거부할 권리가 있으며 동의 거부 시에는 회원가입 및 인터넷 수강료 조회, 온라인 상담 등의 홈페이지 서비스가 일부 제한 됩니다.
        • 대표자 : 김현 개인정보책임자 : 안혁환
        • 교육담당: 김학훈 실장
        • Email : koreais@koreaedugroup.com
        • 사업자번호 : 325-88-00678
        • 통신판매업번호 : 2015 - 서울강남 - 03148호
        • 학원등록번호 : 제02201700141호

        전국지점안내

        • 강남점 1관 : 서울특별시 강남구 테헤란로 146 현익빌딩 3층,4층
        • 강남점 2관 : 서울특별시 강남구 테헤란로 26길 12 제일비전타워 13층
        • 신촌점 : 서울특별시 마포구 서강로 136 아이비티워 2층,3층
        • 대구점 : 대구광역시 중구 중앙대로 366 반월센트럴타워 9층,10층
        • 부산점 : 부산광역시 부산진구 중앙대로 668, 에이원프라자 4층
        • 인천점 : 인천광역시 부평구 시장로7 M.H빌딩 5층
        • 대전점 : 대전광역시 서구 둔산로52 미라클빌딩 3층
        copyright © 2015 KOREA INFORMATION TECHNOLOGY ACADEMY. ALL RIGHTS RESERVED 대표문의 : 02-313-2185 Fax: 02-313-0516