수업
Text Animation
- 가운데 저 파란 원부분을
transform: rotateY(calc(var(--char-index)*12deg)) translateZ(250px);
각각 텍스트에 번호를 부여하고 12deg를 곱해서 각각 돌려준다는 개념.
transform: rotateY(1turn);
정확하게 한바퀴 돌리고 싶을 때 사용한다.
1turn = 360deg
0deg에서 360deg, 그리고 다시 0deg로 가도 반복되는 것 같은 애니메이션 효과를 낼 수 있지만, 조금 끊기는 느낌이 든다.
그러면 alternate를 쓰면 된다.
생각
피그마를 보고 구현하는 실습을 했는데, 정말정말 다들 빠르게 잘하시는 것 같아서 조급해질뻔 했다. 하지만 강사님이 바로 3주차가 저 정도는 못하는게 당연하다고 해주셔서 조금 마음을 놓았다. 공부를 하면서 느끼는 것은 멘탈관리와 체력관리가 정말정말 중요하다는 것..!
느낀점
- 멘탈관리의 필요성을 느낀다. 체력뿐 아니라 함께 공부하는 사람들과 충분히 얘기하면서 고충을 털어놓는 시간을 가지는게 좋을 것 같다.
계획
- 회고그룹이나 다른 동기분들과 얘기하며 멘탈 케어 잘하기!
2021.11~