피그마를 이용한 디자인 작업을 모바일 코딩으로 작업하는 튜토리얼 영상입니다. 모바일 전용 코딩으로 피시부분이나 구 브라우저는 신경쓰지 않고 작업하였습니다.
Code Youtube
Code Reference
소스는 여기서 다운 받을 수 있습니다. 바로가기
완성된 예제는 여기서 확인 할 수 있습니다. 바로가기
데스크탑용 깃헙 다운받기 바로가기
비쥬얼 스튜디오 코드 다운 받기 바로가기
Code example
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="author" content="webstoryboy">
<meta name="description" content="뮤직 모바일 메인에서 다양한 정보와 유용한 컨텐츠를 만나 보세요">
<meta name="keywords" content="듣기, 2019년 최고의 음악 100선, Apple Music">
<title>Apple Music App</title>
<!-- meta -->
<meta name="format-detection" content="telephone=no">
<meta property="og:title" content="뮤직 모바일 메인">
<meta property="og:url" content="https://webstoryboy.github.io/apple">
<meta property="og:image" content="https://webstoryboy.github.io/apple/assets/icon/icon.jpg">
<meta property="og:description" content="뮤직 모바일 메인에서 다양한 정보와 유용한 컨텐츠를 만나 보세요">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="뮤직 모바일 메인">
<meta name="twitter:url" content="https://webstoryboy.github.io/apple">
<meta name="twitter:image" content="https://webstoryboy.github.io/apple/assets/icon/icon.jpg">
<meta name="twitter:description" content="뮤직 모바일 메인에서 다양한 정보와 유용한 컨텐츠를 만나 보세요">
<!-- icon -->
<link rel="apple-touch-icon-precomposed" href="https://webstoryboy.github.io/apple/assets/icon/icon.jpg">
<link rel="apple-touch-icon-precomposed" sizes="96x96" href="https://webstoryboy.github.io/apple/assets/icon/icon_96.jpg">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="https://webstoryboy.github.io/apple/assets/icon/icon_144.jpg">
<link rel="apple-touch-icon-precomposed" sizes="192x192" href="https://webstoryboy.github.io/apple/assets/icon/icon_192.jpg">
<!-- style -->
<link rel="stylesheet" href="assets/css/reset.css">
<link rel="stylesheet" href="assets/css/fonts.css">
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body>
</body>
</html>728x90
