Today I Learn 20220525

Todo

💻 HTML+CSS+JS 포트폴리오 실전 퍼블리싱 강의 끝 ✔
💻 함수형 프로그래밍과 Javascript ES6+ 강의 끝 ✔
💻 함수형 프로그래밍과 Javascript ES6+ 응용편 ✔
💻 webpack강의 : file loader ~ webpack 마무리까지
💻 Typescript 강의 : intro ~ 실습 게임 구현까지

Error & Solution

텍스트 그라디언트 적용안됨

background: linear-gradient 속성만 주고 안된다고 하고 있었다..
-webkit-background-clip: text;
-webkit-text-fill-color: transparent; 잊지말기..

background: linear-gradient(135deg, #4158d0 0%, #c850c0 46%, #ffcc70 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;

What I learned

1. position: absolute; → inline-block; 속성으로 바뀜
2. 별점주기에서 prevAll(), nextAll() 사용하기

  // .stars는 별과 문구를 담고있는 div, .fa는 별 아이콘
  $('.stars .fa').click(function(){
  	$(this).addClass('active')
  // 네번째 별을 누르면 그 이전의 별들도 active 되어야해서 prevAll()
  	$(this).prevAll().addClass('active')
  	$(this).nextAll().removeClass('active')
  })

3. 스크롤하면 시작되는 애니메이션을 만들어주는 wow.js → github front-code
4. 어코디언 콘텐츠 슬라이드 만들기에서 slideUp(), slideDown(), fadeIn(), fadeOut()은 일반적으로 stop()과 함께 사용한다.
5. accordion content slide 만드는 방법 → github front-code
6. 이터러블 중심 프로그래밍 실무적인 코드 → 독학 카테고리에 정리
   L.flatten, L.filter, L.map, take, reduce
7. query, queryToObject → 독학 카테고리에 정리

Thinking

함수형 프로그래밍 문법에 대해 배웠을 때는 실제로 어떤식으로 코드를 짜는지 감이 잘 안왔었는데 Javascript ES6+ 응용편에서 그 사용법을 잘 가르쳐줘서 혼자서도 한번 응용을 해볼 수 있을 것 같다.