/Idus_cloneCoding

Primary LanguageHTML

Idus_cloneCoding

url : https://yws1502.github.io/Idus_cloneCoding/

Team Member

  • 김만학, 김진권, 이승연, 윤우상

프로젝트 소개

  • gitflow를 따른 현업을 통해 맞춤 작품 구매 사이트 아이디어스의 주요 기능 및 UI 등 구현

주요 기능

  • 로그인, 회원가입 (추후 기능 추가)
  • 장바구니 담기 (추후 기능 추가)

디렉토리 구조

├─detailPages
├─images
│  ├─icons
│  └─image
├─js
│  ├─main
│  └─product-detail
└─style
    ├─common
    ├─main-page
    ├─my-info
    ├─product_detail
    ├─register
    └─shopping

기술 스텍

FrontEnd

  • JavaScript(ES6)
  • CSS(Scss)
  • HTML

BackEnd (추후 기능 추가)

  • NodeJs
  • Express

멤버 소개 및 맡은 파트

  1. 김만학

맡은 파트

  • 메인 풋터, 장바구니 페이지

회고

  • 협업툴로써의 Git에 대한 이해도가 높아지고, HTML+CSS 코드에 한층 더 익숙해질 수 있었습니다. 또한 처음으로 JavaScript를 활용하여 웹을 제어해보아 좋았습니다. 완벽하진 않더라도 팀원들과 협업하여 목표한 결과물을 얻어가는 과정이 즐거웠습니다.

새로 배운 점

  • CSS와 JavaScript를 고려한 HTML markup
  • SCSS 및 HTML, CSS 문법 숙지
  • JavaSciprt를 활용한 이벤트 객체 제어
  1. 김진권

맡은 파트

  • 메인 상품목록, 내 정보

회고

  • 완벽하진 않지만 실제로 서비스되고 있는 웹페이지의 UI를 거의 대부분 클론해보았습니다. 프로젝트를 통해 마크업과 CSS에 자신감이 생겼습니다. 하지만 마크업 과정에서 적절한 클래스명을 선정하는 것이 어려웠고 연습이 필요하다고 생각했습니다.

새로 배운 점

  • css 가상셀렉터 활용
  • Git을 통해 branch를 나눠서 작업하고 pull request를 하는 방법, develop branch와 개인 작업 브랜치가 충돌할 때 해결하는 방법.
  • SASS을 이용하여 css파일을 생성하는 법.
  1. 이승연

맡은 파트

  • 메인 실시간 리뷰 목록, 상품 디테일 페이지

회고

  • 처음으로 팀프로젝트를 하면서 git에 대해서도 배울 수 있었고 같이 하면서 새로 배웠던 부분을 코드리뷰도 하면서 같이 알 수 있어서 뜻깊은 시간이었습니다. html 태그를 알맞게 사용해야 하고 마크업과 css를 하면서 다양한 시도를 해볼 수 있어서 좋았습니다. git을 많이 알려준 팀원에게 감사합니다!

새로 배운 점

  • scss를 활용한 점
  • git 을 사용해 branch를 생성 merge, pull 등을 하는 방법
  • 적응형 웹과 반응형 웹의 차이점
  1. 윤우상

맡은 파트

  • 메인 헤더, 로그인, 회원가입 페이지

회고

  • 프로젝트를 진행하면서 노션과 깃을 이용해 팀원들과의 협업을 경험할 수 있었으며 깃에 대한 이해가 깊어졌습니다. 클론을 하며 클래스 명을 명시 적으로 지어주는 것과 자바스크립트에 대한 이해도가 부족하다는 점을 발견했으며 시멘틱한 마크업을 위해 많은 고민을 해야겠다는 생각을 할 수 있었습니다.

새로 배운 점

  • 자바스크립트를 활용한 Dom 컨트롤
  • Scss의 mixin, include 기능 활용
  • Gitflow를 따른 협업