안녕하세요 선생님! 수업 즐겁게 잘 듣고 있습니다!문득 duration과 stagger 사이의 궁금증이 생겨 문의드립니다. 제가 이해한 바로는duration = 애니메이션 진행시간의 총량stagger = 애니메이션 진행시 아이템간의 간격이렇게 이해하고 있습니다.그런데 만약 duration 1초,stagger 0.5초,item * 8(item) 0.5 (item) 0.5 (item) 0.5 (item) 0.5 ...duration이 설정한 1초를 아득히 넘어가게 되는데GSDevTools로 확인해보니 stagger로 인해 초과되는 시간만큼 늘어나는 것으로 확인이 됩니다.그렇다면 duration보다 stagger의 총합 길이가 더 우선이 되니 stagger의 총합 길이가 초과할 시 duration은 필요 없겠다라고 생각이 들었습니다.그런데 GSDevTools로 확인해본 결과 duration 1초 적용시 4.5초 / 미적용시 4초 라는 결과값을 확인했습니다. 어떤 상관이 있는지 궁금하여 질문 남깁니다..!

alert 메세지가 숨겨지는 코드까지는 실행이 되는데그 이후 코드들이 실행되지 않는 것 같습니다. 콘솔에도 값들이 뜨지 않고 제출하면 새로고침 되는 현상이 발생해서혹시 보지 못한 오타가 있나 검수 해보고 강의 코드와 비교도 해봤는데실행되지 않는 이유를 잘 모르겠어서 질문 남겨봅니다..!

혹시 블로그에 포스팅 해도 되나요?? 안되면 노션에 할게요 !

코드보관소 코드랑 강의내용이랑 씽크가 안되는거 단원들이 몇개 있는거 같습니다.10강,11강 보면 코드보관소 코드의 내용이 한챕터씩 밀려서 올라가 있는거 같습니다.예를 들어 실제 코드보관소 section 11의 chapter2 열어보면 10.4강 내용의 소스입니다.section 11의 chapter3을 열어보면 11.2 강의 내용 같구요.그 이전강의도 있었는데 몇강인지 기억이 안나네요..전반적으로 씽크가 안맞는게 좀 있습니다.수정 부탁드려요..

야구게임에서 숫자말고 다른걸 입력했을 때 경고가 뜨게 하고 싶어서형식 확인하는 함수에서 마지막에 코드를 추가해봤는데 숫자를 입력했을 때도 경고가 뜨더라구요이래저래 해보는데 안돼서 방법이 잘못된건가 싶어서 여쭤봅니다! 혹시 애초에 input type이 text여서 그런걸까요..?  

수정 삭제는 sqlite로 직접 만져야되나요

 이전 수업의 마지막 부분에서 백엔드를 프론트에 연결하여서 결제를 하였음에도 불구하고, db에 데이터가 쌓이지 않습니다.그래프ql을 통해 백엔드 자체적으로 데이터를 보냈을 때는 정상적으로 db에 데이터가 들어가는것을 보면, 백엔드쪽 문제는 아닌거 같고 프론트와 연동할 때 무슨 문제가 있는거 같은데 에러 메시지가 나오는것도 아니고, 결제 완료라는 알림은 뜨지만 데이터가 들어가지 않으니 해결이 난해한 상황입니다.코드를 두번 세번 확인해보아도 선생님의 코드와 다를 것이 없고, 저 또한 문제를 모르겠는데 혹시 이러한 경우의 해결을 알고 계실가요? ㅜㅜ

안녕하세요. 강의를 듣다가 원래 이런건가 하고 넘어갔던 이상한 부분이 있었는데, 방금 이건 좀 아닌것같다는 생각이 들어서 질문드립니다.코팩님은 여러 파일을 수정하실때 마지막에만 저장하시는 것 같은데, 저는 파일 여러개를 수정하고 마지막 파일에서만 저장버튼을 누르면 서버 실행이 되지않습니다. 그래서 수정했던 모든 파일로 가서 커멘드s 를 눌러줘야 서버 실행이 잘 됩니다ㅠ 그리고 가끔 rename을 할때도 파일간 연동이 잘 안되는지, 각각 파일에 직접 가서 rename을 해줘야 합니다. 혹시 이유를 알고 계실까요?

