-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[2주차 기본 과제] 1. yesonbucks 창업 #4
base: main
Are you sure you want to change the base?
Conversation
…yeonSon into week2_yesonbucks
const data = [ | ||
{ | ||
categoryName: 'Sopt', | ||
todos: [ | ||
{ id: 'check1', text: '웹팟 과제' }, | ||
{ id: 'check2', text: '1차 세미나 복습' }, | ||
{ id: 'check3', text: '리액트 서터디' }, | ||
] | ||
}, | ||
{ | ||
categoryName: 'Epris', | ||
todos: [ | ||
{ id: 'check4', text: '카드뉴스 피드백' }, | ||
{ id: 'check5', text: '컨셉 아이디어 회의' }, | ||
{ id: 'check6', text: '임원진 회의' }, | ||
] | ||
}, | ||
{ | ||
categoryName: 'Exercise', | ||
todos: [ | ||
{ id: 'check7', text: '기상운동' }, | ||
{ id: 'check8', text: '홈트 1회' }, | ||
{ id: 'check9', text: '스트레칭' }, | ||
] | ||
}, | ||
{ | ||
categoryName: 'Daily', | ||
todos: [ | ||
{ id: 'check10', text: '벙개~' }, | ||
{ id: 'check11', text: '분당팟 모각공' }, | ||
{ id: 'check12', text: '스벅 슈크림라떼 먹어보기 냠냠냠냐' }, | ||
] | ||
}, | ||
]; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
요거 상수파일 분리해도 좋을것같앙~~~~
} | ||
|
||
// HTML이 로드된 후 init 함수 실행 | ||
window.addEventListener("load", init);*/ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
요기 163줄부터 254줄까지 주석지우긩~~~~
//input | ||
/* | ||
const todoList = [ | ||
|
||
{ category: Sopt, | ||
titleList: "웹팟 과제", completed: false }, | ||
{ title: "운동하기", completed: false }, | ||
{ title: "저녁 약속", completed: false } | ||
]; | ||
|
||
//checkbox 클릭 시 completed: true로 변경 | ||
*/ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
요기동!! 안쓰는 주석 지우긩~~
</div> | ||
<div class="todo"> | ||
<input id="check1" type="checkbox"> | ||
<label for="check1">웹팟 과제</label> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
label 내용 상수로 있는데 오잉 왱 안지웠오???? 이유가 있용???
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
진짜 나도 너무 어려워서 정말 오래걸렸던 과제다 보니,,,코드를 보는데 뭔가 얼마나 힘들었을지 느껴져서 감정이입됐어요,,,,정말 고생했어...!!!
@@ -0,0 +1,399 @@ | |||
const products = [ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
파일 분리해주면 더 깔끔할듯!
// 새로운 카드 추가 | ||
products.forEach((product) => { | ||
// 카드 생성 | ||
const card = document.createElement('div'); | ||
card.classList.add('card'); | ||
|
||
// 카드 이름 추가 | ||
const cardName = document.createElement('div'); | ||
cardName.classList.add('card_name'); | ||
cardName.textContent = product.name; | ||
card.appendChild(cardName); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
아아아 create element로 카드를 만들어주는 거 였군요...! 이게 Html 파일처럼 구조가 한눈에 보이지 않아서 어려웠을텐데,,,대단해..!!!
<section id="card_section"> | ||
</section> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
html 파일 먼저 봤다가 텅 비어있는 카드섹션보고 당황했었다는 후문,,,
✨ 구현 기능 명세
nav
✅
card article
+
아이콘 클릭시 태그 모달이 등장합니다. ✔🌼 PR Point
🥺 소요 시간, 어려웠던 점
14h(?)
🌈 구현 결과물
yesonbucks.1.mp4