component태그와 CourseCard2 의 차이점
component태그는 무언가 동적으로 바뀌는 부분이 있을때 사용하는 태그.
예를 들어, !isMobile ? filterMenus : filterMenusM 와 같이 모바일일때 컴포넌트가 바뀌어야한다면 component태그를 사용해 표현해준다.
공부할 것
forEach와 Map의 차이를 잘알자
vue의 data부분을 공부할것
${toggleShowAll ? '' : classSec} 삼항연산자를 바꾸면 뭘로바꿀수 있을까? -> ??를 사용
!toggleShowall ?? classSec
!null ?? 'string' null이 아니면 true null이면 오른쪽이 나옴
&는 무슨 뜻?
destructing
const [i,a] = ban.split(' ') => destructing을 사용해서 ban을 나눈것
const aaar = ban.split(' ')
aaar[0],aaar[1]
왜 for 대신 for of, forEach를 사용하는지 공부해볼 것
-> 더 깊이 공부하면 왜 다른지 알 수 있음(자바스크립트성능속도가 줄어듬).
배열은 메모리를 쓰는게 자바스크립트는 다름. 다른 언어는 배열에 추가할때 메모리사이즈가 작으면 복사해서 사이즈를 늘린 후 메모리에 집어넣는다.
v-for key를 꼭 써야하는 이유 -> 공식문서
methods구간에서는 다양한 옵션들이 먹히는데 html부분에서는 안먹히는 부분이 있음.
주의
branch는 작업할때 항상 만들고 시작
class이름 만들때 flex이런식으로 쓰지말것
npm lint 꼭 돌리고 pr날릴것
es6문법으로 쓰려고 노력할것 -> ES6문법공부하기
할일
- CourseTabProgress에서 버튼 위치 가운데로 바꾸기 -> 화살표icon은 css가 먹지만 text부분은 opentrackbtn자체 text여서 text-class에서 안먹음 어떻게?
2. CourseTabProgress에서 component 태그바꾸기 -> 해결
3. Progress에서 글씨부분 opacity 넣기 -> progress complete title부분 opacity:0.9 넣음 해결
- X버튼넣기 -> popupcard로 대체했으나 g_indigoblue가 어디서 들어가는지 모르겠음 close btn은 해결
5. starrating 한블록으로 바꾸기 -> 해결
- starrating 간격변경하기(left) -> 간격을 변경하면 오른쪽에 간격이 남아버려서 위 글씨와 가운데정렬이 어려움 / 별의 사이즈가 커지니까 progressrating과의 가운데도 안맞음(progressrating에서 margin을 더 줘서 맞출지)
