묻고 답해요
141만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨타입스크립트 입문 - 기초부터 실전까지
vue 에서 jquery 사용 문제
안녕하세요.vue 사용중에 있어 부득이하게 jquery 를 사용하려고 하는데요.import $ from 'jquery';import 'jqueryui';import 'jquery-ui-touch-punch';모바일까지 지원을 해야해서 jquery-ui-touch-punch 까지 사용을 해야 하는 상황입니다.위와 같이 import를 해주면 코드툴에선 에러가 안뜨는데 브라우저 화면에서는 콘솔에러가 나타나고 있습니다.아래와 같은 오류인데 혹시 해결책이 있을까요? 여러 방법으로 시도해 보고 있으나 해결이 안되서 혹시나 경험이 있으실지 해서 문의드립니다 ㅠㅠUncaught ReferenceError: jQuery is not defined
-
미해결
마우스오버 이벤트가 특정 영역 안에서만 이루어졌으면 좋겠습니다.
마우스가 그림 위에 오버되면 원을 생성하는 인터랙티브 기능을 구현했습니다.사진 안에서만 원들이 생성 되고 사진 영역을 벗어나면 원이 그려지지 않았으면 좋겠는데 어떻게 해야할까요? <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); }
-
해결됨실무에 바로 적용하는 프런트엔드 테스트 - 1부. 테스트 기초: 단위・통합 테스트
mockServiceWorker.js 파일이 프로젝트내에 포함되어 있어야 하나요?
실무에 적용하려고 하니 msw 에서 많이 막히네요 ㅠ 그래서 올려주신 깃헙 프로젝트를 샅샅히 훑어보고 있는데 mockServiceWorker.js 이 파일과 package.json에"msw": { "workerDirectory": "public" } 요런 부분이 있더라고요. 요것들의 역할이 뭔지 알수 있을까요? msw 사이트에 가서 Getting started 를 가봐도 안나와 있는것 같아서 궁금합니다!
-
해결됨Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃허브 vue-todo 접근불가에 따른 확인요청
깃허브 권한이 별도 없다고해주셨는데, 아래와같이 vue-todo 접근이 불가해서 확인부탁드리려합니다.
-
해결됨웹 프론트엔드를 위한 자바스크립트 첫걸음
HTML, CSS에 대한 선수 지식은 어느 정도로 필요한가요?
HTML이랑 CSS 아는 게 얼마 없는데 이 상태로 공부하면 하다가 막힐까요? 그리고 출판사에서 전자책 출간 일자 답변은 아직인지요..ㅠㅠ
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
Bearer라는 단어로 작성하는 이유가 있나요?
항상 좋은 강의 감사합니다.예전에 프론트 개발 할 때도 궁금했던 부분인데Bearer 를 굳이 작성하는 이유나 혹은 작성하게 된 관습의 기원이 궁금합니다.
-
미해결
puppeteer 네이버 로그인
안녕하세요. 제가 프로그램을 만들고 있습니다.네이버 로그인을 puppeteer로 자동화를 하려고 하고있습니다.하지만 네이버에서 매크로 프로그램으로 로그인을 하는것을 막고 있습니다 ㅠㅠ로그인을 자동화 시키려하면 캡챠로 넘어가서 다른 방법이 있는지 알아보는 와중복사 붙여넣기 기능을 하면 된다고 구글링을 통해 봤습니다.하지만 복사 붙여기능또한 네이버 로그인에서는 안되게 막아놓은것 같습니다.. 혹시 네이버 로그인 자동화를 구현하신 분 있는 멋진분을 찾습니당.
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
relation option "nullable : false" 로 설정했는데, 테이블에 insert가 되고 있습니다.
안녕하세요 선생님~위와 같이 세팅해서user/profile로 post 요청을 보내면 500 에러가 나야하는걸로 알고 있는데,이처럼 잘 들어가 버리네요ㅜ`users` 로 get요청을 보내도 profile이 null이 들어간 상태로 조회됩니다.개발환경 버전도 올려드립니다~
-
미해결[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
map 함수에서 cannot read properties of undefined 에러 발생
강사님이 알려주신 대로 작성했는데 해당 부분에서 Cannot read properties of undefined (reading 'map') 이라는 오류가 발생합니다.ㅠㅠ 오타가 있는것 같지는 않은데..어디가 문제일까요..?
-
해결됨진짜! 자바스크립트(Javascript) - 기초부터 고급까지
var 변수의 문제점 설명하실 때 질문 있습니다.
function testShadowing() { let x = 5; if (true) { let x = 10; console.log(x); } console.log(x); } testShadowing()위와 같이 let으로 x 변수를 2번 할당했는데, 실제 메모리에는 어떻게 할당이 되나요?블록 스코프라고 하더라도 함수 스코프 안에서 블록 스코프가 만들어 질 것으로 생각이 되는데(뇌피셜입니다.), 이미 함수 스코프에서 x라는 변수명을 사용하고 있어서 블록 스코프에서 x는 자바 스크립트 엔진에서 어떻게 받아들이고 실제 메모리에 어떤 식으로 메모리 할당을 하는지 궁금합니다.
-
미해결[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
오픈그래프 태그
배포 후 링크 공유하는데 오픈 그래프 태그가 나타나지 않습니다.ㅜㅜ
-
미해결[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
리랜더링 highLight 질문..
10.3) React.memo와 컴포넌트 렌더링 최적화위 강의를 보다보니, 뭔가 이상해서 질문드립니다...여기서 Header컴포넌트에 memo함수로 감싸서최적화된 컴포넌트를 만드셨다고 했는데, 영상으로만 보면item 컴포넌트 변경시에 리랜더링이 안되야 하는 Header 컴폰넌트에 highLight가 들어가는데요..(4:46 경..)아무리 봐도 하이라이트가 들어가는데, 말씀으로는 하이라이트가 더이상 들어가지 않는다고 하는데, 제가 뭘 잘못 이해한걸까요?
-
해결됨[JS] Phaser 게임 제작 - 뱀파이어 서바이벌 클론
catnip 이펙트 범위가 이상하네요
디버깅으로 확인했는데, catnip의 써클 범위가 캐릭터가 이동할 때 마다 캐릭터 중심에서 살짝 어긋나는데, 캐릭터의 중심에 고정할 수 있을까요?import Phaser from "phaser"; import Player from "../characters/Player" export default class Catnip extends Phaser.Physics.Arcade.Sprite { // scene의 startingPosition 위치에 데미지 damage와 크기 scale의 Catnip을 생성합니다. constructor(scene, startingPosition, damage, scale) { super(scene, startingPosition[0], startingPosition[1], "catnip"); // 화면 및 물리엔진에 추가합니다. scene.add.existing(this); scene.physics.world.enableBody(this); // Catnip은 static 공격입니다. (플레이어 주변에만 발생하고 몹으로 이동하지 않음) scene.m_weaponStatic.add(this); // 데미지를 멤버 변수로 설정해줍니다. this.m_damage = damage; // 크기, 투명도, depth를 설정해줍니다. this.scale = scale; this.alpha = 0.5; this.setDepth(5); // catnip은 동그랗게 생겼으므로 물리적 영역을 원으로 설정해줍니다. this.setCircle(30); // 애니메이션을 재생합니다. this.play("catnip_anim"); } // 플레이어가 움직이면 Catnip도 따라 움직여야 하므로 move 메서드를 만들어주었습니다. move(vector) { this.x += vector[0] * 4; this.y += vector[1] * 4; } }
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
혼자 푼 것 코드리뷰 부탁드립니다!
// 한 개의 문자열 s와 문자 t가 주어지면 문자열 s의 각 문자가 문자 t와 떨어진 최소거리 function solution(str = "", char = "") { let answer = []; let count = 0; for (let i = 0; i < str.length; i++) { if (str[i] === char) { count = 0; answer.push(count); } else { count++; answer.push(count); } } count = 1; for (let i = answer.length - 1; i >= 0; i--) { if (i > 0 && answer[i - 1] > count) { answer[i - 1] = count; count++; } else { count = 1; } } return answer; } console.log(solution("teachermode", "e")); // 1 0 1 2 1 0 1 2 2 1 0혹시나 반례나 수정할 곳 있으면 조언 부탁드려요!
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
Prettier 적용 안되는 이슈
강의에서 소개해주신 것 처럼 Format on Save 옵션을 적용하였는데도, 저장 시 자동으로 Formatter가 작동하지 않아 서치해보니,Default Formatter 옵션이 위처럼 없음(null)로 설정이 된 경우에는 Prettier로 적용해주어야 정상동작하더라구요.해당 내용 공유드려요 ㅎ
-
해결됨Vue 3 시작하기
vue 개발자도구 refresh event 문제
component events에서 refresh log가 보이지 않습니다.component의 event listners에서 refresh: not declared인 것이 문제일까요?코드도 함께 첨부합니다.
-
해결됨[JS] Phaser 게임 제작 - 뱀파이어 서바이벌 클론
addAttackEvent 속도가 너무 빠르면 이런 오류가 발생하네요
addAttackEvent(this, "beam", 3, 1, 100)속도를 위처럼 빠르게 하면 몹이 한마리 죽으면서 아래 오류가 나오는데 이런 경우는 어떻게 해야하나요?beam.js:31 Uncaught RangeError: Maximum call stack size exceeded at Beam.setVelocity (beam.js:31:19) at Beam.setVelocity (beam.js:32:18) at Beam.setVelocity (beam.js:32:18) at Beam.setVelocity (beam.js:32:18) at Beam.setVelocity (beam.js:32:18) at Beam.setVelocity (beam.js:32:18) at Beam.setVelocity (beam.js:32:18) at Beam.setVelocity (beam.js:32:18) at Beam.setVelocity (beam.js:32:18) at Beam.setVelocity (beam.js:32:18)
-
미해결
javascript 공부없이 바로 react native 배워도 되나요?
html/css, jQuery, Java Script, react까지 3년전에 배웠었어요.현재는 html/css 코드를 보고 읽고 간단한 건 수정할 수 있는 정도의 수준입니다. 개인적인 흥미로 취미로 개발을 배워보고 싶은데 시작하면 앱 개발, 유지/보수 할 수 있는 수준으로는 배우고 싶어요. 과외로 배울 예정인데 2분의 선생님을 소개받았는데 어떤 분의 루트가 더 나을지 판단이 어려워 전문가분들의 의견 구합니다.html/css > Java > react > react native까지 차근히 배우는 선생님React native와 Java Script를 병행으로 배우는 선생님 1번 선생님의 경우, 현직자이신 것 같진 않고 강의를 위주로 하시는 분 같고 2번 선생님은 현직 개발자로 7년차이세요. 2번 선생님의 경우 함수선언을 영어로 치면 숙어라고 생각하고 배울 수 있을 것 같다고 설명해주셨어요. 리엑트 네이티브에서 사용했던 언어들이 java Script에서 조금 변형된 것들이라고 기억하고 있어서 2번 선생님이 더 속성으로 배울 수 있을 것 같긴 한데(기간은 1년정도 생각합니다) 나중에 혼자 앱 개발을 하는 상황을 생각하면 처음부터 꼼꼼히 배우는게 나을까요?
-
해결됨React + GPT API로 AI회고록 서비스 개발 (원데이 클래스)
프롬프트 내용은 어디서 볼수있나요?
안녕하세요 강사님 강의 정말 잘 듣고있습니다.다름이 아니라 프롬프트의 내용이 꽤 긴데 혹시 복붙할 수 있는 페이지는 따로 없는지 궁금합니다..! 제가 못찾은것일수도 있어서 조심스럽게 문의드립니다
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
컬럼 애너테이션 update property
update 프로퍼티를 false로 작성했는데도 500에러가 발생하지 않네요response에는 변경된 값이 나옵니다.http://localhost:3000/users/:id{ "id": 2, "title": "null0", "createdAt": "2024-03-24T23:59:11.774Z", "updatedAt": "2024-03-24T23:59:11.774Z", "version": 1, "additionalId": "a320e186-a44a-4dda-9af3-9cd52af4155c" }그런데 DB에 가보면 또 값은 변경되어 있지 않더라구요 2번 user의 title 값은 null이 그대로 찍혀있습니다.왜 500에러가 발생하지 않는건가요?