[FS_11_김민성] 스프린트 1, 2 미션 제출 #18
Open
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
alstjddl0513-sys
added
매운맛🔥
wseungjin
approved these changes
Dec 6, 2025
|
|
||
| <footer> | ||
| <div class="foot"> | ||
| <div class="codeit-foot">@codeit-2024</div> |
Collaborator
There was a problem hiding this comment.
div 말고 시맨틱 태그를 이용해 다른 html 요소를 표현해보면 좋을거 같아요. 그리고 html tag가 어떤걸 의미하는지도 공부해보면 좋을거 같습니다.
| } | ||
| gtag('js', new Date()); | ||
|
|
||
| gtag('config', 'G-67JBD32GZW'); |
Collaborator
There was a problem hiding this comment.
config는 따른 파일로 별도로 관리하는게 좋아요. 나중에 시도해보시죠
| <!-- Google tag (gtag.js) --> | ||
| <script | ||
| async | ||
| src="https://www.googletagmanager.com/gtag/js?id=G-67JBD32GZW" |
Collaborator
There was a problem hiding this comment.
이미 여기서 id로 config를 사용하는것 처럼 보이는데 또 필요한가요?
| <link | ||
| rel="stylesheet" | ||
| as="style" | ||
| crossorigin |
Collaborator
There was a problem hiding this comment.
알면서 사용하신건가요? crossorigin에 대해서 공부를 해보시면 좋을꺼같습니다.
wseungjin
reviewed
Dec 6, 2025
| <br /> | ||
| 판다마켓 중고거래 | ||
| </h1> | ||
| <div id="img2" class="imgs"></div> |
Collaborator
There was a problem hiding this comment.
class naming에 숫자를 넣는걸 지양해주세요 좀 더 의미있는 네이밍을 추구해주셨으면 합니다.
wseungjin
reviewed
Dec 10, 2025
| @@ -0,0 +1,167 @@ | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <head> | |||
| <link | ||
| rel="stylesheet" | ||
| as="style" | ||
| crossorigin |
| 구경하러 가기 | ||
| </a> | ||
| </div> | ||
| <div id="img1" class="imgs"></div> |
|
|
||
| <footer> | ||
| <div class="foot"> | ||
| <div class="codeit-foot">@codeit-2024</div> |
|
|
||
| <main> | ||
| <section id="top" class="banners"> | ||
| <div class="cont"> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
1.스프린트 미션 체크리스트
<미션1>
[기본 요구사항]
React와 같은 UI 라이브러리를 사용하지 않고 진행합니다
PC사이즈만 고려해 주어진 디자인으로 구현합니다.
HTML, CSS 파일을 Netlify로 배포해 주세요. (참고: https://www.codeit.kr/learn/5309)
랜딩 페이지의 url path는 루트(‘/’)로 설정합니다.
title은 “판다마켓”로 설정합니다.
“판다마켓” 로고 클릭 시 루트 페이지(‘/’)로 이동합니다.
'로그인' 버튼 클릭 시 로그인 페이지(‘/login’)로 이동합니다 (빈 페이지)
“구경하러 가기”버튼 클릭 시(’/items’)로 이동합니다. (빈 페이지)
“Privacy Policy”, “FAQ”는 클릭 시 각각 Privacy 페이지(‘/privacy’), FAQ 페이지(‘/faq’)로 이동합니다.(모두 빈 페이지)
페이스북, 트위터, 유튜브, 인스타그램 아이콘을 클릭 시 각각의 홈페이지로 새로운 창이 열리면서 이동합니다.
아래로 스크롤해도 “판다 마켓” 로고와 “로그인” 버튼이 있는 상단 내비게이션 바(Global Navigation Bar)가 최상단에 고정되게 해 주세요.
화면의 너비가 1920px 이상이면 하늘색 배경색은 너비를 꽉 채우도록 채워지고, 내부 요소들의 위치는 고정되고, 여백만 커지도록 합니다.
화면의 너비가 1920px 보다 작아질 때, “판다마켓” 로고의 왼쪽 여백 200px, “로그인" 버튼의 오른쪽 여백 200px이 유지되고, 화면의 너비가 작아질수록 두 요소 간 거리가 가까워지도록 설정합니다.
화면의 너비가 1920px 이상이면 내부에 있는 요소 간 동일한 간격을 유지하며 가운데 정렬해야 합니다.
화면의 너비가 1920px 보다 작아질 때, 최하단에 있는 “codeit-2024”의 왼쪽 여백 200px과 SNS 아이콘들의 오른쪽 여백 200px을 유지하면서 가운데 있는 “Privacy Policy”, “FAQ” 요소와 각각 동일한 간격을 유지하며 가까워져야 합니다.
클릭으로 기능이 동작해야 하는 경우, 사용자가 클릭할 수 있는 요소임을 알 수 있도록 CSS 속성 cursor: pointer로 설정합니다.
[심화 요구사항]
<미션 2>
[기본 요구사항]
공통
README.md 파일을 작성해 주세요.
마크다운 언어를 숙지하여 작성해 주세요.
내용은 자유롭게 작성해 주세요.
본인 브랜치(ex)part1-홍길동)에 스프린트 미션을 업로드해 주세요.
적절한 커밋 메시지를 남겨 주세요.
1-Sprint-Mission 레포지토리를 fork 합니다.
GitHub에 PR(Pull Request)을 생성해 upstream의 본인 브랜치(ex)part1-홍길동)에 미션을 제출합니다.
PR 코멘트에 아래 내용들을 포함해 주세요.
스프린트 미션 요구사항 체크리스트
주요 변경사항
멘토님에게 남길 메시지
Git 활용 과정에서 유닉스 커맨드를 활용해 주세요.
HTML, CSS 파일을 Netlify로 배포합니다. (참고: https://www.codeit.kr/learn/5309)
로그인 페이지, 회원가입 페이지 공통
로그인 페이지
회원가입 페이지
[심화 요구사항]
공통
로그인 페이지, 회원가입 페이지 공통
2. 주요 변경사항
3. 멘토님에게 남길 메시지