Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
27 commits
Select commit Hold shift + click to select a range
d66c15f
[#M1] feat : index파일 구조 셋팅
hyeyoonS May 21, 2024
0b9db72
[#M1] feat : reset.css파일 셋팅, index.css 파일 생성
hyeyoonS May 21, 2024
8a7e62d
[#M1] feat : palette에 있는 color값들을 css 변수로 등록하기
hyeyoonS May 21, 2024
3e0cd07
[#M1] chore : reset.css 오탈자 수정, 속성 일부 변경
hyeyoonS May 21, 2024
c7a8c41
[#M1] feat : index.html 헤더까지 틀 만들기
hyeyoonS May 21, 2024
9902e94
[#M1] style: index.css 헤더까지 CSS속성 적용
hyeyoonS May 21, 2024
241b736
[#M1] feat : a태그 사용을 위한 페이지 생성
hyeyoonS May 21, 2024
f33e0da
[#M1] style: 헤더의 전체 배경색과 컨텐츠 너비 조절을 위한 속성 추가
hyeyoonS May 22, 2024
c06bd44
[#M1] chore : 이미지, svg 파일 추가
hyeyoonS May 22, 2024
5414338
[#M1] feat : footer 완성
hyeyoonS May 22, 2024
6c81513
[#M1] feat : 세부컨텐츠 정렬 수정
hyeyoonS May 22, 2024
412cd12
[#M1] style : CSS속성 수정, 가독성 고려해서 정렬
hyeyoonS May 23, 2024
ee18e29
[M1] feat : 바텀헤더 추가
hyeyoonS May 23, 2024
893759e
[#M1] feat : section에 badge 추가
hyeyoonS May 23, 2024
3a21352
[#M1] style : 피그마 시안과 동일하게 스타일 수정
hyeyoonS May 23, 2024
4151a53
[#M1] chore : 링크 경로 수정
hyeyoonS May 23, 2024
09d2a0d
[#M1] chore : 잘못된 경로 수정, 사용하지 않는 코드 제거
hyeyoonS May 23, 2024
6feb07a
[#M1] feat : 구글 애널리틱스 스크립트 코드 추가
hyeyoonS May 23, 2024
9a98251
[#M1] fix : sns로고는 클릭시 새로운 페이지로 이동하도록 수정
hyeyoonS May 23, 2024
26a163a
[#M1] fix : 클래스 규칙에 맞게 수정, main 컨테이너의 css수정
hyeyoonS May 23, 2024
9e31576
Merge pull request #1 from hyeyoonS/풀스택-FE-mission1
hyeyoonS May 25, 2024
42799c5
[#M2] chore : icon추가
hyeyoonS May 28, 2024
ce32ba0
[#M2] feat : signin 레이아웃 완성
hyeyoonS May 28, 2024
c8f483a
[#M2] style : signin CSS속성 적용
hyeyoonS May 28, 2024
36e6779
[#M2] feat : signup 레이아웃, CSS속성
hyeyoonS May 28, 2024
f50cffd
[#M2] style : 폼 중앙정렬 되도록 flex-start삭제
hyeyoonS May 28, 2024
7302e2e
[#M2] chore : 오탈자 수정
hyeyoonS May 28, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
199 changes: 199 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,199 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="keyword" content="pandamarket, 판다마켓, codeit, 코드잇" />
<meta property="og:title" content="PandaMarket" />
<meta
property="og:description"
content="일상의 모든 물건을 거래해 보세요"
/>

<title>판다마켓</title>
<link
rel="stylesheet"
type="text/css"
href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css"
/>
Comment on lines +14 to +18
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

웹폰트를 불러오는 방법을 선택했는데 성능상 이 방식은 지양하는게 좋다고 하네요! 🥲

<link rel="stylesheet" href="/src/style/reset.css" />
<link rel="stylesheet" href="/src/style/index.css" type="text/css" />

<script
async
src="https://www.googletagmanager.com/gtag/js?id=G-CVD8CL1E38"
></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag("js", new Date());

gtag("config", "G-CVD8CL1E38");
</script>
</head>
<body>
<nav class="header_nav" role="navigation">
<a href="/">
<img
src="src/assets/svg/Logo-Large.svg"
alt="판다마켓로고"
class="navLogo"
/>
</a>
<div class="header_category">
<a class="category_btn" href="/">자유게시판</a>
<a class="category_btn" href="/">중고마켓</a>
</div>
<a class="login_btn" href="/pages/signin.html">로그인</a>
</nav>
<header class="header_section">
<div class="header_container">
<div class="header_wrapper">
<h1 class="header_title">
일상의 모든 물건을<br />
거래해보세요
</h1>
<a href="/pages/items.html" class="header_btn">구경하러가기 </a>
</div>
<div class="header_img_container">
<img
src="src/assets/image/header-content-image.png"
alt="헤더 이미지"
width="996"
height="417"
/>
</div>
</div>
</header>

<main id="main">
<section class="section_container_left">
<div class="section_wrapper">
<img
src="/src/assets/image/home_01-image.png"
alt="link_save_img"
class="section_img"
/>
<div class="text_content_right">
<div class="section_badge">Hot item</div>
<span class="section_title">
인기 상품을
<br />
확인해보세요
</span>
<p class="section_summary">
가장 HOT한 중고거래 물품을
<br />
판다 마켓에서 확인해 보세요
</p>
</div>
</div>
</section>

<section class="section_container_right">
<div class="section_wrapper">
<div class="text_content_left">
<div class="section_badge">Search</div>
<span class="section_title">
구매를 원하는
<br />
상품을 검색하세요
</span>
<p class="section_summary">
구매하고 싶은 물품은 검색해서
<br />
쉽게 찾아보세요
</p>
</div>
<img
src="/src/assets/image/home_02-image.png"
alt="folder_name_modify_img"
class="section_img"
/>
</div>
</section>

<section class="section_container_left">
<div class="section_wrapper">
<img
src="/src/assets/image/home_03-image.png"
alt="social_media_share_img"
class="section_img"
/>
<div class="text_content_right">
<div class="section_badge">Register</div>
<span class="section_title">
판매를 원하는
<br />
상품을 등록하세요
</span>
<p class="section_summary">
어떤 물건이든 판매하고 싶은 상품을
<br />
쉽게 등록하세요
</p>
</div>
</div>
</section>
</main>
<section class="bottom_header_section">
<div class="header_container">
<div class="header_wrapper">
<h1 class="header_title">
믿을 수 있는<br />
판다마켓 중고거래
</h1>
</div>
<div class="bottom_header_img_container">
<img
src="src/assets/image/home_bottom-iamge.png"
alt="바텀헤더 이미지"
width="996"
height="540"
/>
</div>
</div>
</section>
<footer>
<div class="footer_wrapper">
<span class="copyright"> ©codeit - 2024 </span>
<div class="explain">
<a href="/pages/privacy.html" class="footer_link">Privacy Policy</a>
<a href="/pages/faq.html" class="footer_link">FAQ</a>
</div>
<div class="sns_icon">
<a
href="https://www.facebook.com/?locale=ko_KR"
target="_blank"
rel="noopener noreferrer"
Comment on lines +167 to +170
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

a태그에서 target_blank를 사용하면 보안에 취약할 수 있다고 해요!
참고 자료

그래서

     <a
            href="https://www.facebook.com/?locale=ko_KR"
            target="_blank"
            rel="noopener noreferrer"
...

이렇게 써주었습니당

>
<img src="/src/assets/svg/facebook-icon.svg" alt="facebook_ogo" />
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

앗 셀프 코드리뷰 하다가 발견,,, 오타 + 다른 alt들과 규칙도 다르네요 ,,, 수정하겠습니다

</a>
<a
href="https://www.twitter.com/"
target="_blank"
rel="noopener noreferrer"
>
<img src="/src/assets/svg/twitter-icon.svg" alt="twitterLogo" />
</a>
<a
href="https://www.youtube.com/"
target="_blank"
rel="noopener noreferrer"
>
<img src="/src/assets/svg/youtube-icon.svg" alt="youtubeLogo" />
</a>
<a
hre="https://www.instagram.com/"
target="_blank"
rel="noopener noreferrer"
>
<img src="/src/assets/svg/instagram-icon.svg" alt="instagramLogo" />
</a>
</div>
</div>
</footer>
</body>
</html>
12 changes: 12 additions & 0 deletions pages/faq.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>FQA</title>
<!-- <link rel="stylesheet" href="/styles/sign.css" /> -->
</head>
<body>
FQA 페이지에용
</body>
</html>
12 changes: 12 additions & 0 deletions pages/items.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>items</title>
<!-- <link rel="stylesheet" href="/styles/sign.css" /> -->
</head>
<body>
아이템 페이지에용
</body>
</html>
12 changes: 12 additions & 0 deletions pages/privacy.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Privacy</title>
<!-- <link rel="stylesheet" href="/styles/sign.css" /> -->
</head>
<body>
프라이버시 페이지에용
</body>
</html>
67 changes: 67 additions & 0 deletions pages/signin.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,67 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
rel="stylesheet"
type="text/css"
href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css"
/>
<link rel="stylesheet" href="/src/style/sign.css" />
<title>Login</title>
</head>
<body>
<form>
<header>
<a href="index.html" class="title-logo"
><img src="/src/assets/svg/Logo-Large.svg"
/></a>
</header>
<label for="sign-up"
>이메일<br />
<div class="input-container">
<input
id="sign-up"
type="email"
placeholder="아이디를 입력해주세요"
/>
</div>
</label>
<label for="password"
>비밀번호<br />
<div class="input-container">
<div class="helper">
<input
id="password"
type="password"
placeholder="비밀번호를 입력해주세요"
/>
<div class="input-eye-off">
<img src="/src/assets/svg/eye-close-icon.svg" />
</div>
</div>
</div>
</label>
<button onclick="location.href='./index.html'">로그인</button>
<div class="another-signup">
<div class="another-signup-text">간편 로그인하기</div>
<div class="another-signup-logo">
<a href="https://www.google.com/" target="_blank">
<img
src="/src/assets/svg/google-login-icon.svg"
alt="google-logo"
/>
</a>
<a href="https://www.kakaocorp.com/page/" target="_blank">
<img src="/src/assets/svg/kakao-login-icon.svg" alt="kakao-logo" />
</a>
</div>
</div>
<div class="title-subtext">
판다마켓이 처음이신가요?
<a href="signup.html" class="deco_text">회원가입</a>
</div>
</form>
</body>
</html>
91 changes: 91 additions & 0 deletions pages/signup.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,91 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
rel="stylesheet"
type="text/css"
href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css"
/>
<link rel="stylesheet" href="/src/style/sign.css" />
<title>Login</title>
</head>
<body>
<form>
<header>
<a href="index.html" class="title-logo"
><img src="/src/assets/svg/Logo-Large.svg"
/></a>
</header>
<label for="sign-up"
>이메일<br />
<div class="input-container">
<input
id="sign-up"
type="email"
placeholder="아이디를 입력해주세요"
/>
</div>
<label for="nickname"
>닉네임<br />
<div class="input-container">
<input
id="nickname"
type="text"
placeholder="닉네임을 입력해주세요"
/>
</div>
</label>
<label for="password"
>비밀번호<br />
<div class="input-container">
<div class="helper">
<input
id="password"
type="password"
placeholder="비밀번호를 입력해주세요"
/>
<div class="input-eye-off">
<img src="/src/assets/svg/eye-close-icon.svg" />
</div>
</div>
</div>
</label>
<label for="password-re"
>비밀번호 확인<br />
<div class="input-container">
<div class="helper">
<input
id="password-re"
type="password"
placeholder="비밀번호를 다시 한번 입력해주세요"
/>
<div class="input-eye-off">
<img src="/src/assets/svg/eye-close-icon.svg" />
</div>
</div>
</div>
</label>
<button onclick="location.href='./index.html'">로그인</button>
<div class="another-signup">
<div class="another-signup-text">간편 로그인하기</div>
<div class="another-signup-logo">
<a href="https://www.google.com/" target="_blank">
<img
src="/src/assets/svg/google-login-icon.svg"
alt="google-logo"
/>
</a>
<a href="https://www.kakaocorp.com/page/" target="_blank">
<img src="/src/assets/svg/kakao-login-icon.svg" alt="kakao-logo" />
</a>
</div>
</div>
<div class="title-subtext">
이미 회원이신가요?
<a href="/pages/signin.html" class="deco_text">로그인</a>
</div>
</form>
</body>
</html>
Binary file added src/assets/image/Header-Content-Image.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/image/home_01-image.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/image/home_02-image.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/image/home_03-image.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/image/home_bottom-iamge.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading