단순히 파일의 절대경로만 view에게 건네주면 img태그에서 이미지를 불러올 수 있지 않나요??    

  저는 조건문을 여러개로 나눠 작성했는데.. lt rt는 생각도 못했어요ㅠ 질문1, 혹시 제 코드는 어떤가요?? 질문2. 인풋값의 범위가 커질 경우에는 강의에서 가르쳐주신대로 투포인터? 로 푸는게 제 코드보다는 훨씬 낫겠죠?? import sys from collections import deque read_file = open("/Users/Downloads/pythonalgorithm_formac/이분탐색&그리디/9. 증가수열 만들기/in5.txt", 'r') input = read_file.readline n = int(input()) nums = list(map(int, input().split())) nums = deque(nums) LR = "" temp = [] # 왼, 오 비교해서 더 작은 값 가져오는데, 그 수가 이미 만들어진 증가수열의 맨 끝 값보다 커야 함. # 그리고 가져오는 원소 위치에 따라 L, R 기록 # 최종 증가수열 원소의 갯수 카운팅 temp.append(0) while nums: if len(nums) == 1 and temp[-1] > nums[0]: if (nums[0] > int(temp[-1])): LR += 'L' break if (nums[0] < nums[-1]): if (nums[0] > int(temp[-1])): LR += 'L' temp.append(nums.popleft()) elif (nums[-1] > int(temp[-1])): LR += 'R' temp.append(nums.pop()) else: break elif (nums[0] > nums[-1]): if (nums[-1] > int(temp[-1])): LR += 'R' temp.append(nums.pop()) elif (nums[0] > int(temp[-1])): LR += 'L' temp.append(nums.popleft()) else: break print(len(temp)-1) print(LR) read_file.close()  

