프론트엔드스쿨12 [제로베이스]JavaScript 미션 회고 제로베이스의 학습 계획표를 따라가다가 Html/CSS 과제를 너무 급하게 했던게 기억에 남아서 미리 시작해보자! 하는 마음으로 자바스크립트 미션을 시작했다. 분명 그랬는데....... 미션3 까지는 그래도 유튜브 영상을 찾아보고, gpt와 상의해서(일방적으로 가르침받음) 하나씩 잘 해결했다고 생각했는데 미션4에서 나는 완전히.....무너지고 말았다(더이상 무너질 곳도 없음 이제는) 그냥 자바스크립트 강의도 다 이해하지 못한 상태에서 무언가를 구현하는것이 너무 어려웠다. 실습 강의를 들어도 무슨 말인지 이해를 못하고 그냥 받아쓰기... 그런 와중에 강의 화질이 안좋은게 있어서 화면 속으로 들어가는줄 알았다 하하. 이건 개선되길 바람.. 아무튼 미션4에서 너무 심하게 절망한 채로 일주일 정도를 포기한채로 날.. 2023. 6. 21. 비동기로 데이터를 가져와 처리하는 방법 - infiniteScroll 구현 infiniteScroll(무한 스크롤) : 웹 애플리케이션에서 페이지가 스크롤되면서 동적으로 컨텐츠를 무한 로딩하는 기법을 말한다. 비동기로 데이터를 가져와서 처리하는 방법으로 infinite scroll을 구현하는 방법은 아래와 같다. 1. 스크롤 이벤트 감지하기 스크롤 이벤트를 감지하여 사용자가 스크롤을 내릴 때 마다 이벤트 핸들러를 호출한다. 이를 통해 스크롤 위치를 추적하고 새로운 데이터를 가져올 시점을 판단할 수 있다. 무한 스크롤에서는 세로 스크롤만 감지하면 되기 때문에 height와 관련된 값을 참고해야 한다. scrollHeight 는 화면에 보이지 않는 높이도 포함된 페이지의 총 높이, 즉 요소에 들어있는 컨텐츠의 전체 높이로 padding과 border가 포함된다. scrollTop .. 2023. 6. 14. noopener, norenoreferrer, nofollow를 사용하는 이유 a 태그의 rel 속성 값으로 사용되는 noopener, norenoreferrer, nofollow 에 대해 알아보자 a 태그의 rel 속성은 html 문서와 링크된 두 문서간의 관계를 명시해준다. 이때 href 속성이 있어야 rel 속성을 사용할 수 있고 검색 엔진은 이 속성을 통해 링크에 대한 추가 정보를 얻을 수 있다. rel 속성에 사용되는 value 중 noopener, norenoreferrer, nofollow 값은 , , 요소에서 사용되는데, 이 값들은 하이퍼링크를 생성하지는 않지만 저 요소들에 의해 생성된 다른 하이퍼링크의 주석이 되기도 한다. 1. noopener 보통 하이퍼링크를 만들 때 target 속성을 지정하면 새로 열린 브라우저 탭에 이름을 지정하고 보조적인 브라우저 탭을 생.. 2023. 6. 3. [제로베이스]프론트엔드 스쿨 두 달차 요약 다음주면 프론트엔드 스쿨이 시작한지 두 달차가 된다. 5월은 HTML/CSS 미션을 하느라 초반 시간이 훅 지나가버려서 인지 미션이 끝나도 시간이 빨리 가는 것 같다고 느꼈다. 프론트엔드 스쿨 두 달차에는 코딩 테스트를 시작했고 자바스크립트 진도를 나가고 있다. 일주일에 한 번씩 코딩 테스트를 보면서 공부할 수 있는건 좋지만 초보자가 하기엔 문제의 난이도가 높다고 느꼈다. 물론 총 5개의 문제 중 2개 정도는 어려움 없이 풀 수 있지만 나머지 문제는 이해조차 되지 않아 여기저기 검색해보고 답을 작성하여 제출해야 한다는 점이 아쉬웠다. 나는 처음부터 난이도가 높으면 실력 향상에 도움이 된다고 생각하지 않아서 쉬운 문제부터 차근차근 난이도를 높여갔으면 더 좋았을거란 아쉬움이 든다. 그런 문제는 자바스크립트 .. 2023. 5. 24. 이전 1 2 3 다음