강좌 잘 듣고 있습니다.프로젝트를 진행하면서 듣고 있는거라서 부분적으로 보고 있는데.. 궁금한게 있어서 적어봅니다. nest.sj + graphQL + prisma로 현재 구축을 하고 있는데.. 이 경우 controller보다 resolver를 사용하면 된다고 해서, controller없이 작업중입니다.이게 맞는지 궁금합니다. 문서랑 강의를 보고 이해를 하고 작업중이기는 한데, 확신이 없어서요.. ^^; 프론트엔드와는 graphql로 정보를 주고 받으려고 했는데.. 외부 업체와의 연동 때문에 REST API도 필요하게 되었습니다. 그래서 graphql을 rest api로 노출하기 위해서 swagger를 사용하고 있는데..여기 접근시 인증이나 이런게 필요 할까요?? 인증을 jwt로 해서 인증후 api에 접근하게만 해 주면 되는지 아니면 다른 방식으로 인증을 하는게 나은지.. 어떤 방법으로 구축을 해야 할지 확신이 없어서요.. 아.. 그리고 GraphQLSchemaHost를 사용하면 graphQL이 rest api로 제대로 출력이 되는지도 궁금합니다.잘 된다.. 아니면 좀 이상하게 출력되는 경우가 많다.. 정도의 답변만으로도 감사하겠습니다.. ㅡ.ㅜ; 아직 초반이기는 한데, 방향 좀 짚어주시면 감사하겠습니다..그럼 디테일한 삽질은 강의 참조해서 제가 하겠습니다.. ㅎㅎ

 수업내용에let classmates = ["철수", "영희", "훈이"]여기서classmates.push("맹구")를 넣으면 마지막에 추가기능있는것을 배웠습니다.그런데 여기서 궁금한게 마지막이 아닌 철수와 영희 사이 또는 영희와 훈이 사이에 넣을수 있는 문법(?)기능이 있을까요? 아 또 pop기능에서는 마지막값 삭제인데 그것말고 원하는 값을 삭제하는 기능이 있을까요?

화면 출력 부분 강의에서window.addEventListener('resize', () => { // 카메라의 종횡비 camera.aspect = window.innerWidth / window.innerHeight; camera.updateProjectionMatrix(); // 렌더러의 크기 renderer.setSize(window.innerWidth, widow.innerHeight); });이 코드에서 창 크기를 바꿀시 box의 크기가 줄어드는 것이 아닌 box가 늘어나는 현상이 발생합니다 별의 별짓을 다해도 못고칠것 같아서 질문드려요<canvas id="result" style="border:1px solid red; width: 100%; height: 100vh"></canvas>혹시몰라 html코드도 첨부합니다

혹시 이건 꼭 vscode로만 가능한 것일까요? webstorm으로는 불가능한것인지 궁금합니다.

새로운 투두 추가하기 버튼을 클릭할 때 실행되는 createNewTodo함수가 끝나고 input을 입력하거나 checkbox change같은 이벤트를 실행할 때 createTodoItem함수 안에 있는 이벤트리스너가 발생되는데 클로저와 연관이 있을까요?이론으로만 접근하다가 이게 바로 클로저..? 라는 생각이 들었는데 제가 생각한 부분이 맞는지 궁금합니다.삭제버튼 이벤트리스너에서 itemEl.remove(); 코드로 해당 투두 아이템 요소를 삭제해주는데, 이전에는 이벤트리스너의 event 인자로 타겟을 정해주고 사용했던 적이 있어서 약간 낯설게 느껴졌습니다. 코드의 itemEl 요소가 해당 투두 아이템인지 인식할 수 있는 이유는 이벤트버블링 때문인가요?제가 이번 강의를 부득이하게 음소거로 듣고있어서 영상에 이미 설명이 되었던 부분이라면 죄송합니닷🥲

안녕하세요. 2.1강에서 storybook, vitest 명령어를 사용했을 때, 에러가 나타나서 질문 드립니다 Settingbranch: unit-test-examplevitest 플러그인: v0.3.0 (현재 이하로는 변경이 안되는 것 같습니다)node: 19.9.0 eslint.json - `"prettier:prettier": "off"` 추가prettierrc - `"endOfLine": "auto"` 추가 storybook 사용 시(npm run storybook)  Web의 경우 새로고침을 하면 정상 페이지로 동작하지만 에러 로그는 그대로 입니다vitestimport { screen } from '@testing-library/react'; import React from 'react'; import TextField from '@/components/TextField'; import render from '@/utils/test/render'; it('className Prop으로 설정한 css class가 적용된다.', async () => { // Arrange - 테스트를 위한 환경 만들기 // -> className을 지닌 컴포넌트 렌더링 await render(<TextField className="my-class" />); // Act - 테스트할 동작 발생 // -> 렌더링에 대한 검증이기 때문에 이 단계는 생략 // -> 클릭이나 메서드 호출, prop 변경 등등에 대한 작업이 여기에 해당 합니다. // Assert - 올바른 동작이 실행되었는지 검증 // -> 렌덩링 이후 DOM에 해당 class가 존재하는지 검증 // TextField는 placeholder 요소가 있습니다. // vitest의 expect 함수를 사용하여 기대 결과를 검증 expect( screen .getByPlaceholderText('텍스트를 입력해 주세요.') .toHaveClass('my-class'), ); });

강사님 yarn 버전이 1.22 를 사용하고 있는데 지금 4.x 버전까지 yarn berry(2.0 이상)의 zero install 이나 pnp 등 상당히 많은 업데이트가 진행되었습니다. nest/cli 신규 프로젝트 생성부터 yarn 버전으로 프로젝트 진행에 상당히 불편함을 느끼지 싶습니다. 시간이 되신다면 yarn 관련 강좌 업데이트 부탁드리겠습니다.감사합니다.

안녕하세요.vue 사용중에 있어 부득이하게 jquery 를 사용하려고 하는데요.import $ from 'jquery';import 'jqueryui';import 'jquery-ui-touch-punch';모바일까지 지원을 해야해서 jquery-ui-touch-punch 까지 사용을 해야 하는 상황입니다.위와 같이 import를 해주면 코드툴에선 에러가 안뜨는데 브라우저 화면에서는 콘솔에러가 나타나고 있습니다.아래와 같은 오류인데 혹시 해결책이 있을까요? 여러 방법으로 시도해 보고 있으나 해결이 안되서 혹시나 경험이 있으실지 해서 문의드립니다 ㅠㅠUncaught ReferenceError: jQuery is not defined 

마지막 강의 듣고있는데요 어제까지만 해도 잘되던 로컬호스트 접속이 안됩니다 서버는 기동이 잘되는데  이렇게 접속하면 접속이 안됩니다.. cm 에서 포트 떠있는것도 보이는데 왜그럴까요

마우스가 그림 위에 오버되면 원을 생성하는 인터랙티브 기능을 구현했습니다.사진 안에서만 원들이 생성 되고 사진 영역을 벗어나면 원이 그려지지 않았으면 좋겠는데 어떻게 해야할까요? <div id="leaf"> </div> <body> <script> let leaf = document.getElementById("leaf"); let jean = document.getElementById("jean"); leaf.addEventListener("mouseover",onmouseover); //window.addEventListener("mouseover",onmouseover); function onmouseover(e){ let circle = document.createElement("div"); let radius = Math.floor(Math.random()* 150+50); let randomBrightColor = () => { let color_r = Math.floor(Math.random() * 127 + 128).toString(16); let color_g = Math.floor(Math.random() * 127 + 128).toString(16); let color_b = Math.floor(Math.random() * 127 + 128).toString(16); return `#${color_r+color_g+color_b}`; } circle.style.position = "absolute", circle.style.opacity = Math.random()*0.9 + 0.1; circle.style.width = radius+"px"; circle.style.height = radius+"px"; circle.style.borderRadius = "50%" circle.style.backgroundColor = randomBrightColor(); circle.style.left= e.pageX -radius * 0.5 + "px"; circle.style.top= e.pageY -radius * 0.5 + "px"; circle.style.transform= "scale(0,0)"; gsap.to(circle, {scale:1 , ease: "back.out(1.7)", duration: 0.3}) document.body.appendChild(circle); circle.style.zIndex = "1"; } </script> </body>css 는 다음과 같습니다#leaf{ width: 600px; height: 600px; overflow: hidden; background-image: url(https://images.unsplash.com/photo-1714571883639-fe73d73ef8a9?q=80&w=3387&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D); }  

안녕하세요이 부분에서 갑자기 key value가 나오는데, 이 변수들은 정의되지 않았는데 어떻게 나온건가요? 

3번 출정 인원 선발의 아래 코드에서 질문이 있습니다.if문의 첫 번째 조건에서, 선발된 인원이 2명, 선발해야 하는 인원이 4명, i[1].length가 3일 경우에 조건을 통과하여 선발인원에 push가 되는데, 남은 자리가 2개여서 3명이 추가되면 안되니까 조건이 잘못된 것이 아닌가요??그래서 선발해야하는 인원과 선발된 인원의 차이를 고려하여 첫 번째 조건의 && 뒷부분 조건이 아래 코드블럭처럼 되어야 하는게 아닐지 궁금합니다. 제가 잘못 생각했다면 어느 지점이 잘못된 것일지도 궁금합니다 감사합니다!i[1].length <= 선발해야하는인원 - 선발된 인원