노션에 있는 소스코드 다운로드 링크의 접속이 안됩니다. 구글과 네이버 두개의 링크로 접속했을때의 사진을 첨부해드립니다.혹시 코드를 받을 다른방법이있을까요? 깃허브를 알려주시면 거기서라도 다운로드하겠습니다

안녕하세요 선생님. 강의 정말 잘 듣고 있습니다. 다름이 아니라, 가로 스크롤 반응형 제작중갤러리 형태를 세로 방향으로 바꾸는 과정에서 scrollTrigger 를 없애기 위해서 li 를 padding: 0; 으로 바꿔주면 된다고 하셨는데, 저는 적용이 되지 않아 반응형에서도 갤러리들이 가로방향으로 스크롤이 되는 문제가 생깁니다.. 도저히 이유를 모르겠어서 질문 올립니다감사합니다..work { position: relative; height: 100vh; border: 2px solid tomato; } .work ul { display: flex; padding: 3% 30%; box-sizing: border-box; } .work ul li { width: 600px; padding: 100px; box-sizing: border-box; flex-shrink: 0 !important; } @media screen and (max-width: 1024px) { .work { height: auto; } .work ul { padding: 0% 5%; justify-content: space-between; flex-wrap: wrap; } .work ul li { padding: 0; width: 45%; margin-top: 150px; } }

