묻고 답해요
158만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결시나브로 자바스크립트
getInitialHTML을 꼭 빌드된 dist 디렉토리 내 파일에서 import하는 이유가 있나요??
routes.js에서 export된 getInitialHTML을 server.js에서 import 해오면 될 것같은데, dist에서 import해 오시는 이유가 궁금합니다.빌드 이후 운영시점에는 server.js에서 개발디렉토리인 src가 아닌 dist를 참조하게 하려는 이유같은데 그것이 맞을까요?
-
미해결애플 웹사이트 인터랙션 클론!
drawImage(objs.videoImages[sequence], 0, 0); error
function setCanvasImages() { let imgElem; for(let i = 0; i < sceneInfo.values.videoImageCount; i++) { imgElem = new Image(); imgElem.src = `./images/picdiet 1/${1 + i}.jpg`; sceneInfo[0].objs.videoImages.push(imgElem); } // /home/ibmuser01/src/images/picdiet 1/1.jpg } setCanvasImages(); function setLayout() { // 각 스크롤 섹션의 높이 세팅 for (let i = 0; i < sceneInfo.length; i++) { if (sceneInfo[i].type === 'sticky') { sceneInfo[i].scrollHeight = sceneInfo[i].heightNum * window.innerHeight; } else if (sceneInfo[i].type === 'normal') { sceneInfo[i].scrollHeight = sceneInfo[i].objs.content.offsetHeight + window.innerHeight * 0.5; } sceneInfo[i].objs.container.style.height = `${sceneInfo[i].scrollHeight}px`; } yOffset = window.pageYOffset; let totalScrollHeight = 0; for (let i = 0; i < sceneInfo.length; i++) { totalScrollHeight += sceneInfo[i].scrollHeight; if (totalScrollHeight >= yOffset) { currentScene = i; break; } } document.body.setAttribute('id', `show-scene-${currentScene}`); } function calcValues(values, currentYOffset) { let rv; // 현재 씬(스크롤섹션)에서 스크롤된 범위를 비율로 구하기 const scrollHeight = sceneInfo[currentScene].scrollHeight; const scrollRatio = currentYOffset / scrollHeight; if (values.length === 3) { // start ~ end 사이에 애니메이션 실행 const partScrollStart = values[2].start * scrollHeight; const partScrollEnd = values[2].end * scrollHeight; const partScrollHeight = partScrollEnd - partScrollStart; if (currentYOffset >= partScrollStart && currentYOffset <= partScrollEnd) { rv = (currentYOffset - partScrollStart) / partScrollHeight * (values[1] - values[0]) + values[0]; } else if (currentYOffset < partScrollStart) { rv = values[0]; } else if (currentYOffset > partScrollEnd) { rv = values[1]; } } else { rv = scrollRatio * (values[1] - values[0]) + values[0]; } return rv; } function playAnimation() { const objs = sceneInfo[currentScene].objs; const values = sceneInfo[currentScene].values; const currentYOffset = yOffset - prevScrollHeight; const scrollHeight = sceneInfo[currentScene].scrollHeight; const scrollRatio = currentYOffset / scrollHeight; switch (currentScene) { case 0: let sequence = Math.round(calcValues(values.imageSequence, currentYOffset)); objs.context.drawImage(objs.videoImages[sequence], 0, 0); if (scrollRatio <= 0.22) { // in objs.messageA.style.opacity = calcValues(values.messageA_opacity_in, currentYOffset); objs.messageA.style.transform = `translate3d(0, ${calcValues(values.messageA_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageA.style.opacity = calcValues(values.messageA_opacity_out, currentYOffset); objs.messageA.style.transform = `translate3d(0, ${calcValues(values.messageA_translateY_out, currentYOffset)}%, 0)`; } if (scrollRatio <= 0.42) { // in objs.messageB.style.opacity = calcValues(values.messageB_opacity_in, currentYOffset); objs.messageB.style.transform = `translate3d(0, ${calcValues(values.messageB_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageB.style.opacity = calcValues(values.messageB_opacity_out, currentYOffset); objs.messageB.style.transform = `translate3d(0, ${calcValues(values.messageB_translateY_out, currentYOffset)}%, 0)`; } if (scrollRatio <= 0.62) { // in objs.messageC.style.opacity = calcValues(values.messageC_opacity_in, currentYOffset); objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageC.style.opacity = calcValues(values.messageC_opacity_out, currentYOffset); objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_out, currentYOffset)}%, 0)`; } if (scrollRatio <= 0.82) { // in objs.messageD.style.opacity = calcValues(values.messageD_opacity_in, currentYOffset); objs.messageD.style.transform = `translate3d(0, ${calcValues(values.messageD_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageD.style.opacity = calcValues(values.messageD_opacity_out, currentYOffset); objs.messageD.style.transform = `translate3d(0, ${calcValues(values.messageD_translateY_out, currentYOffset)}%, 0)`; } break; case 2: // console.log('2 play'); if (scrollRatio <= 0.25) { // in objs.messageA.style.opacity = calcValues(values.messageA_opacity_in, currentYOffset); objs.messageA.style.transform = `translate3d(0, ${calcValues(values.messageA_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageA.style.opacity = calcValues(values.messageA_opacity_out, currentYOffset); objs.messageA.style.transform = `translate3d(0, ${calcValues(values.messageA_translateY_out, currentYOffset)}%, 0)`; } if (scrollRatio <= 0.57) { // in objs.messageB.style.transform = `translate3d(0, ${calcValues(values.messageB_translateY_in, currentYOffset)}%, 0)`; objs.messageB.style.opacity = calcValues(values.messageB_opacity_in, currentYOffset); objs.pinB.style.transform = `scaleY(${calcValues(values.pinB_scaleY, currentYOffset)})`; } else { // out objs.messageB.style.transform = `translate3d(0, ${calcValues(values.messageB_translateY_out, currentYOffset)}%, 0)`; objs.messageB.style.opacity = calcValues(values.messageB_opacity_out, currentYOffset); objs.pinB.style.transform = `scaleY(${calcValues(values.pinB_scaleY, currentYOffset)})`; } if (scrollRatio <= 0.83) { // in objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_in, currentYOffset)}%, 0)`; objs.messageC.style.opacity = calcValues(values.messageC_opacity_in, currentYOffset); objs.pinC.style.transform = `scaleY(${calcValues(values.pinC_scaleY, currentYOffset)})`; } else { // out objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_out, currentYOffset)}%, 0)`; objs.messageC.style.opacity = calcValues(values.messageC_opacity_out, currentYOffset); objs.pinC.style.transform = `scaleY(${calcValues(values.pinC_scaleY, currentYOffset)})`; } break; case 3: // console.log('3 play'); break; } } function scrollLoop() { enterNewScene = false; prevScrollHeight = 0; for (let i = 0; i < currentScene; i++) { prevScrollHeight += sceneInfo[i].scrollHeight; } if (yOffset > prevScrollHeight + sceneInfo[currentScene].scrollHeight){ enterNewScene = true; currentScene++; document.body.setAttribute('id', `show-scene-${currentScene}`); } if(yOffset < prevScrollHeight){ enterNewScene = true; if(currentScene === 0) return; currentScene--; document.body.setAttribute('id', `show-scene-${currentScene}`); } if(enterNewScene) return; playAnimation(); } window.addEventListener('scroll', () => { yOffset = window.pageYOffset; scrollLoop(); }); window.addEventListener('load', setLayout); window.addEventListener('resize', setLayout); })(); main.js:181 Uncaught TypeError: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The provided value is not of type '(CSSImageValue or HTMLCanvasElement or HTMLImageElement or HTMLVideoElement or ImageBitmap or OffscreenCanvas or SVGImageElement or VideoFrame)'. at playAnimation (main.js:181:30) at scrollLoop (main.js:292:9) at main.js:297:9이러한 에러가 나요.이미지 파일은 여기에 저장되어있슴돠.
-
해결됨개발자라면 알아야 할 redis 기본
혹시 kafka나 rabbitMQ 강좌 예정 없으신가요?
혹시 kafka나 rabbitMQ 강좌 예정 없으신가요?
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
렌더링에서 말하는 서버란 무엇인가요?
안녕하세요. 예전부터 궁금했던게 있습니다.이번 사전렌더링 강의에서 계속 설명하는유저-브라우저-서버 개념 에서 서버란 무엇인가요? 단순히 csr은 서버에서 빈껍데기를 먼저주고,초기접속속도가 느리고, ssr은 빈껍데기가아니라 이미 렌더링된 html을 서버에서 받아서 그대로 렌더링하고... 이런 개념들은CSR과 SSR 차이만 검색해도 수많은 블로그와 개념이 나오고, 항상 많이 들어왔고 면접준비했을때도 수없이 외워서 알겠습니다만 여기서 항상 의문이 있었는데요. 여기서 말하는 서버란 대체 무엇인가요?제가 알고있던 서버라는것은 백엔드서버였는데, 이 서버라는 개념이 어려웠습니다.
-
미해결쉽게 시작하는 쿠버네티스(v1.30) - {{ x86-64, arm64 }}
vagrant up 에러
안녕하세요.2.4 강의 내용에서 알려주신 대로 MAC Pro M2 노트북에 순서대로 설치하여 진행하고 있는데요. 우선, vagrant up을 하면 아래와 같은 에러가 발생하고요.VM Fusion은 실행되어 cp-k8s는 보이고 나머지는 안보입니다. 그리고 Tabby도 실행되나 프로필에는 cp-k8s도 뜨지 않는 상홥입니다.이 부분이 강의 중간에 언급하신 load 관련 부분인거 같아서 해당 명령어를 치면 아래와 같은 에러가 나옵니다.다만, load 대신 reload로 하면 아래와 같이 에러 없이 넘어가긴 하는데 에러는 여전히 발생합니다.에러 발생 이유를 알려주시면 해결하고 이후 수업을 열심히 듣도록 하겠습니다. 😀 감사합니다.
-
미해결[개정판] 딥러닝 컴퓨터 비전 완벽 가이드
YOLO 학습
안녕하세요 강사님최근에 YOLO를 이용해 이것 저것 연습을 하는데 궁금한 점이 있습니다.데이터셋의 크기가 너무 커서(2TB) 일단 필요한 부분만 선택해서 학습을 했습니다. 그런데 이렇게 하면 새로운 데이터셋을 추가해서 학습을 시키려면 <기존 1TB + 새로운 데이터셋> 이렇게 합친 데이터셋을 다시 학습을 해야 하나요...?예를 들어 a, b, c, d를 탐지할 수 있게 학습을 하고 추가적으로 ㄱ, ㄴ, ㄷ, ㄹ도 탐지할 수 있게 데이터를 추가해서 총 a, b, c, d, ㄱ, ㄴ, ㄷ, ㄹ을 모두 탐지할 수 있도록...마지막 출력 계층만 새롭게 학습을 하는 방법은 기존 데이터셋에 대한 성능이 떨어질 수 있어 좋은 선택은 아닌가요...?
-
미해결Spring Cloud로 개발하는 마이크로서비스 애플리케이션(MSA)
git에서 설정파일 읽어들일 때 윈도우의 경우 로컬위치가 name에 붙어 나오는 현상
저한테도 있어서 봤는데, 크게 신경 쓸 필요는 없을 것 같습니다.Appdata/local/temp 는 말 그대로 앱의 임시파일 저장하는 곳이고, config 서버 기동 시 git에서 해당 설정파일들을 읽어들여 저 위치에 저장하는 것으로 보입니다.근데 왜 윈도우만 저렇게 임시파일을 저장하고 그 위치의 주소를 붙여서 출력해주는지는 잘 모르겠네요. 맥OS는 그때그때 git에서 파일을 가져오는 것일까요? 제가 맥이 없어서 그걸 모르겠네요.
-
미해결따라하며 배우는 리액트 네이티브 기초
navigation쓸때 오류
Invariant Violation: requireNativeComponent: "RNSScreenStackHeaderConfig" was not found in the UIManager.이런 오류가 나.아마 호환성문제인거 같은데 어떻게 해결해?
-
미해결[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
변수 형식 선언이 안 됐다는 에러
CustomDrawerContent에서 문자 형식이 안 됐다는 에러가 있습니다.
-
미해결MOS Word Core 2016 자격증 따기
시험
선생님 코어시험은 마우스 클릭 잦아도 감점인가요?
-
해결됨데이터분석 준전문가(ADsP) 자격증 대비
099-01. 강의는 어디있나요.....
099-01. 강의는 어디있나요.....무료 강의도 아니고 비용을 지불하고 강의를 듣는데, 이런 사소하지만 반복되는 오류들로 흐름은 계속 끊기고 강의 내용이 좋음에도 불구하고 실망스런 감정만 남습니다....포기하고 듣다보니 난데없이 퀴즈 이후에 099-01.이 나오네요. 영상 수정 필요합니다...
-
미해결자바 ORM 표준 JPA 프로그래밍 - 기본편
persist 호출 시점에 영속성 컨테스트 객체 상태
https://www.inflearn.com/community/questions/336059/%EC%96%91%EB%B0%A9%ED%96%A5-%EC%97%B0%EA%B4%80%EA%B4%80%EA%B3%84-%EC%A3%BC%EC%9D%98%EC%A0%90%EC%97%90-%EA%B4%80%ED%95%9C-%EC%A7%88%EB%AC%B8안녕하세요. 위 질문을 보고 궁금한 점이 생겨서 질문드립니다. 강의에서 진행하는 프로젝트에서 기본키 생성전략을 IDENTITY 라고 하면 em.persist()를 호출하는 시점에 insert 쿼리를 날려서 db에 저장을 하고, 키를 조회해서 영속성 컨텍스트의 키로 사용한다고 이해하고 있습니다. 이 때 영속성 컨텍스트의 키는 실제 DB의 키를 사용하고 영속성 컨텍스트의 엔티티는 DB의 데이터가 아닌 순수 객체가 들어가는 것이 맞나요?
-
미해결
수강 연장 문의드립니다.
안녕하세요 작년 수강 후 불합격하여 올해 다시 재수강중에 있습니다.수강기간이 곧 만료되어서요 올해 10회 실기 시험까지라도 연장이 가능한지 문의드립니다.감사합니다!(이메일 주소 : ajyeon1113@gmail.com)
-
해결됨김영한의 실전 자바 - 고급 1편, 멀티스레드와 동시성
[코드 공유] yield() 유무에 따른 체크 로직 수행 횟수를 확인할 수 있는 코드 공유합니다.
[비교 결론](맥북 프로 2018형 기준)yield() 사용 X: 체크 로직 319_216_379회 수행yield() 사용 O: 체크 로직 000_730_447회 수행[코드 사용법]체크로직 while loop에 있는 Thread.yield();를 주석처리 on/off 하면서 체크하시면 됩니다.프로그램 수행 -> a, b, c, d, e, q를 순서대로 입력위 두 동작을 주석처리 on/off한 후에 실행하는 두 경우 모두에서 비슷한 속도로 해 주시면 비교가 더 명확합니다. [코드 설명]MyPrinterV4 코드를 기준으로 하여 다음과 같이 체크 로직의 수행 횟수를 카운트할 수 있도록 개선했습니다. 러프하게 작성한 코드라서 세부적인 부분은 무시바랍니다.// 체크 로직의 수행 횟수를 기록하는 변수 private static int count = 0;while (!Thread.interrupted()) { if (jobQueue.isEmpty()) { count++; // 체크 로직 수행시 1회 추가 기록 Thread.yield(); // 여기를 On/Off하며 체크 continue; } }// 메인 함수의 마지막 부분에 추가한 코드 // q를 입력하여 프로그램을 종료했을 때까지 수행된 체크 로직의 횟수를 출력 System.out.println(count);[전체 코드]package thread.control.printer; import java.util.Queue; import java.util.Scanner; import java.util.concurrent.ConcurrentLinkedQueue; import static util.MyLogger.log; public class MyPrinterV4 { // 추가된 코드 private static int count = 0; public static void main(String[] args) { Printer printer = new Printer(); Thread printerThread = new Thread(printer, "printer"); printerThread.start(); Scanner userInput = new Scanner(System.in); while (true) { log("프린터할 문서를 입력하세요. 종료 (q): "); String input = userInput.nextLine(); if (input.equals("q")) { printerThread.interrupt(); break; } printer.addJob(input); } // 추가된 코드 System.out.println(count); } static class Printer implements Runnable { Queue<String> jobQueue = new ConcurrentLinkedQueue<>(); @Override public void run() { while (!Thread.interrupted()) { if (jobQueue.isEmpty()) { // 코드 추가된 부분(시작) count++; Thread.yield(); // 주석 on/off 하며 비교 // 코드 추가된 부분(종료) continue; } try { String job = jobQueue.poll(); log("출력 시작: " + job + ", 대기 문서: " + jobQueue); Thread.sleep(3000); log("출력 완료: " + job); } catch (InterruptedException e) { log("인터럽트 발생. message=" + e.getMessage()); break; } } log("프린터 종료"); } public void addJob(String input) { jobQueue.offer(input); } } }
-
미해결실무 활용 SQL 데이터 분석: 효율적인 데이터 처리와 인사이트 도출
12_5 질문3
3번 질문에서 1년 동안 완전히 이용 가능한 listings를 찾기 위해서 SELECT COUNT(DISTINCT id)FROM openairbnb.listings AS lWHERE l.availability_365 = 365;1년 이용가능한 날이 365일인 고유한 id를 추출하는 쿼리를 이용하면 왜 답이 다르게 나온건지 모르겠습니다.
-
해결됨Part2: 초중급 iOS 인스타그램 클론(SwiftUI, MVVM, Firebase, 2024)
62강 Follow, Unfollow기능구현에서,,
7:15까지 코드 따라하고, 구동하는데;;아래와 같이 에러가 뜹니다... Thread 3: Simultaneous accesses to 0x600003d332b0, but modification requires exclusive access 구동조차 안되고 바로 아래와 같이 떠버려요;; 이건 어떻게 해결할가요???
-
미해결Windows System 프로그래밍
해당 강의의 예제에서 키를 눌러도 예외창이 뜨지않아요.
코드는 그대로 복사해서 붙여넣었습니다. 영상에 나온대로 디버그 모드로 실행한 후 키를 눌러도, 예외처리창이 나타나지 않는데.. vs설정이 다른 걸까요? - 예외설정에서 C++ Exceptions, Win32 Exceptions, CommonLanguage Exceptions들을 전부 체크해도 동일합니다. (vscode 예외설정창)(콘솔창/vs출력창)
-
미해결자바 ORM 표준 JPA 프로그래밍 - 기본편
setOrder();를 하신 이유가 궁금합니다.
안녕하세요. 강의 내용 16분30초쯤에Order order = new Order();order.addOrderItem(new OrderItem());위 코드를 아래와같이Order order = new Order();em.persist(order);OrderItem orderItem = new OrderItem();orderItem.setOrder(order); 1. 이렇게 수정하셨는데, 이렇게 하시는 이유가 무엇인가요..? 양방향연관관계라서 addOrderItem()을 통해 양쪽에 값을 설정해줬었는데 왜 아래와 같이 변경하신건지 궁금해서 질문드립니다. 2. Order와 OrderItem간의 관계를 양방향연관관계로 하지말고, OrderItem -> Order 단방향연관관계로 설계해서 OrderItem에만 setOrder()로 설정해주신것일까요??3. 만약 2번의 내용이 맞다면, 그렇게 하신 이유도 궁금합니다... 감사합니다
-
미해결블록체인 기반의 스마트컨트랙트 개발
질문이요
genesis.json 파일을 생성하는 과정이 궁금합니다. 어데 있는 지보신분 알려주시기 부탁 드려요
-
미해결10주완성 C++ 코딩테스트 | 알고리즘 코딩테스트
3-D 불! 코드 질문있습니다.
안녕하십니까 큰돌님 !복습 겸 다시 풀어봤는데 online compiler, Dev-C++ 에서 다 돌아가는데백준에 제출하면 컴파일 에러라고 뜹니다. 컴파일 에러 눌러도 "볼 수 있는 컴파일 에러 정보가 없습니다." 라고 떠서 어디가 문제인지 모르겠습니다. http://boj.kr/8340cd5509f74c90b6e07ca6a552e882 감사합니다. 새해 복 많이 받으세요 !