[start project] 연락처 앱 마크업하기 - 4. 정리

[start project] 연락처 앱 마크업하기 - 1. 화면 설계

[start project] 연락처 앱 마크업하기 - 2. 메인화면

[start project] 연락처 앱 마크업하기 - 3. 상세화면

[start project] 연락처 앱 마크업하기 - 4. 정리

 

연락처 앱의 간단한 화면들을 만들어보며

margin, flex, hover, border-radius... 등등 여러 css 속성들을 써보았고

fontawsome 이라는 아이콘 라이브러리도 써보았다.

 

나는 마크업을 전문적으로 배운 사람은 아니다....

야매로 익힌 것들이지만, 누군가에게는 도움이 되었으면 좋겠어서 적어봤다.

그러니 '실무에선 저렇게 안 쓰는데?!' 라며 돌을 던지지는 말고 .... ㅎㅎ

 

다들 우스갯소리로 웹 프로그래머,특히 퍼블리셔(마크업)는 프로그래머가 아니라고 한다.

그렇지만 퍼블리싱, 마크업은 절대 쉬운 작업이 아니다.

html 의 구조를 어떻게 짜야 할지, css 를 어떻게 적용해야 할지를 생각해야 하고

예상과 다르게 움직이는 html 요소들을 보며 식은땀을 흘리기도 한다........

여기에 반응형과 애니메이션까지 넣는다면 머리 터진다.

 

하지만 내가 한 만큼 눈에 확연히 보이는 결과물이 있다는 것은 보람을 배로 느끼게 하는 요소다.

사실 난 쿼리짜고 로직짜는 거보다 화면 하나 그린 게 더 뿌듯하다...ㅋㅋ

 

여기선 안 다뤘는데, 참고로 구글에 button css, ul css, selecbox css 등등을 검색하면 사람들이 만든 오픈소스를 활용할 수도 있다.

또 잘 찾아보면 UI 라이브러리들도 많이 있으니... html 설계부터 반응형, 애니메이션까지 처음부터 하나하나 다~ 만들어야되냐고 불평하지 않아도 된다. (부트스트랩이라던가... metrial ui 라던가..)

 

어쨌든, 이 start project 를 발판삼아 더 멋진 웹을 마크업해보길 바란다.