안녕하세요 선생님. 여러번 똑같이 따라 쳐보았으나..markers: true 여도 페이지에 scrollTrigger 표시가 되지 않고, 가로 스크롤이 동작하지 않습니다. console 창에 다른 오류 사항은 뜨지 않습니다. 무엇이 문제인지 전혀 모르겠어서 질문 남깁니다..$(function () { // GSAP Plugin gsap.registerPlugin(ScrollTrigger); ScrollTrigger.matchMedia({ "(min-width: 1024px)": function () { // horizontal scroll let list = gsap.utils.toArray(".work ul li"); let scrollTween = gsap.to(list, { xPercent: -100 * (list.length - 1), ease: "none", scrollTrigger: { trigger: ".work", pin: true, scrub: 1, start: "center center", end: "300%", markers: true, }, }); }, }); });

<header> <div class="header-logo"></div> <div class="navi"></div></header>header 밑에 있는 div에 공통적으로 들어가는 속성이 있는 경우, 자식 선택자 혹은 하위 선택자를 통해 접근할 수 있는데 ① header div {}② header > div{}강사님은 ①번을 사용하시는 이유가 있으신가요?②번이 header 태그의 직계 자식 요소 중 div 태그를 선택한다고 직관적으로 알 수 있다고 보는데... 혹시 제가 모르는 이유가 있는지 궁금합니다. 참고로 유투브에서 다른 강의들도 강사님처럼 ①번을 사용합니다

.project-gallery { display: grid; grid-template-rows: 300px calc(100vh - 600px) 300px; } 100vh 뷰포트 높이로 calc를 사용하게 되면 창 높이가 작아졌을 때 레이아웃이 깨지는데 100%나 calc 가 아닌 1fr 로 사용해야하지 않을까 싶은데 맞을까요?아님 다른 해결책이 있는지도 궁금합니다.

안녕하세요$(function(){ gsap.registerPlugin(ScrollTrigger); ScrollTrigger.matchMedia({ '(min-width: 1024px)': function(){ let list = gsap.utils.toArray('.work ul li'); let scrollTween = gsap.to(list, { xPercent: -100 * (list.length - 1), ease: 'none', ScrollTrigger: { trigger: '.work', pin: true, scrub:1, start: 'center center', end: '300%', markers: true, } }); } }) });현재 여기까지 작성을 하였는데 창 새로고침과 동시에 갤러리 가장 끝쪽으로 넘어가버립니다.콘솔에서는 이렇게 뜨구요,,,markers도 안 보이는 걸 보니 플러그인이 작동되지 않는 것 같은데코드를 전부 똑같이 치고 몇 번을 다시 봤는데도 전혀 안 되네요...파일 첨부를 어떻게 하는지 몰라서 제 코드 파일 다운로드 링크를 함께 올립니다.한번 확인 가능할까요?ㅜㅜhttps://bigfile.mail.naver.com/download?fid=JYbZa6JnM6mraAUjKCY9KqvdHqUmKoEmFAU/KxvqKxg/HquXFA2dFAtqaxvjF6UlazKZaztlF4U/FrpSMoUdaAMqaxI0KrtlKA+oFAb=

■ 질문 남기실 때 꼭! 참고해주세요.- 먼저 유사한 질문이 있었는지 검색해주세요.- 궁금한 부분이 있으시면 해당 강의의 타임라인 부분을 표시해주시면 좋습니다.- HTML, CSS, JQUERY 코드 소스를 텍스트 형태로 첨부해주시고 스크린샷도 첨부해주세요.- 다운로드가 필요한 파일은 해당 강의의 마지막 섹션에 모두 있습니다. 질문내용: checked 초기에는 선택이 되지만checked가 해제된 상태로 돌아가지 않습니다.  html <header> <input type="checkbox" id="trigger"> <label for="trigger"> <span></span> <span></span> <span></span> </label> <nav class="header__nav"> <ul class="header__nav-list"> <li><a href="#home" class="header__menu-link">HOME</a></li> <li><a href="#profile" class="header__menu-link">PROFILE</a></li> <li><a href="#projects" class="header__menu-link">WORKS</a></li> <li><a href="#resume" class="header__menu-link">RESUME</a></li> <li><a href="#contact" class="header__menu-link">CONTACT</a></li> </ul> </nav> <a href="#home" class="header__top-btn">TOP</a> </header>css .header__nav { position: fixed; top: 0; left: -100%; list-style: none; z-index: 1000; height: 100vh; transform: translateX(-100%); transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out; } /*checked 안된상태*/input[id=trigger]:checked ~ nav.header__nav { transform: translateX(0); left:0 }input[id=trigger] { display: none; } label[for=trigger] { display: block; width: 25px; height: 24px; position: relative; cursor: pointer; } label[for=trigger] span { position: absolute; top: 0; left: 0; display: block; height: 2px; width: 100%; background: #FFD24C; transition: 0.3s; } label[for=trigger] span:nth-child(1) { top: 0; } label[for=trigger] span:nth-child(2) { top: 50%; } label[for=trigger] span:nth-child(3) { top: 100%; } /* 체크박스 선택 시 */ input[id=trigger]:checked + label[for=trigger] span:nth-child(1) { top: 50%; transform: rotate(45deg); } input[id=trigger]:checked + label[for=trigger] span:nth-child(2) { display: none; } input[id=trigger]:checked + label[for=trigger] span:nth-child(3) { top: 50%; transform: rotate(-45deg); } 

./forest.png 파일은 어디서 다운 받을 수 있을까요? 보이지 않는 것 같습니다.

안녕하세요 강사님강의가 거의 대부분 이해가 될 듯 말듯합니다.강의코드를 다 잘 아시니까, 이게 이런거고 저게저런거다라고 쭈욱 빠르게 얘기해주시는데, 이해시키기보단 강사님이 아시는걸 설명하시는 느낌이에요. 근데, 반쯤 이해되는 상태이고,코드 따라 안써봐도 되겠죠? 커서로 짜주는 코드를 해석하는 능력을 기르는게 중요하다고 하셨으니까요..!! 일단 정주행해도 될지, 아니면 제가 방향을 잘못잡고있는지 궁금해서 질문남겼습니다!!   열의있게 강의해주셔서 감사합니다.

works together에서 위 아래 padding을 다 주셨는데, top은 이해가 되는데 bottom을 지정하는 이유가 따로 있나요? .banner { padding-top: 216px; padding-bottom: 216px; background-color: #386e38; text-align: center; color: white; 만약 위 코드에서 height: 650px;처럼 세로 길이가 고정되어 있는 배너라면 padding-bottom은 필요 없을까요?

단순 호기심 질문이긴 한데요.클래스명 보면 banner__title처럼 언더스코어를 두개씩 지정하시던데, 단순히 baner_title처럼 언더스코어 하나만 사용했을때와 다른 어떤 이유나 숨겨진 미세팁 같은게 있을까요? 아니면 딱히 이유 없이 경력이 쌓이면서 습관화 돼서 사용하시는 관례인건가요? 

강사님 안녕하세요.gsap강의 소개에 있는 에이전시 합격 포트폴리오는 수강생들 각자 제작한걸까요?아니면 이번 수업중에 있는 내용일까요?너무 잘 만드셔서 참고해서 만들어보고 싶은데 정보를 얻을 수 없을까요.. 문의드립니다.

학습자료 첨부가 안되어있는것 같습니다!

다운로드가 pc에서는 안되나요?자료 녹색버튼을 클릭하면 된다고 하는데 없는데요 

깃 설치 화면과 병행으로 나오니 짤리네요.2:11 ~ 2:16 지나면서 메인클래스 부분이 모듈없음 에서 cp JH로 바뀌었는데 뭘 선택하면 되는지요? 

안녕하세요. 강의 잘 듣고 있습니다강의 중간에 로고 이미지를 교체하시는데 Header 교안에 첨부된 이미지가 없습니다어디서 확인할 수 있을까요?

안녕하세요 선생님수업 잘 듣고 있습니다.강의를 듣는 도중에 sign in 왼쪽선이랑아래 hero 섹션에서 제일 오른쪽 꽃이미지 왼쪽선이랑미세하게 안맞는데 피그마에서는 선이 딱 맞더라구요이것도 딱 맞게 조정할 수 있는 방법이 있나요?

안녕하세요!강의 듣다가 최종 배포에서 질문이 있습니다. 강의에서는 vite.config.js 파일 내용 수정은 없는 것 같은데요아래 순서로 했는데 홈페이지 메인화면에서Blocked request. This host ("5d39-218-159-221-155.ngrok-free.app") is not allowed.To allow this host, add "5d39-218-159-221-155.ngrok-free.app" to server.allowedHosts in vite.config.js.에러가 뜨는데요vite.config.js 파일 수정을 해야되나요? 프론트, 백앤드 서버 실행cmd 창에서 ngrok http 5173 입력index.js 파일에서 아래와 같이 수정 app.use(cors({ //origin: "http://localhost:5173", origin: "https://5d39-218-159-221-155.ngrok-free.app", credentials: true, })); ngrok 에러는 아래와 같아요 08:36:45.923 KST GET /favicon.ico 403 Forbidden

IntelliJ 도 현재 최신버전으로 설치했는데 강의 버전에 맞춰 설치해야 하는지요?

이해가 어려운 부분이 있는데요.이 실습에 header main 같은 시맨틱 태그를 사용하지 않은 이유는 웹 페이지 문서같이 최적화를 위한 구조가 필요한게 아니라 오직 시각적인 UI를 만드는게 목표라서 그런건가요?