묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]
프로젝트 실행이 되지 않아 menu API 테스트가 불가합니다 ㅠ
잘 모르겠습니다. ㅠㅠ
-
해결됨Svelte REST-API 프로젝트
프론트 api.js의 요청 headers 옵션의 cors 관련 설정 질문
프론트엔드 api.js의 Access-Control-Allow-Origin 혹은 Access-Control-Allow-Credencials 옵션은 프론트의 요청 헤더가 아닌 백엔드 서버에서 응답 헤더로 설정해야 하는것 아닌지 질문드립니다.추가적으로 SameSite는 쿠키에 설정하는것이 아닌지 질문드립니다.보통 강의와 같이 요청 헤더에 저렇게 설정하면 Spring 기준으로는 Filter에서 Origin이나 Credencials를 직접 꺼내서 응답 헤더에 넣어주는 형태로 하지 않는이상 CORS 에러를 방지할수 없었던것으로 기억되어서 질문드립니다.
-
해결됨GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]
모듈 버전이 안맞아서 발생하는 문제 같습니다;;;
DISABLE_WEBSOCKETS=true meteor.bat run 을 실행했는데, 다음과 같이 발생했습니다. package.json, .meteor/packages 는 다음과 같습니다.
-
해결됨GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]
meteor 버전 때문에 실행이 안됩니다.
node 16.13.1meteor 2.7.4 로 설치하였습니다. This project uses Meteor 2.14, which isn't available on this platform. To work with this app on all supportedplatforms, use meteor update --release METEOR@3.1.2 to pin this app to the newest compatible release.라는 에러를 받았습니다. 그래서 3.1.2로 설치 후, 다시 진행해도 똑같습니다.
-
해결됨GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]
graghQL의 transaction 처리속도가 궁금합니다.
강의에서 graphQL은 유동적으로 서버에서 저장되어 있는 정보를 처리해서 전달해준다고 했는데, 일반적인 restAPI는 정해진 규격이 있어서 transaction에 처리가 어느 정도 감이 잡히지만, graphQL은 그렇지 않은 것 같아서요.
-
해결됨GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]
질문있습니다.
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 스벨트에 대해서 처음접하게 되었습니다.제가 알기로 스벨트가 버전이 5까지 나왔는데 현재 이 강의도 스벨트5버전인가요??아니면 이전버전인데 5버전과 많이 차이가나는가요? 또한 선생님의 다른 강의 "Svelte로 시작하는 웹 프런트엔드" 말고 이거로 바로 시작해도될까요?
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
화면 구성 설명용 도구 이름
화면 구성 설명하실 때 보여주는 도구 이름이 궁금합니다.
-
해결됨GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]
Meteor 실행 오류 문의 드립니다.
DISABLE_WEBSOCKETS=true meteor run 실행 오류입니다. 아래 오류 코드이고 개인 계정부분은 ** 처리했습니다. **@**ui-MacBookAir graphql-study-apollo-v4-master % DISABLE_WEBSOCKETS=true meteor run[[[[[ ~/Desktop/Study_File/Back-end_Study/GraphQL/graphql-study-apollo-v4-master]]]]] => Started proxy. arch: posix_spawnp: /Users/**/.meteor/packages/meteor-tool/.2.14.0.1btio5i.hfop++os.osx.arm64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.arm64/dev_bundle/mongodb/bin/mongod:Bad CPU type in executableUnexpected mongo exit code 1. Restarting.=> Meteor 3.0.4 is available. Check the changeloghttps://docs.meteor.com/changelog.html and update this project with 'meteorupdate'.arch: posix_spawnp: /Users/**/.meteor/packages/meteor-tool/.2.14.0.1btio5i.hfop++os.osx.arm64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.arm64/dev_bundle/mongodb/bin/mongod:Bad CPU type in executableUnexpected mongo exit code 1. Restarting.arch: posix_spawnp: /Users/**/.meteor/packages/meteor-tool/.2.14.0.1btio5i.hfop++os.osx.arm64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.arm64/dev_bundle/mongodb/bin/mongod:Bad CPU type in executableUnexpected mongo exit code 1. Restarting.Can't start Mongo server. MongoDB failed global initialization**@*ui-MacBookAir graphql-study-apollo-v4-master % 답변 부탁드립니다.
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
영호 좋아요 버튼이 콘솔에는 잘 찍히지만 화면에 렌더링 되지 않습니다.
<script> import { data } from "./lib/movies"; import Navbar from "./lib/components/Navbar.svelte"; import Modal from "./lib/components/Modal.svelte"; import Movies from "./lib/components/Movies.svelte"; const handleLike = (i) => { data[i].likeCount += 1; }; let isModal = false; let selectedMovie = 0; const closeModal = () => { isModal = !isModal; }; </script> <Navbar /> <Movies {data} bind:selectedMovie {closeModal} {handleLike} /> {#if isModal} <Modal {data} {selectedMovie} {closeModal} /> {/if}<script> export let selectedMovie; export let data; export let closeModal; export let handleLike; </script> <main class="container"> <h1>영화정보</h1> {#each data as movie, i} <div class="item"> <figure> <img src={movie.imgUrl} alt={movie.title} /> </figure> <div class="info"> <h3 class="bg-yellow">{movie.title}</h3> <p>개봉 : {movie.year}</p> <p>장르: {movie.category}</p> <button on:click={() => { console.log(i, data[i].likeCount); handleLike(i); }}>좋아요 {data[i].likeCount}</button > <button class="btn btn-primary" on:click={() => { closeModal(); selectedMovie = i; }}>상세보기</button > </div> </div> {/each} </main> <style> .bg-yellow { background-color: gold; padding: 10px; color: #333; } .item { width: 100%; border: 1px solid #ccc; display: flex; margin-bottom: 20px; padding: 1rem; } .item figure { width: 30%; margin-right: 1rem; } .item img { width: 100%; } .item .info { width: 100%; } </style> const data = [ { title: "파묘", year: 2024, category: "미스터리, 공포", likeCount: 0, imgUrl: "/images/images1.jpg", story: "미국 LA, 거액의 의뢰를 받은<br>무당 ‘화림’(김고은)과 ‘봉길’(이도현)은<br>기이한 병이 대물림되는 집안의 장손을 만난다.<br>조상의 묫자리가 화근임을 알아챈 ‘화림’은 이장을 권하고,<br>돈 냄새를 맡은 최고의 풍수사 ‘상덕’(최민식)과 장의사 ‘영근’(유해진)이 합류한다.", }, { title: "고질라 X 콩: 뉴 엠파이어", year: 2024, category: "어드벤처, 액션, SF", likeCount: 0, imgUrl: "/images/images3.jpg", story: "‘고질라’ VS ‘콩’, 두 타이탄의 전설적인 대결 이후<br>할로우 어스에 남은 ‘콩’은 드디어<br>애타게 찾던 동족을 발견하지만<br>그 뒤에 도사리고 있는 예상치 못한 위협에 맞닥뜨린다.", }, { title: "듄: 파트2", year: 2024, category: "액션", likeCount: 0, imgUrl: "/images/images2.jpg", story: "황제의 모략으로 멸문한 가문의 유일한 후계자 폴.(티모시 샬라메)<br>어니 레이디 제시카(레베카 퍼거슨)와<br>간신히 목숨만 부지한 채 사막으로 도망친다.<br>그곳에서 만난 반란군들과 숨어 지내다<br>그들과 함께 황제의 모든 것을 파괴할 전투를 준비한다.", }, ]; export { data }; 영화 컴포넌트 나누기 하고있는데 좋아요 버튼을 누르면 영화 인덱스랑 좋아요 +1은 잘되는데 화면에 렌더링 되지 않습니다...!
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
영화목록 component 만들기 에서 질문이 있습니다.
영화목록 컴포넌트 만들기 영상에서 Movies 컴퍼넌트로 분리할때좋아요 버튼 작동이 안되니까 handleLike 함수를프롭스로 넘겨주는데요. 영상에서는 잘 되는데동일하게 소스도 쳐보고 올려주신 github 소스도 가지고 와서 붙여넣어봐도 console창에서는 data 안의 likeCount 값이 버튼을 클릭하면 변경되는게 보이는데 실제로 화면에서는 변경이 되지 않습니다. 왜 그럴까요. 그리고 작동이 되는 게 영상에서도 보이는데, 저한테는 왜 안되는지도 궁금합니다. ;;;; 아래 .toUpperCase() 도 저는 왜 실행이 안될까요.;;
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
"hello".toUpperCase() 가 안되는데요.
너무 첫 부분이라 민망하긴 한데요.강의 영상에서는 "hello".toUpperCase() 라고 하니까HELLO로 잘 변환되는데제가 직접해보니 그 부분 값이 아예 공백으로 표시가 됩니다. 개발자모드로 봐도 소스에 아예 비워져서 나가더라구요.스크립트 부분에 let text="hello"로 하고 html 부분에서 text.toUpperCase라고 쓰니까 또 잘되고요.이거 왜 이런가요? 궁금합니다.
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
날짜 포매팅 관련 질문
현재 날짜를 포매팅하는 함수는 아래와 같습니다,const formatDate = function() { return new Date().toLocaleDateString('ko-KR', { year: 'numeric', month: 'long', day: 'numeric', weekday: 'long', }); }위 함수는 현재 기준으로 날짜를 포매팅해주기 때문에 db에서 불러온 일기 날짜들이 모두 오늘 날짜로 포맷팅 되는 문제가 발생하는 것으로 이해했습니다. 따라서 파라미터로 받은 날짜를 포맷팅 해주도록(일기 쓰기 부분에선 위 함수가 필요하니 별도의 함수로 구현) 수정해야 할 것 같은데 제가 잘못 이해한 부분이 있을까요??
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
삭제 후 홈으로 돌아가는 코드 관련 질문
안녕하세요, "delete로 글 삭제하기" 강의를 듣던 중 궁금한 점이 생겨 질문드립니다. 삭제 후 다시 supabase에서 글 목록을 조회하고, 조회한 글들로 홈 화면의 게시글 목록을 구성하기 위해 goto 대신 location.reload() 함수를 사용하신 내용을 이해했는데요, 홈 화면에서 삭제하는 경우가 아닌 글 조회 후 /read/{diary_id} 경로에서 삭제 버튼을 누르게 되면 해당 경로에서 reload가 되기 때문에 문제가 발생하지 않나요? 따라서 말씀하신 location.reload() 대신 location.href = '/' 만 사용할 수 있는것이 아닌지 여쭤봅니다,감사합니다!
-
해결됨GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]
Window 환경에서 meteor 설치하는 부분에 대해 실습환경 구축 부분에 추가내용이 없습니다.
Window 환경에서 meteor 설치하는 부분에 대해 실습 환경 구축 부분에 추가 내용이 없습니다.현재 node 18.20.0 버전을 사용하고 있습니다.window의 경우 설치 시 vscode 내부의 터미널에서 npm install -g meteor 명령 하는 것인가요? 아니면 git bash창에서 설치하는 것인가요? 자세한 설명 부탁드립니다.
-
미해결Svelte.js [Core API] 완벽 가이드
56강 4. 슬롯 포워딩이 Svelte 5 부터는 적용 불가
56강 4. 슬롯 포워딩이 Svelte 5 부터는 적용이 안되는 것 같아요~!확인 부탁드립니다.
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
OnDestroy() 위치 질문
안녕하세요,강의에서 메모리 절약을 위해 인터벌을 제거하는 내용을 듣던 중 궁금한 점이 생겼는데요 만약 이벤트창이 닫혔을 때 인터벌을 종료시키고 싶다면 App.svelte가 아닌 Event.svelte 내에 OnDestroy를 작성해주면 되는거겠죠? App.svelte에 OnDestroy를 작성하신 이유는 이벤트 인덱스를 증가시키는 로직과 이벤트 텍스트 관리를 App.svelte에서 하고있으니 이벤트 창이 열리거나 닫힌 여부와는 상관 없이 App.svelte가 살아있는 동안에는 계속 이벤트배열 인덱스를 증가시키기 위해라고 이해했는데 제가 이해한 내용이 맞을까요??
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
$(리액티브선언문) 으로 setInterval과 clearInterval 를 작성 시 메모리 관련
영상 마지막 로직에 대해 질문드리려고 문의드립니다.onMount와 onDestory 함수로 setInterval과 clearInterval을 생명주기에 맞게 실행시키게되어 setInerval과 clearInterval을 한번씩만 실행시키는 거 같은데 $(리액티브선언문) 으로 setInterval과 clearInterval 를 작성 시setInterval과 clearInterval이 반복적으로 호출되어 생성되었다 지웠다 하는것 같아 보이는데이 방식이 메모리 영역에서 괜찮은건지 궁금합니다!<script> let intervalEventText; let eventIndex = 0; const eventText = [ "영화 정보 업데이트", "신규 영화 추가", "이벤트 진행중" ] import { onMount, onDestroy } from 'svelte' /** 리액티브 선언문 방식 */ $: { // 이벤트 인터벌 제거 clearInterval(intervalEventText); console.log(eventIndex) // 일정 시간 경과 후 eventIndex를 1 증가 intervalEventText = setInterval(() => { eventIndex += 1; if (eventIndex >= eventText.length) { eventIndex = 0; } }, 1000); } /** onMount & onDestory 방식 */ // onMount(()=>{ // intervalEventText = setInterval(() => { // eventIndex += 1; // if (eventIndex >= eventText.length) { // eventIndex = 0; // } // }, 1000); // }); // onDestroy(()=>{ // console.log(eventIndex) // clearInterval(intervalEventText); // }) </script> <p>{eventText[eventIndex]}</p>
-
해결됨GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]
리액트에서 적용할 때 질문있습니다.
안녕하세요강사님한테 배운 코스를 리액트에 접목시켜보고 싶은데요 바뀌는 부분이 많을까요? 부족한 제 생각으로는리액트는 커스텀훅을 작성해줄수있다보니까로그인, 어드민 관련부분에서도 변경해야하는부분이있을거같고..stores부분 코드를 그대로 복붙하기에는 무리가 있을까요?따로 분류해가면서 작성해줘야할까요?
-
해결됨프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
스벨트킷에 대해서 질문이 있습니다.
안녕하세요. 현재 공식 문서와 강의를 보고 학습중에 있는데 해당 강의 에서는 session, cookie, middleware, sever hook, cache 기능을 스벨트에서는 어떻게 사용하는지에 대한 예제는 다루지는 않고 있나요??CSR / SSR / SSG 관련한 예제도 있으면 좋을것 같아요.
-
해결됨Svelte.js SPA 영화 검색 프로젝트
에러가 나서 질문올립니다.
template 설치중에 에러가 자꾸떠서질문남깁니다..