• 카테고리

    질문 & 답변
  • 세부 분야

    취업 · 이직

  • 해결 여부

    미해결

페이지 클론코딩 관련 질문드립니다

22.01.06 11:03 작성 조회수 537

1

안녕하십니까 선생님.

올려주신 강의들 차근차근 따라가면서 학습 중에 있습니다.

와중에 클론코딩과 관련하여 궁금증이 생겨 질문드리게 되었습니다.

 

페이지 레이아웃이나 위젯부분을 조금 전체적인 측면에서 학습해보고자

강의 외에 전체 페이지를 조금씩 클론코딩 해보고 있습니다.

화면에 나타난 상태를 보고 역으로 와이어프레임을 구성하고

구조를 짜서 이미지 등을 입히는 식으로 진행하고 있는데요,

요소들의 세부적인 위치나 크기 등을 조절할 때 

원래 페이지에서 사용한 것과의 기술적인 차이로 인한 오차가 조금씩 발생합니다.

가령 저는 네비게이션 메뉴 바를 보고 flex 방식으로 비율을 나누어 배치를 해보았는데

원 페이지는 position이나 float를 이용한 상황이라든지,

폰트 사이즈나 마진 패딩의 적용 방식에 차이가 난다든지 하는 식입니다.

최대한 원본의 구성과 동일하게 보이도록 조절하고는 있습니다만

1~2픽셀 단위까지 신경쓰며 배치를 하려다 보니 다른 부분에 신경을 쓰지 못하고

세부 배치에 지나치게 많은 시간이 들어가는 것 같아 방향성을 잡고 싶습니다.

 

그래서 최종적인 결과물로서의 클론코딩 페이지를 평가하시는 측면에서는

원본 페이지를 클론코딩으로 잘 구현했는지 아닌지의 판단을 어떻게 하시는지 궁금합니다. 

브라우저에 보여지는 화면이 정확하게 일치하는 정도까지 동일하게 구현을 해야하는 것인지,

그렇다면 조금 다른 방식으로 구현하는 것을 포기하고 기술적인 부분까지 원래 페이지를 따라야 하는 것인지 말씀을 듣고싶습니다.

 

지금 잠깐잠깐 학습하는 단계에서는 사실 신경쓰지 않아도 될 부분인 것 같기는 하나

차후 포트폴리오에 클론코딩 사이트를 첨부하게될 때 결국 동일한 궁금증이 생길 것 같아 미리 질문 드립니다.

 

항상 좋은 강의 진행해주는 점 다시 한번 감사드립니다.

답변 1

답변을 작성해보세요.

2

클론코딩이라는건.. 할만한 또는 괜찮은 UI 디자인과 레이아웃을 가진 웹사이트를 똑같이 만드는 것 입니다.

완전히 똑같이 만드는게 목적이 아니라 어느 정도 비슷하게 만들면서 전체적인 html 구조, 레이아웃에 대한 이해도를 높이는게 목적입니다. 물론, 클론코딩으로 결과물을 만들기 위해서 CSS 실력이 당연히 수반되어야 합니다.

클론코딩의 목적은 결과물을 똑같이 만드는게 아니라... 만드는 과정에서 내가 부족한 부분이 무엇인지... 이런 문제를 어떻게 해결하는지... 이러면서 말그대로 퍼블리싱 실력이 향상됩니다. 

그리고 클론코딩이라고 해서 타겟 웹사이트가 만든 html, css를 똑같이 하는게 아닙니다. 최종 결과물을 최대한 비슷하게 만들지만 제작자의 방식에 따라 만드시면 됩니다. 예를들어 타켓 사이트는 Flexbox로 되어 있지만 float와 position을 사용한 기존방식으로 제작할 수도 있고 또는 Grid로 제작할 수도 있습니다.

클론코딩의 목적은 퍼블리싱 실력을 높이면서 문제 해결 능력을 키우게 목적입니다. 똑같이 만들지 않아도 상관 없습니다.

유지원님의 프로필

유지원

질문자

2022.01.07

말씀 감사합니다. 실력 향상에 도움이 되는 부분에 집중해서 활용해나가겠습니다.