실습

[1차 프로젝트] #3 로그인 폼 (코드 펜 디자인 가져오기)

원코딩 2022. 8. 7. 12:34

 

 

 

 

 

 

로그인 폼 출력화면이다. 

 

 

디자인은 코드펜 홈페이지를 이용했다! 

 

 

 

https://codepen.io/suez/pen/RpNXOR

 

Login/Registration Form Transition

Based on Dribbble shot by Barbara Morrigan - https://dribbble.com/shots/3306190-Login-Registration-form...

codepen.io

 

 

 

1.

해당 사이트에 들어가서 

소스를 가져온 다음에

프로젝트 파일에 옮긴다! 

 

 

 

 

2.

사이트에 방문해보면 알겠지만

상당히 동적인 기능이 많이 들어가있다. 

모든 액션에 대해 이해하지 못해서

과감히

script.js

style.scss

파일은 삭제했다. 

 

만약 해당 해당 파일을 삭제했을 때

화면이 깨진다면, 

삭제한 파일을 참조하는 디자인이 있는지 확인 후 

참조하는 부분을 전부 지워야 한다. 

 

소스를 지웠는데도 

화면이 깨진다면...

파일을 삭제하지 말고 그냥 가지고 있자!

 

 

 

3.

프로젝트 파일에서 

경로를 잘 지정한 후 

include 또는 sendredirect

시켜주자. 

 

 

 

4.

웹에 출력했을 때

원하는 화면대로 출력된다면 

성공이다!