모사 코딩

모사하는 사이트

FaceBook 로그인 화면
htps //w w. 후세보오 k. 코m/

작성 시간

그 1:3시간
그 2:5시간 반
총: 8시간 반

환경 구축

・Google Chrome(브라우저)
・Visual Studio Code(코드 에디터)

모사하는 규칙 (인용)

1. 문자의 copipe는 OK
2. 폰트의 종류는 무엇이든 OK
3. 약간의 차이는 OK
4. 배경 이미지도 넣는다
5. 모퉁이 원이나 폰트의 크기도 가까운 것으로 한다
6. 반응형 디자인에도 대응

진척

도중에 형태가 된 것이,
미세한 곳의 레이아웃이 다르다.
(특히 padding과 margin)
꽤 타협하지 못하고 시간이 걸렸다.

이번 모사를 통해

margin의 상쇄에 대한 이해가 얕았다.
margin은 계산하면서 붙이도록 해 간다.
margin이나 padding이 어떤 값이 더 정확한지를 찾는데도 개발자 도구가 중요하다는 것을 알았다.

이미지에서 컬러 코드를 계산하는 다음 사이트는 매우 편리합니다.
모사하고 싶은 사이트를 스쿠쇼해 사이트내에 붙이는 것만.
htps : /// b. synse r. jp / 토오 l / 이마 게코 ぉ r 피 c 케 r /

다음 번

아직 세세한 곳의 스타일이 맞지 않기 때문에 거기에서 시작
(cursor나 전 사이트에서 링크가 되어 있는 부분)

Javascript를 사용하여 새 계정 만들기를 클릭하면 모달 창으로 계정 만들기 화면을 표시합니다.
(position이나 translate에 대해서 도트 인스톨로 복습하면서)

필수 입력 사항의 에러를 내는 방법과 정규 표현의 입력을 한다.

반응형 디자인에 대한 대응은 후회.
이상

더 부드럽게 코드를 작성할 수 싶어요. . .