새로운 프로젝트의 메인 화면 디자인이 드디어 마무리 되었다. (아마도) 그 중 한 부분에 애니메이션을 추가하고 싶었는데, 피그마로 프로토타입을 구현하는 것 보다 직접 코드를 짜보면 좋겠다는 생각에 처음으로 업무용 코드를 만들었고 생각보다 더 많은 것을 배우는 중이다. 화면 자체를 만드는 일은 생각보다 오래걸리지 않았다. SCSS 수업을 다시 듣고 기억을 떠올려서 활용한다면 훨~씬 좋겠지만 일단 급하니까 쌩 CSS로 잡았다. 문제는 여러개의 버튼 중 내가 클릭한 요소에 맞는 이벤트를 넣어줄 수 있는가였다. 화면에 있는 8개의 버튼은 각각 왼쪽 버튼인지, 오른쪽 버튼인지 어느 li 태그에 속한 버튼인지 해당 버튼이 가지고 있는 percent가 몇인지 를 구분할 수 있어야했다. 1. 일단 동작이 되도록 만들어..
탭 메뉴에서 반복문을 만들면서 배운 필터링 문법. 역시나 배운걸 검색하니 훨씬 방대한 내용이 나오는데 일단 내가 지금 사용해봤던 것들부터 정리하고, 차차 경험이 닿는대로 내용 추가 예정. 👀 .first() .last() $('.tab-button').first().addClass('active'); 첫번째 tab-button 요소를 선택해 클래스 추가 $('.tab-button').last().addClass('active'); 마지막 tab-button 요소를 선택해 클래스 추가 👀 .eq() $('.tab-button').eq(0).addClass('active'); 0번째 tab-button 요소를 선택해 클래스 추가 $('.tab-button').eq(-1).addClass('active'); ..
- Total
- Today
- Yesterday
- VSCode
- notworking
- 생각정리
- ES6
- Prettier
- javascript
- Callback
- 다중조건삼항연산자
- promise
- CSS
- 타입스크립트
- typescript
- Til
- Asynchronous
- DOM
- JS
- 개념정리
- 구조분해할당
- 리액트
- JSX
- Synchronous
- JQuery
- scrollEvent
- 조건부삼항연산자
- Prototype
- 삼항조건연산자중복사용
- class
- destructuring
- Ternary
- callsignature
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |