173만명의 커뮤니티!! 함께 토론해봐요.
미해결
웹 애니메이션의 새로운 표준, Web Animations API
안녕하세요 강의를 들으면서 궁금한 사항이 생겨서 질문드립니다! 1분 코딩님께서 제작하신 강의중에 apple페이지를 클론 코딩하는 강의가 있는데 web animation API를 통해서는 똑같이 만들수없을까요?? 그리고 web animation API를 통해서 canvas를 조작할수는 없을까요?
미해결
웹 애니메이션의 새로운 표준, Web Animations API
현재 리액트 프로젝트에 web animations api를 도입하려고 하는데요. 라이브러리는 react-web-animation을 쓰고 있습니다. 그런데 강의에서 사용한 scroll-timeline.js를 그대로 가져와서 import 하였더니 이러한 에러가 발생합니다. 어떻게 에러를 해결할 수 있을 까요?
미해결
처음하는 플러터(Flutter) 기초부터 실전까지 [풀스택 Part4] (쉽고 견고하게 단계별로 다양한 프로젝트까지)
보통 위젯이 그려지는 상태가 바뀌는 상황일때는 stful 위젯으로 코드를 작성하는데, Provide강의에서는 Stateless위젯으로도 화면에 그려지는 위젯이 바뀌는 원리가 어떻게 되는건가요? Provider 만의 고유 특징인지 아니면 어떤 예외의 원리가 따로 있는건지 궁금해요!
미해결
처음하는 플러터(Flutter) 기초부터 실전까지 [풀스택 Part4] (쉽고 견고하게 단계별로 다양한 프로젝트까지)
12분 50초 쯤에서 나오는 터미널에 명령어 입력하는 부분이 안되네요. 윈도우 사용중이고 디렉토리 루트까지는 갔는데 그 후에 flutterfire 라는게 내외부 명령을 실행할수 있는 배치파일이 아니라고 떠요ㅠ
해결됨
웹 애니메이션의 새로운 표준, Web Animations API
우선 좋은 강의에 감사드립니다. scroll-timeline을 바탕으로 새로운 프로젝트를 작성하고 있는데요, 특정 시점에 요소 opacity 조절로 노출되게끔 처리했습니다. 그런데 이 노출되는 시점에서부터는 특정 스크롤까지 css keyframes로 혼자 깜빡깜빡 거리는 효과를 주고싶은데요. 자바스크립트로 class를 add / remove 해야할지 고민입니다. 더 효율적이거나 좋은 방법이 있을까요?
미해결
next 13으로 typescript와 함께 개발중입니다 어느 순간부터 html태그들과 improt 쪽에 빨간줄이 뜨더니 해결될 생각을 안하더라구요.. 많이 검색해 본 결과. @types/react, @types/react-dom 을 다운받아야 한다고 해서 다운 받았지만 해결이 안되더라구요... 이 외에도 많은 방법들을 시도해 봤지만 효과가 없었습니다. 도와주세요ㅠㅠ 태크에서 나는 에러 : JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists.ts(7026) import문에서 나는 에러: Cannot find module 'next/image' or its corresponding type declarations.ts(2307)
미해결
웹 애니메이션의 새로운 표준, Web Animations API
선생님 안녕하세요 ! 강의를 듣는 중 궁금한 점이 있어 질의 드립니다. section04 - 각각의 객체에 개별 애니메이션 적용하기 영상에서 let bar를 for문 밖에 선언하고 for문 안에서 document.createElement를 할당한 이유가 있을까요? for문 안에 같이 선언하면서 할당하는 코드와 어떤 부분이 다른지 잘 모르겠어서 질의 드립니다. const bars = []; let bar; for(let i = 0; i < 30; i++){ bar = document.createElement('div'); bar.classList.add('bar'); barContainer.appendChild(bar); bars.push(bar); }
미해결
처음하는 플러터(Flutter) 기초부터 실전까지 [풀스택 Part4] (쉽고 견고하게 단계별로 다양한 프로젝트까지)
안녕하세요 제가 초보라 초보적인 질문일 수 있습니다. 제공해주신 코드들을 열어보면 위에 이런식으로 뜨는데, 저는 제가작성해서 실행시키는건 문제없는데 제공된것 포험 다른곳에서 다ㅏ운받아와서 열어보면 sdk를 자꾸 설치하라고 뜨는데(위 사진과 같이) 이 sdk를 링크를 통해 다운받아줘야하나요..? 전 이미 sdk가 있는상태이니까 잘 실행시키고 있을텐데 다른 파일불러오면 다운받으라고 뜨니까 궁금해서 여쭤봅니다
미해결
웹 애니메이션의 새로운 표준, Web Animations API
안녕하세요. 강의 잘 듣고 있습니다. scroll-timeline.js 를 사용한 ScrollTimeline 실행 시, 부드러운 모션 효과를 위한 옵션이 있을까요? 스크롤 한번 했을 때. 스르륵 멈출 수 있게요.
미해결
Next.js로 Google Cloud Platform에 App Engine 서비스 배포를 진행하고 있습니다. 문제는 production ( 실 서비스 )와 development ( 개발용 )으로 나누어서 .env.development, .env.production의 두개의 환경변수를 가지고있습니다. 배포 시 실서비스 에서는 .env.production을 사용하도록 개발용 에서는 .env.development를 사용하도록 설정하려는데 이것저것 만져보아도 production만 사용하는 문제가 발생해버리네요. 현재 프로젝트구조와 설정코드는 이렇습니다. project ├── local └── Dockerfile └── docker-compose.yml ├── resource └── .next └── ... (Next.js 빌드 파일) └── node_modules └── package.json └── dev_app.yaml └── prd_app.yaml └── .env.development └── .env.production └── next.config.js └── ... (기타 Next.js 프로젝트 파일) 여기서 package.json의 script설정은 다음과 같습니다. { dev: "next dev", start: "next start", lint: "next lint", deploy: "npm run build && gcloud app deploy --project='production' -q --appyaml=prd_app.yaml", deploy:dev: "npm run build:dev && gcloud app deploy --project='development' -q --appyaml=dev_app.yaml", build: "dotenv -e .env.production next build", build:dev: "dotenv -e .env.development next build" } next.config.js는 특별히 건드리지 않았습니다. dev_app.yaml, prd_app.yaml파일은 서비스명만 각각 설정해 주었습니다. runtime: nodejs20 # or another supported version service: development 질문 1. 현재 app engine 업로드된 용량, 로직을 보니 빌드파일이 아닌 프로젝트 그대로 들어가는 것 같습니다. 빌드는 환경변수파일도 정상적으로 분기되는데 앱엔진에서 해당문제가 발생하는 것으로보아 혹시 Next.js에서 빌드된 파일로 app engine에 배포할 수 있는지 궁금합니다. 질문 2. 빌드파일만 올릴수 없다 라고 하더라도 프로젝트 그대로 올리면서 환경변수를 분기할 방법이 있는지 궁금합니다. 정말 문서건 블로그건 구글서칭, 깃허브검색, GPT 모두 끈질기게 시도해봤지만 능력부족 탓인지 성공하지 못했습니다.. 능력자분들께서 도움주시면 잊지않겠습니다!!
미해결
웹 애니메이션의 새로운 표준, Web Animations API
안녕하세요! 강의 재밌게 잘 보고 있습니다 :D scroll-timeline.js 파일은 어디서 가져오신 건가요? 세팅부터 혼자서 해보려고 했는데 scroll-timeline 저장소 여기서 아무리 찾아봐도 안 보이네요..! Usage에 보면 import를 dist 폴더에서 scroll-timeline.js를 가져오는 것 같은데 dist 폴더도 안 보이고 src 폴더에 scroll-timeline-base.js도 아닌 것 같아서 질문 남깁니다..! 또, scrollOffsets에 넣는 옵션들은 어떻게 확인하나요? README에는 new CSSUnitValue 이것밖에 안 보이는데 강의에서는 target, edge, threshold 속성들도 쓰셔서 어디서 확인하고 쓰시는지 너무 궁금합니다..!
미해결
웹 애니메이션의 새로운 표준, Web Animations API
Starfiled => Starfield 인 것 같습니다!
미해결
처음하는 플러터(Flutter) 기초부터 실전까지 [풀스택 Part4] (쉽고 견고하게 단계별로 다양한 프로젝트까지)
provider 강의를 듣기 시작했는데 flutter pub add provider을 했을 때 이런 메시지가 떠서 구글링 해보니 zsh에서 플러터 경로를 몰라서 생기는 문제라고 하더라구요. 그래서 경로를 입력해주어야 한다고 하는데 제가 잘못 입력한건지 계속 저런 메시지가 뜹니다 ㅠㅠ 경로 입력 방법에 대해 자세히 설명해주실 수 있을까요 ? ㅠㅠ
미해결
웹 애니메이션의 새로운 표준, Web Animations API
안녕하세요 GroupEffect 수강중에 이런 에러가 떠서요 - 질문에 대한 답변은 강의자가 하는 경우도 있고, 수강생 여러분들이 해주시는 경우도 있습니다. 같이 도와가며 공부해요! :) - 작성하신 소스코드 자체의 오류보다는, 개념이나 원리가 이해되지 않는 부분을 질문해주시는게 좋습니다. 그대로 따라했는데 소스코드에서 버그가 나는 경우는 99%가 오타에 의한거라서, 완성된 소스랑 찬찬히 비교해보시면 직접 찾으실 수 있을 거예요. 개발자도구 console에 오류로 표시된 부분만 완성 코드에서 복사->붙여넣기를 해보시는 것도 방법입니다. - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
미해결
웹 애니메이션의 새로운 표준, Web Animations API
ㅡ
미해결
웹 애니메이션의 새로운 표준, Web Animations API
웹 제작 에디터(아임웹)에서 해당 기능을 사용하려고 합니다. 수업에서는 파일을 불러오는데.. 웹 에디터에서는 그런 기능을 지원하지 않아 전체를 복사해서 붙여 넣었는데 오류가 발생합니다. 외부 기능을 쓰는 web-animations 기능은 cdn으로 적용이 잘 되었습니다. 혹시 scroll-timeline.js 내용도 cdn으로 불러올 수 있는 방법이 있을까요?? 검색해도 찾을 수가 없어 문의드립니다. ^^a
미해결
웹 애니메이션의 새로운 표준, Web Animations API
넓이를 높이를 전부 고정값으로만 사용하게 되는데 혹시 해당 부분은 100% 로 채워서는 적용이 어려울까요? 모바일까지 고려하게되면 퍼센트로 작업해야할것같은데 뭔가 넓이값이 달라지게 되면 중간중간 요소들 컨트롤이 아에 어려운 구조가 될까요?
미해결
처음하는 플러터(Flutter) 기초부터 실전까지 [풀스택 Part4] (쉽고 견고하게 단계별로 다양한 프로젝트까지)
[섹션9. 플러터 개발에 chatGPT 활용 팁] 강의의 팁1, 팁2 강의가 동일합니다. 내용으로 볼 때 팁1 강의에 대한 동영상 업로드에 오류가 있는 것 같습니다.
미해결
웹 애니메이션의 새로운 표준, Web Animations API
안녕하세요 강의를 듣고 직접 작성하면서 적용을 해보려고 하다가 강의에서 사용하는 scroll-timeline polyfill repo 에서 찾아보니 강의에서 사용했던 scrollOfsets을 앞으로는 사용하지 않는 것 같았습니다. 이러한 부분에 대해서 다른 해결법이 또 있을까요? 아래의 링크에 방법이 있긴 합니다만 조금 더 효율적인 방법이 있는지 궁금했습니다! 추가로 react에서도 사용하려고 했지만 Npm에서는 관련한 패키지가 없는 것 같아서 혹시 react에서 적용해보신 적이 있으실까요?! https://github.com/flackr/scroll-timeline/issues/64
미해결
웹 애니메이션의 새로운 표준, Web Animations API
1년동안 쇼핑몰 인하우스 간단한 퍼블 업무하다가 이직 준비하면서 공부중인데 궁금한점이있어서요 스크롤 애니메이션할때 간단한 효과는 aos, 디테일한건 gsap을 많이 쓴다고 들었거든요 이 강의의 web api 애니메이션을 습득하면 실무에서 gsap 으로 할수있는건 대부분 할 수 있는건가요? 물론 완전히 대체는 안되겠지만 왠만한건 가능한건가요 제가 gsap도 아직 공부할 예정이라 자세히 몰라서 질문드립니다ㅎ