33분쯤  public String deQueue(){ return shelf.remove(0);   <-  Arraylist 목록에서 제거하는 메소드인데 리턴은 왜해주나요 ??

안녕하세요. 이건..그냥 궁금해서 여쭤보는건데요   우리가 트랜잭션을 걸지않아도 데이터베이스에서 내부적으로 알아서  트랜잭션 개념을 가지고있다고하면  저희가 그럼 트랜잭션을 선언해서 할 필요성이 있을까용 ?

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요.1. 강의 내용과 관련된 질문을 남겨주세요.2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요.(자주 하는 질문 링크: https://bit.ly/3fX6ygx)3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요.(질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG)질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요.=========================================[질문 템플릿]1. 강의 내용과 관련된 질문인가요? (예/아니오)2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오)3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오)[질문 내용]여기에 질문 내용을 남겨주세요.   아래와 같이 엔티티의 특정 필드만 가져오는 경우 반환 타입이 불명확하므로 설명해주신대로 Query객체로 반환이 되는데요, 그러면 이 또한 마찬가지로 query.getResultList()로 리스트로 반환하여 사용하는 것 인가요?   리스트로 반환받아봤는데도 제대로 동작하지 않는것 같아 질문 드립니다.   감사합니다.

Recover Your Banned Instagram Account maintains whatever authority is needed to erase a record that disregards their terms of purpose. Assuming that your record has been restricted, the accompanying advances ought to assist you with recuperating it: 1.       You should do this on a personal computer. Guarantee the PC is working on your home IP address instead of intermediaries and VPNs. 2.       Go to https://help.instagram.com/contact/1652567838289083 and finish up the structure you find. 3.       Continuously pick No. 4.       Select anything name you need. It doesn't make any difference which name you select. 5.       Enter your Instagram account username. 6.       Enter your email address. 7.       Continuously pick the United States choice regardless of whether you are not from this country. 8.       After you have finished up the structure, you will receive an email from Instagram in almost no time. 9.       Connect your selfie as expressed in the email and press send.

안녕하세요. 출간하신 Pytorch 입문 책과 함께 공부 중에 GAN 파트에서 질문이 있습니다. 영상에서와 다르게 책에서는 활성화함수층에 일부는 inplace=True 를 설정하여 주셨는데, 그 이유가 무엇인지 잘 이해가 잘 안가고 헷갈리네요. 

Go to Binance.com and click [Register]   Click [Mobile] and enter the mobile number and password for your account, and the Referral ID (if any). Read and agree to the Terms of Use and click [Create Account].       Complete the Security Verification   The system will send an SMS verification code to your mobile phone. Please enter the 6-digit verification code within 30 minutes. If you can’t receive it, click [Resend], or click [Please try voice verification] to use voice verification instead   Congratulations, you have successfully registered on Binance   To enhance your account security, click [Go to Dashboard] to enable two-factor authentication (2FA), including phone verification and Google verification   Note   For account safety, the password should consist of at least 8 characters, including 1 uppercase character and 1 number. If you’ve been referred to register on Binance by a friend, make sure to fill in the Referral ID (optional).

Learn how to delete an Instagram account permanently or disable your account temporarily. Instructions to delete an Instagram account is an inquiry more individuals are posing as concern develops over protection and how much time we spend on informal communities. There's no rejecting that Instagram's an incredible stage for displaying imaginative work and in any event, for selling work straightforwardly, as well with respect to sharing individual information and encounters. With in excess of a billion clients, it's one of the most famous informal communities on the planet and an enormous expected apparatus for contacting a greater crowd.

마우스로 잘못 눌렀더니 지워도 스프링에서 자바 프로젝트를 다시 만들면 다 저렇게 src 하위 폴더가 밖으로 나옵니다. 다시 src 폴더에 어떻게 넣을 수 있을까요? 드랍 방법은 해결책이 아닌거 같고 매번 프로젝트 생성할 때마다 src 하위폴더가 밖으로 나옵니다. 이클립스에선 안그랬는데 스프링은 원래 밖으로 나오는 건가요"??

안녕하세요.   강의자료 메일로 공유 요청드립니다. (jkim@halla.com) 감사합니다.

안녕하세요! 강의를 수강중인 학생입니다!강의를 보면서 서버를 작성해보다가 에러가 발생했습니다. 에러메시지를 보고 경로 문제인것을 확인했습니다.   그런데 같은 폴더 안에서 해당 파일을 readFile()로 불러왔는데 이름도 경로도 모두 맞는데 어떤 부분때문에 읽지를 못하는 걸까요?ㅠ 코드를 깃에서 받아서 그대로 실행했는데 파일을 읽어오지 못합니다ㅠ! 단순한 문제인것 같은데 번거롭게 해드려서 죄송합니다 ㅠㅠ 확인해주시면 감사하겠습니다!

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.     안녕하세요 3.파일럿 PC 환경 구성 - 개발환경 5분 45초에서 Path 변수가 이미 등록되어있어서 편집을 눌렀는데 아래와 같이 나왔습니다.     강의내용과 조금 다르고 전체 값이 안 나와있어서 어떻게 해야할 지 모르겠어요.        

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요.1. 강의 내용과 관련된 질문을 남겨주세요.2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요.(자주 하는 질문 링크: https://bit.ly/3fX6ygx)3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요.(질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG)질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요.=========================================[질문 템플릿]1. 강의 내용과 관련된 질문인가요? (예/아니오)2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오)3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오)[질문 내용]여기에 질문 내용을 남겨주세요. 안녕하세요 선생님. 좋은 강의 늘 감사드립니다.   스프링 기본 편부터 해서, 생성자 주입을 선택하는 것에 여러 장점들이 있고 그 중 테스트케이스를 작성하는 데 용이 하다는 설명을 들었는데요.   다른 부분은 납득이 되었으나 테스트케이스 작성의 용이함은 무엇일까? 하고 여러 번 생각해봤는데 답을 내릴 수가 없어서 질문 드립니다.   본 예제코드에서도 테스트 코드에서 결국   @AutowiredMemberService memberService;   @Autowired MemberRepository memberRepository;   로 테스트 클래스에 직접 빈을 주입 받아서 해당 메소드를 사용했는데요. 이 경우 실제 클래스에서 DI 주입 방식을 어떤식으로 선택하든 테스트 케이스에서 차이가 없지 않나요?   생성자 주입이 테스트 코드 작성에 용이하다는 부분이 어떤 부분인지 잘 모르겠어요 ㅠ

제 버전 이슈인지는 모르겠으나, send 라는 친구가 req.body 안에 정보를 넣어주는 역할을 하는데 이게 undefined 로 인식되는 문제가 있었습니다.그래서 무조건 invalid case 에 해당하는 이슈는 다음 셋팅으로 해결이 될수도 있습니다. await request(app)             .post('/products/')             .set('Content-Type', 'application/json')             .set('Accept', 'application/json') 단, req.body 안에 정보를 바로 넣지않고 저처럼 req.body.product 안에 넣으신 분들(다음 예시) {     "product": {         "name": "gloves",         "description": "good to use it",         "price": 15     } } send 안에 다음과 같이 작성해서 안전하게 넘길 수 있습니다. await request(app)             .post('/products/')             .set('Content-Type', 'application/json')             .set('Accept', 'application/json')             .send({ ...product });  

안녕하세요. 강의자료 요청드립니다. bhimaria1@naver.com 감사합니다.

왜 계속 에러가 나는걸까요?!   npm WARN old lockfile npm WARN old lockfile The package-lock.json file was created with an old version of npm, npm WARN old lockfile so supplemental metadata must be fetched from the registry. npm WARN old lockfile npm WARN old lockfile This is a one-time fix-up, please be patient... npm WARN old lockfile npm WARN deprecated ini@1.3.5: Please update to ini >=1.3.6 to avoid a prototype pollution issue npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated npm WARN deprecated mkdirp@0.5.4: Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x. (Note that the API surface has changed to use Promises in 1.x.) npm WARN deprecated source-map-resolve@0.5.3: See https://github.com/lydell/source-map-resolve#deprecated npm WARN deprecated chokidar@2.1.8: Chokidar 2 does not receive security updates since 2019. Upgrade to chokidar 3 with 15x fewer dependencies npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated npm WARN deprecated source-map-url@0.4.0: See https://github.com/lydell/source-map-url#deprecated npm WARN deprecated debug@4.1.1: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797) npm WARN deprecated debug@3.2.6: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797) npm WARN deprecated debug@3.2.6: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797) npm WARN deprecated bcrypt@3.0.8: versions < v5.0.0 do not handle NUL in passwords properly npm WARN deprecated node-pre-gyp@0.14.0: Please upgrade to @mapbox/node-pre-gyp: the non-scoped node-pre-gyp package is deprecated and only the @mapbox scoped package will recieve updates in the future npm ERR! code 1 npm ERR! path C:\Users\ravio\Desktop\myProj\clonefile\boilerplate-mern-stack\node_modules\bcrypt npm ERR! command failed npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node-pre-gyp install --fallback-to-build npm ERR! Failed to execute 'C:\Program Files\nodejs\node.exe C:\Users\ravio\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --module=C:\Users\ravio\Desktop\myProj\clonefile\boilerplate-mern-stack\node_modules\bcrypt\lib\binding\bcrypt_lib.node --module_name=bcrypt_lib --module_path=C:\Users\ravio\Desktop\myProj\clonefile\boilerplate-mern-stack\node_modules\bcrypt\lib\binding --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v93' (1) npm ERR! node-pre-gyp info it worked if it ends with ok npm ERR! node-pre-gyp info using node-pre-gyp@0.14.0 npm ERR! node-pre-gyp info using node@16.13.1 | win32 | x64 npm ERR! node-pre-gyp WARN Using needle for node-pre-gyp https download npm ERR! node-pre-gyp info check checked for "C:\Users\ravio\Desktop\myProj\clonefile\boilerplate-mern-stack\node_modules\bcrypt\lib\binding\bcrypt_lib.node" (not found) npm ERR! node-pre-gyp http GET https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v93-win32-x64-unknown.tar.gz npm ERR! node-pre-gyp http 404 https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v93-win32-x64-unknown.tar.gz npm ERR! node-pre-gyp WARN Tried to download(404): https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v93-win32-x64-unknown.tar.gz npm ERR! node-pre-gyp WARN Pre-built binaries not found for bcrypt@3.0.8 and node@16.13.1 (node-v93 ABI, unknown) (falling back to source compile with node-gyp) npm ERR! node-pre-gyp http 404 status code downloading tarball https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v93-win32-x64-unknown.tar.gz npm ERR! gyp info it worked if it ends with ok npm ERR! gyp info using node-gyp@9.0.0 npm ERR! gyp info using node@16.13.1 | win32 | x64 npm ERR! gyp info ok npm ERR! gyp info it worked if it ends with ok npm ERR! gyp info using node-gyp@9.0.0 npm ERR! gyp info using node@16.13.1 | win32 | x64 npm ERR! gyp info find Python using Python version 3.10.1 found at "C:\Users\ravio\AppData\Local\Programs\Python\Python310\python.exe" npm ERR! gyp ERR! find VS npm ERR! gyp ERR! find VS msvs_version not set from command line or npm config npm ERR! gyp ERR! find VS VCINSTALLDIR not set, not running in VS Command Prompt npm ERR! gyp ERR! find VS could not use PowerShell to find Visual Studio 2017 or newer, try re-running with '--loglevel silly' for more details npm ERR! gyp ERR! find VS looking for Visual Studio 2015 npm ERR! gyp ERR! find VS - not found npm ERR! gyp ERR! find VS not looking for VS2013 as it is only supported up to Node.js 8 npm ERR! gyp ERR! find VS npm ERR! gyp ERR! find VS ************************************************************** npm ERR! gyp ERR! find VS You need to install the latest version of Visual Studio npm ERR! gyp ERR! find VS including the "Desktop development with C++" workload. npm ERR! gyp ERR! find VS For more information consult the documentation at: npm ERR! gyp ERR! find VS https://github.com/nodejs/node-gyp#on-windows npm ERR! gyp ERR! find VS ************************************************************** npm ERR! gyp ERR! find VS npm ERR! gyp ERR! configure error npm ERR! gyp ERR! stack Error: Could not find any Visual Studio installation to use npm ERR! gyp ERR! stack at VisualStudioFinder.fail (C:\Users\ravio\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\find-visualstudio.js:122:47) npm ERR! gyp ERR! stack at C:\Users\ravio\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\find-visualstudio.js:75:16 npm ERR! gyp ERR! stack at VisualStudioFinder.findVisualStudio2013 (C:\Users\ravio\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\find-visualstudio.js:363:14) npm ERR! gyp ERR! stack at C:\Users\ravio\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\find-visualstudio.js:71:14 npm ERR! gyp ERR! stack at C:\Users\ravio\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\find-visualstudio.js:384:16 npm ERR! gyp ERR! stack at C:\Users\ravio\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\util.js:54:7 npm ERR! gyp ERR! stack at C:\Users\ravio\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\util.js:33:16 npm ERR! gyp ERR! stack at ChildProcess.exithandler (node:child_process:404:5) npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:390:28) npm ERR! gyp ERR! stack at maybeClose (node:internal/child_process:1064:16) npm ERR! gyp ERR! System Windows_NT 10.0.22000 npm ERR! gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\ravio\\AppData\\Roaming\\npm\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "configure" "--fallback-to-build" "--module=C:\\Users\\ravio\\Desktop\\myProj\\clonefile\\boilerplate-mern-stack\\node_modules\\bcrypt\\lib\\binding\\bcrypt_lib.node" "--module_name=bcrypt_lib" "--module_path=C:\\Users\\ravio\\Desktop\\myProj\\clonefile\\boilerplate-mern-stack\\node_modules\\bcrypt\\lib\\binding" "--napi_version=8" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v93" npm ERR! gyp ERR! cwd C:\Users\ravio\Desktop\myProj\clonefile\boilerplate-mern-stack\node_modules\bcrypt npm ERR! gyp ERR! node -v v16.13.1 npm ERR! gyp ERR! node-gyp -v v9.0.0 npm ERR! gyp ERR! not ok npm ERR! node-pre-gyp ERR! build error npm ERR! node-pre-gyp ERR! stack Error: Failed to execute 'C:\Program Files\nodejs\node.exe C:\Users\ravio\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --module=C:\Users\ravio\Desktop\myProj\clonefile\boilerplate-mern-stack\node_modules\bcrypt\lib\binding\bcrypt_lib.node --module_name=bcrypt_lib --module_path=C:\Users\ravio\Desktop\myProj\clonefile\boilerplate-mern-stack\node_modules\bcrypt\lib\binding --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v93' (1) npm ERR! node-pre-gyp ERR! stack at ChildProcess.<anonymous> (C:\Users\ravio\Desktop\myProj\clonefile\boilerplate-mern-stack\node_modules\node-pre-gyp\lib\util\compile.js:83:29) npm ERR! node-pre-gyp ERR! stack at ChildProcess.emit (node:events:390:28) npm ERR! node-pre-gyp ERR! stack at maybeClose (node:internal/child_process:1064:16) npm ERR! node-pre-gyp ERR! stack at Process.ChildProcess._handle.onexit (node:internal/child_process:301:5) npm ERR! node-pre-gyp ERR! System Windows_NT 10.0.22000 npm ERR! node-pre-gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\ravio\\Desktop\\myProj\\clonefile\\boilerplate-mern-stack\\node_modules\\node-pre-gyp\\bin\\node-pre-gyp" "install" "--fallback-to-build" npm ERR! node-pre-gyp ERR! cwd C:\Users\ravio\Desktop\myProj\clonefile\boilerplate-mern-stack\node_modules\bcrypt npm ERR! node-pre-gyp ERR! node -v v16.13.1 npm ERR! node-pre-gyp ERR! node-pre-gyp -v v0.14.0 npm ERR! node-pre-gyp ERR! not ok npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\ravio\AppData\Local\npm-cache\_logs\2022-04-20T07_09_46_710Z-debug-0.log 

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요.1. 강의 내용과 관련된 질문을 남겨주세요.2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요.(자주 하는 질문 링크: https://bit.ly/3fX6ygx)3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요.(질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG)질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요.=========================================[질문 템플릿]1. 강의 내용과 관련된 질문인가요? (예/아니오)2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오)3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오)[질문 내용] 안녕하세요. 좋은 강의 항상 감사드립니다.   MemberService/validateDuplicateMember 메소드에서   throw new IllegalStateException("이미 존재하는 회원입니다.");   로 예외를 던지는데요.   예외처리에 대해서 공부를 했는데도 의문이 풀리지 않아 질문을 남기게 됩니다.   만약에 메소드 자체가 throw로 Exception을 던지게 되면 그 메소드를 호출한 메소드에서 예외를 잡아줘야 하고, 끝까지 예외를 잡지 않(못)으면 스레드 자체가 종료되어 버리잖아요?   그래서 해당 메소드의 내부에서 if 문의 조건을 걸고, 그 조건에 해당하면 바로 예외를 던진 것으로 보이는데, 제가 궁금한 부분은 "throw new IllegalStateException"으로 예외를 던졌으나 return을 즉시 반환한다거나 Rollback 등, 즉 예외처리 로직을 기입하지 않았는데... 그렇다면 아무 예외처리 로직 없는 저 예외처리는 어떻게 작동되는 건가요..?   예외처리를 던진 메소드 영역의 메모리만 꺼버리는 건지.. 도움 부탁드립니다!

지금 16강 수강중이구요 스크롤 애니메이션을 vue에서 따라 작성해보고있는데 .. 값이 다르게 찍히는게 있어서 혹시나 해결방법을 아시는지 궁금해서 여쭤봅니다. ㅠㅠ 다른 부분들은 나름 어거지로??어떻게 따라와서 텍스트 하나를 나타나고 사라지게 하는게 되긴하는데 ... 추후 강의를 똑같이 따라갈 수 있을런지...   제 이슈는 이렇습니다. value값이 동일하게 찍히질않습니다. 강의에서는 아래처럼 values.length값이 배열로 잘 나오는데..   저는 value값을 콘솔로 찍었을 때는 이렇게나오고 values[0]은 undefined로 나와버려서 length값 체크도못하고 calcValue함수 내에서도 이런식으로 작성하면서 따라했거든요 .. object name을 콕 찝어서 데려와야만 배열값을 얻어요.. 배열로얻어오지못하니 강의와 똑같이 구현해보려고 calcvalue함수를 copy해서 하나는 in 하나는 out으로하는 무지막지한 코드를 작성해놨어요🤯🤯   같은 자바스크립트인데 환경좀 다르다고 이렇게 value값이 다를일인가요........... value의 배열값을 강의처럼 얻을수없다면 제 vue 스크롤연습은 여기서 접어야하는걸까요..?........ 이후 강의는 따라해볼 엄두가 안나네요 ..ㅜ 이틀 삽질하다 슬퍼서 질문올려봅니다... full code남기며 ... 질문마무리하겠습니다🥺   <template> <div class="main" ref="scrollWrap"> <section class="scroll-section" id="scroll-section-0" ref="scrollSection0"> <div class="hero" :style="`background-image: url(${이미지})`"> <div class="text-test">소환사 여러분</div> <div class="sticky-elem hero-message a" ref="message1"> <div class="year">10th ANNIVERSARY</div> </div> <!-- <div class="sticky-elem hero-message b" ref="message2"> <div class="thanks">THANK YOU SUMMONERS</div> </div> <div class="sticky-elem hero-message c" ref="message3"> <div class="greeting">리그오브레전드와 10년간 함께 해주신 소환사 여러분, 감사합니다!</div> <div class="greeting">THANK YOU, SUMMONERS!</div> </div> --> </div> </section> <section class="scroll-section" id="scroll-section-1" ref="scrollSection1"> <p> Lorem, ipsum dolor sit amet consectetur adipisicing elit. Assumenda<br> </p> </section> <button @click="setLayout">레이아웃d</button> <div> <input type="text" @input="setSearch($event.target.value)" /> <button @click="searchForPlayer(e)">serach</button> <div v-if="playerData" class="box"> <p>{{playerData.name}}</p> <p>{{playerData.summonerLevel}}</p> <p>{{playerData.profileIconId}}</p> <p><img width="100" height="100" :src="`http://ddragon.leagueoflegends.com/cdn/12.7.1/img/profileicon/${playerData.profileIconId}.png`"></p> </div> <div v-else class="box2"> <p>{{noPlayer}}</p> <p>데이터가없습니다</p> </div> </div> <router-view></router-view> <router-link to="/JH">링크</router-link> </div> </template> <script> import { onMounted, ref} from 'vue' import axios from 'axios' //씬을나눈다 //씬의 높이를 세팅한다 //활성화 시킬 씬을 결정한다 //this.prevScrollHeight = this.prevScrollHeight + this.sceneInfo[i].scrollHeight; //얘네는같은거임 this.prevScrollHeight += this.sceneInfo[i].scrollHeight; export default { name: 'App', components: { }, data() { return { errorText: "존재하지않는 데이터입니다", 이미지: "https://universe.leagueoflegends.com/images/championsBackground.jpg", sceneInfo: [ { type: 'sticky', heightNum: 5, scrollHeight: 0, objs: { // container: document.querySelector('scroll-section-0') container : this.$refs.scrollSection0, massageA : this.$refs.message1, massageB : this.$refs.message2, massageC : this.$refs.message3, }, values: { messageA_opacity_in: [0,1, {start: 0.1, end: 0.2}], messageA_opacity_out: [1,0, {start: 0.25, end: 0.3}], } }, { type: 'normal', heightNum: 5, scrollHeight: 0, objs: { container: this.$refs.scrollSection1 } }, ], //window.pageYOffset 갱신 yOffset : 0, //현재 스크롤 위치(yOffset)보다 이전에 위치한 스크롤 섹션들의 스크롤 높이값의 합 prevScrollHeight : 0, //현재 활성화된 scene currentScene : 0, totalScrollHeight: 0, messageA_opacity_in: '', messageA_opacity_out: '', currentYOffset: 0, rv: 0, scrollRatio: 0, outerScrollRatio:0, enterNewScene: false, scrollHeight: 0, partSCrollStart: 0, partScrollEnd: 0, partScrollHeight: 0, currentSceneValues: '', infoCurretScene: 0, } }, setup() { let searchText = ref(""); let playerData = ref(); let noPlayer = ref(); let deleteMessage = ("존재하지않음"); let playerId = ref([]); let apiKey = "RGAPI-62f8907f-eab8-4333-bc43-94d32a09be28"; const setSearch = (검색어) => { searchText = 검색어 } const searchForPlayer = () => { playerData.value = null noPlayer.value = null //Handle the API call axios.get(`https://kr.api.riotgames.com/lol/summoner/v4/summoners/by-name/${searchText}?api_key=${apiKey}`) .then((response) => { playerData.value = response.data }).catch(error => { playerData.value = null noPlayer.value = deleteMessage; }); } return { searchText, playerData, playerId, setSearch, searchForPlayer, }; }, methods: { init() { this.setLayout(); this.scrollLoop(); }, setLayout() { // Sticky Conainer 의 높이를 설정함. // for( let i = 0; i < this.sceneInfo.length; i++ ){ // this.sceneInfo[i].scrollHeight = this.sceneInfo[i].heightNum + window.innerHeight; // this.sceneInfo[i].objs.container.style.height = `${this.sceneInfo[i].scrollHeight}px`; // } this.sceneInfo[0].scrollHeight = this.sceneInfo[0].heightNum + window.innerHeight; this.$refs.scrollSection0.style.height = `${this.sceneInfo[0].scrollHeight}px`; this.sceneInfo[1].scrollHeight = this.sceneInfo[1].heightNum + window.innerHeight; this.$refs.scrollSection1.style.height = `${this.sceneInfo[1].scrollHeight}px`; this.yOffset = window.pageYOffset; this.totalScrollHeight = 0; for( let i = 0; i < this.sceneInfo.length; i++ ){ this.totalScrollHeight += this.sceneInfo[i].scrollHeight; if(this.totalScrollHeight >= this.yOffset){ this.currentScene = i; break; } } }, calcValues(values, currentYOffset){ this.rv; this.scrollHeight = this.sceneInfo[this.currentScene].scrollHeight; //현재 scene에서 스크롤된 범위를 비율로 구하기 this.scrollRatio = this.currentYOffset / this.scrollHeight; this.outerScrollRatio = (this.yOffset - this.prevScrollHeight) / this.scrollHeight; this.infoCurretScene = this.sceneInfo[this.currentScene]; this.currentSceneValues = this.sceneInfo[this.currentScene].values; if(this.currentSceneValues.messageA_opacity_in.length === 3){ //start ~ end 사이에 애니메이션 실행 this.partSCrollStart = this.currentSceneValues.messageA_opacity_in[2].start * this.scrollHeight; this.partScrollEnd = this.currentSceneValues.messageA_opacity_in[2].end * this.scrollHeight; this.partScrollHeight = this.partScrollEnd - this.partSCrollStart; if(this.currentYOffset >= this.partSCrollStart && this.currentYOffset <= this.partScrollEnd){ this.rv = (this.currentYOffset - this.partSCrollStart) / this.partScrollHeight * ( this.currentSceneValues.messageA_opacity_in[1] - this.currentSceneValues.messageA_opacity_in[0]) + this.currentSceneValues.messageA_opacity_in[0]; }else if(this.currentYOffset < this.partSCrollStart){ this.rv = this.currentSceneValues.messageA_opacity_in[0]; }else if(this.currentYOffset > this.partScrollEnd){ this.rv = this.currentSceneValues.messageA_opacity_in[1]; } }else { this.rv = this.scrollRatio * ( this.currentSceneValues.messageA_opacity_in[1] - this.currentSceneValues.messageA_opacity_in[0]) + this.currentSceneValues.messageA_opacity_in[0]; } return this.rv; }, calcValues2(values, currentYOffset){ this.rv; this.scrollHeight = this.sceneInfo[this.currentScene].scrollHeight; //현재 scene에서 스크롤된 범위를 비율로 구하기 this.scrollRatio = this.currentYOffset / this.scrollHeight; this.outerScrollRatio = (this.yOffset - this.prevScrollHeight) / this.scrollHeight; this.infoCurretScene = this.sceneInfo[this.currentScene]; this.currentSceneValues = this.sceneInfo[this.currentScene].values; if(this.currentSceneValues.messageA_opacity_out.length === 3){ //start ~ end 사이에 애니메이션 실행 this.partSCrollStart = this.currentSceneValues.messageA_opacity_out[2].start * this.scrollHeight; this.partScrollEnd = this.currentSceneValues.messageA_opacity_out[2].end * this.scrollHeight; this.partScrollHeight = this.partScrollEnd - this.partSCrollStart; if(this.currentYOffset >= this.partSCrollStart && this.currentYOffset <= this.partScrollEnd){ this.rv = (this.currentYOffset - this.partSCrollStart) / this.partScrollHeight * ( this.currentSceneValues.messageA_opacity_out[1] - this.currentSceneValues.messageA_opacity_out[0]) + this.currentSceneValues.messageA_opacity_out[0]; }else if(this.currentYOffset < this.partSCrollStart){ this.rv = this.currentSceneValues.messageA_opacity_out[0]; }else if(this.currentYOffset > this.partScrollEnd){ this.rv = this.currentSceneValues.messageA_opacity_out[1]; } }else { this.rv = this.scrollRatio * ( this.currentSceneValues.messageA_opacity_out[1] - this.currentSceneValues.messageA_opacity_out[0]) + this.currentSceneValues.messageA_opacity_out[0]; } return this.rv; }, playAnimation(){ // const values = this.sceneInfo[this.currentScene].objs; // const values = this.sceneInfo[this.currentScene].values; this.currentYOffset = this.yOffset - this.prevScrollHeight; console.log(this.currentSceneValues[0]); switch (this.currentScene) { case 0: this.messageA_opacity_in = this.calcValues(this.sceneInfo[0].values.messageA_opacity_in, this.currentYOffset); this.messageA_opacity_out = this.calcValues2(this.sceneInfo[0].values.messageA_opacity_out, this.currentYOffset); if(this.outerScrollRatio <= 0.22){ //in this.$refs.message1.style.opacity = this.messageA_opacity_in; } else { //out this.$refs.message1.style.opacity = this.messageA_opacity_out; } break; case 1: break; } }, scrollLoop(){ this.enterNewScene = false; //scrollHeight값 누적되지않도록 0으로 this.prevScrollHeight = 0; for(let i = 0; i< this.currentScene; i++){ this.prevScrollHeight += this.sceneInfo[i].scrollHeight; } if(this.yOffset > this.prevScrollHeight + this.sceneInfo[this.currentScene].scrollHeight){ this.enterNewScene = true; this.currentScene++; // this.$refs.scrollWrap.setAttribute('id', `show-scene-${this.currentScene}`); } if(this.yOffset < this.prevScrollHeight){ if(this.currentScene === 0) return; this.enterNewScene = true; this.currentScene--; // this.$refs.scrollWrap.setAttribute('id', `show-scene-${this.currentScene}`); } this.$refs.scrollWrap.setAttribute('id', `show-scene-${this.currentScene}`); if(this.enterNewScene) return; this.playAnimation(); }, }, mounted() { this.init(); window.addEventListener('DOMContentLoaded',this.setLayout); window.addEventListener('resize', this.setLayout); window.addEventListener('scroll', () =>{ //스크롤이 일어날 때 yOffset 의 값을 window.pageYOffset 값으로 갱신 this.yOffset = window.pageYOffset; this.scrollLoop(); }); }, } </script> <style lang="scss"> body { margin: 0; } .scroll-section { border: 1px solid red } .text-test { position: relative; padding: 20px; z-index: 1; color: red; } </style>  

안녕하세요 zerocho님. 항상 친절하게 답변주셔서 감사합니다. 몇가지 질문이 있습니다.   1. getServerSideProps에서는 브라우저에서 쿠키를 들고 next.js 서버로 오기 때문에 cookie를 가지고 올 수 있다고 이해했는데 getStaticProps는 빌드 시에 실행되기 때문에 cookie를 들고있지 못한걸로 이해했는데 맞나요? 만약 그렇다면 getStaticProps에서 사용하는 API는 인증이 필요하지 않은 API만 사용해야하나요?   2. getServerSideProps는 SSR이라 이를 이용하게되면 화면이 전체 깜빡임이 일어날거라고 생각했는데 실제로는 일어나지 않더라구요. 혹시 이유를 알고 계신지 궁금합니다.