묻고 답해요
167만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
LocationPermission.denied관련 질문입니다
LocationPermission checkedPermission = await Geolocator.checkPermission(); if (checkedPermission == LocationPermission.denied) { checkedPermission = await Geolocator.requestPermission(); if (checkedPermission == LocationPermission.denied) { return '위치권한을 허가해주세요.'; }}권한요청 다이얼로그에서 한번허용을 누르고 앱을 종료시킨다음 재실행했을때 LocationPermission.denied가 되어 리퀘스트퍼미션이 다시 실행되는것같습니다.(위 코드 첫줄부터 실행) 그런데 리퀘스트퍼미션을 했는데도 다시 denied가되어 if (checkedPermission == LocationPermission.denied) { return '위치권한을 허가해주세요.'; } 해당 if문이 실행되는경우는 어떤게있을까요?
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
writeHead 부분
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. Location에 /login만 해놓으니까 오류만 뜨고 로그인페이지로 안가고 커뮤니티 페이지로 들어가져서 경로를 아래처럼 바꿔더니 로그인페이지로 잘 가지긴 하는데 단순 경로 문제인가요??오류도 정상적으로 쿠키가 없다고 뜹니다
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
로그인페이지, 회원가입페이지 못들어가게하는 부분
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 이 부분에서 axios.get으로 보내주는 쿠키가 없는데 어떻게 유저가 로그인을 했다는게 인증되는건가요??
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
강의에서 사용하고 있는 next.js 버전으로 설치는 어떻게 하나요?
현재 next.js를 설치하려고 하면 13.2버전으로 설치가 되고 딱히 특정 버전을 설치해주는 기능은 없는 듯 합니다. 13버전과 강의에서 쓰이는 12버전은 사뭇 다르다고 생각이 듭니다.해당 강의에서 쓰고 있는 버전이 정확히 뭔지. 그리고 해당 버전으로 다운그레이드 혹은 설치를 하려면 어떻게 해야하는지 알려주실 수 있나요?
-
미해결Slack 클론 코딩[실시간 채팅 with React]
[공유] react-mention 항상 커서 위에 나오게 수정
이전 질문을 보면 react-mention 추천이 커서 아래로 나온다고 해서 공식 문서를 확인해봤습니다.결론적으로는 forceSuggestionsAboveCursor을 사용하면 됩니다. 해당 내용은 제로초님 sleact 레파지토리에 pull request 하였습니다.allowSuggestionsAboveCursor는 아래 공간이 부족하면 위에 배치가 '가능'하도록, 즉 워크스페이스 사람이 적으면 아래로 배치forceSuggestionsAboveCursor는 항상 위로 배치allowSuggestionsAboveCursor: Renders the SuggestionList above the cursor if there is not enough space belowforceSuggestionsAboveCursor: Forces the SuggestionList to be rendered above the cursor
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
videocontrollor dispose
해당 비디오컨트롤러는 따로 dispose를 해주고있지않은데요.만약 원래 로고페이지로 돌아가는기능을 만들게되면 그때 dispose를해주면 되나요?또한 videocontroller state가 dispose될때 컨트롤러를 같이 dispose해주어야할텐데, 조건문으로 로고페이지로 돌아가면 state를 dispose하는 식으로 해주면될까요?
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
user 과 auth에서 인증 부분
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.user.ts하고auth.ts에서이 부분이 같은데user.ts는 유저정보를 가져오기위한 미들웨어이고auth.ts는 인증을 위한 부분인데if(!user)이 둘다 있는 이유가 있을까요?그저 user.ts가 user정보를 가져오는데 조건에 해당하는 user정보가 없으면 안되니까(null) user.ts에 if(!user)이 있는건가요??제가 제대로 이해하고 있는지 헷갈려서요 ㅠㅠㅠ
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
onlogotap함수의 video nullable관련질문
void onLogoTap() async { final video = await ImagePicker().pickVideo(source: ImageSource.gallery, );if (video != null) {setState(() {this.video = video; });}}여기에서 if문을 안쓰고 setstate를 해줘도 동일하지 않나요?설명은 이미지피커에서 비디오를 고르지않고 빠져나오지않을경우 video가 null이 될수있다 라고하셨습니다.onLogoTap은 비동기 함수여서 pickvideo까지 기다린다음에 setstate가 실행될텐데 이미지를 고르지 않고 이미지픽커를 빠져나오면 await부분이 만족되지않아서 onlogotap안의 다음코드를 실행하지않기때문에, video가 null인 상황은 없지않을까요?
-
미해결Slack 클론 코딩[실시간 채팅 with React]
채팅대화에서 시간이 중복될경우 안보이게 하는방법 문의.
안녕하세요. 복습중에 새로운 기능을 넣으려고 하는데 생각보다 잘 안되네요. 카카오톡 메신저처럼. 동일한 시간에 보낸 카톡시간을 안보이게 하려고합니다.서버에서 가져온 현재시간값과 이전 대화시간값(chat.createdAt) 을 비교하면 될것같은데useState 를 이용할때는 무한로딩으로 막혓고 (setState 로 현재값 저장) useRef 를 사용해서 값을 저장하여 비교하고 싶은데. 항상 현재시간값만 이용하게 되네요.어떻게 접근하는것이 좋을까요.
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
쿠키에 대해서
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.로그인시 아이디와 비밀번호 → 서버(유저의 정보가 맞는지 확인 후 토큰 발급 → 쿠키에 저장 : 하지만 도메인 주소가 다르면 쿠키가 전송이안됨왜 쿠키는 도메인주소가 다르면 쿠키가 전송이 안될까요?과거 강의인 "노드 리액트 기초강의" 에서 Express에서 제공하는 cookie-parser을 이용해서 서버에서 토큰을 쿠키에 저장했었는데 이 방법도 사용해도 될까요?? - 이는 여기 강의에서 설치한 cookie모듈과 비슷한 건가요??토큰발급 후 클라이언트에 보내주고 클라이언트에서 쿠키에 저장하는 방법은?
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
next.js 버전이 12인건가요?
강의에서 사용하고 있는 next 버전이 궁금합니다.12버전인가요?
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
findOneBy
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. findOneBy 명령어 혹시 자세하게 설명해주실 수 있을까요??User.ts를 이용해서 중복된 아이디와 이름을 찾는 원리가 어떻게 되는건가요??
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
setState 사용 차이
강의 잘 보고 있습니다.강의가 너무 좋아서 책도 함께 구매하려고 합니다.좋은 강의 감사합니다. 다름이 아니고 질문이 하나 있어 이렇게 글남깁니다. 플루터에서 setState는 화면을 갱신하는 용도로 사용하고 있다고 알고 있습니다.만약에 a= 10이라고 설정한다고 가정하면setState(() { a = 10; });a = 10; setState( () { } ) 1번 로직과 2번 로직이 내부에서 어떤 차이점이 있을까요?테스트 해본결과 1번, 2번 모두 정상 작동하더라구요 -----------------------------------------------공부하다 추가 질문이 있어 문의 드립니다.플루터에서 네임드 라우팅을 materialApp에 설정할때 특정 페이지에 필수 파라미터가 존재하면 어떤식으로 등록을 해야 할까요?예 )가정 : Two 페이지는 str값을 필수 파라미터로 받고 있습니다. routes: {"/": (context) => One(),"/two": (context) => Two(str : ??), },이게 안되면 아래와 같은 방법으로 파라미터를 설정해야 하는지 궁금합니다!var two = Two();two.str = "asdf";Navigator.of(context).push(MaterialPageRoute(builder: (_) => two));
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
@types/cors설치
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 22:03 초 부분 에 cors 설치하시는데 요거는 안하셨는데 해야되는거 맞나요??저는 안하니까 오류나서 설치하라고 뜨더라구요..영상에서는 설치안했는데도 오류 안뜨는 거같아서..아님 제가 잘 못본걸 수도 있어서 알려주시면 감사드립니다!
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
React.FC 사용
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. Rect.FC의 사용하지않고 아래와 같이해도 무방할까요???
-
미해결BBC 인터랙티브 페이지 "코로나19가 바꿀 사무실의 미래" 클론
오류났을때 참고
안녕하세요 , 23년도에도 듣고 계신 분이 계실지는 모르겠지만.. 강의 들으면서 혹시 막히시는 부분들 제가 수업 들으면서 작성한 코드와 비교해서 본인이 작성한 어떤 부분이 잘못되었는지 확인하시면 문제해결에 도움이 될듯해서요 !birdflies 함수 작성에서 작은 따옴표가 아닌 ` <- 이 부분 (숫자 1 옆의 템플릿 리터럴 ) 활성화 > 비활성화가 되었을 때 다시 돌아오지 않는 부분 이였습니다.위 두가지에서 시간이 좀 잡아먹었는데 저와같은 분들이라면 제 js 랑 비교해보세요 ㅋㅋ( 이 부분은 애니메이션이 완전히 끝까지 완료 후 스크롤을 내려야 다시 활성화 되었을 때 애니메이션이 제자리에서 작동을 하더라구요. )html { font-family: 'Noto Sans KR', sans-serif; } body { margin: 0; } div, section, header, footer, p, h1, h2 { box-sizing: border-box; } a { color: royalblue; } img { max-width: 100%; height: auto; } /* 배경이 되는 이미지들 */ .global-width{ max-width: 620px; margin: 0 auto; padding: 0 1rem; } .scroll-graphic{ overflow-x: hidden; position:sticky; top:0; height: 100vh; } .graphic-item{ display: flex; align-items: center; justify-content: center; position:absolute; left: 0; top:0; width: 100vw; height: 100vh; opacity: 0; transition: 0.5s; will-change: opacity; } .visible{ opacity: 1; } .scene-img{ max-height: 100vh; } .scroll-text{ position: relative; padding-bottom: 1px; } .step{ margin-bottom: 60vh; padding: 0.5rem 1rem; border-radius: 10px; border : 0.2px solid rgba(216,216,216,0.2); box-shadow: rgba(0,0,0,0.3)0 0 3px; background: rgba(255,255,255,0.8); } .bird{ position:absolute; left: 0; bottom:70%; width: 100px; transform:translateX(-100%); transition:1.5s 0.5s linear; } [data-index="5"] .bird{ left: 30%; bottom:30%; } .global-footer{ text-align: center; padding:2rem 0; } .strikethrough{ text-decoration: line-through; }// 전역변수 사용 회피 (() => { const actions = { birdFlies(key){ if (key) { document.querySelector('[data-index="2"] .bird').style.transform = `translateX(${window.innerWidth}px)`; }else{ document.querySelector('[data-index="2"] .bird').style.transform = `translateX(-100%)`; } }, birdFlies2(key) { if (key) { document.querySelector('[data-index="5"] .bird').style.transform = `translate(${window.innerWidth}px, ${-window.innerHeight * 0.7}px)`; }else{ document.querySelector('[data-index="5"] .bird').style.transform = `translateX(-100%)`; } } }; const stepElems = document.querySelectorAll('.step'); const graphicElems = document.querySelectorAll('.graphic-item'); let currentItem = graphicElems[0]; let ioIndex; const io = new IntersectionObserver((entries,observer)=>{ ioIndex = entries[0].target.dataset.index *1 ; console.log(ioIndex); }) for (let i = 0; i < stepElems.length; i++) { io.observe(stepElems[i]); stepElems[i].dataset.index = i; graphicElems[i].dataset.index = i; } function activate(action) { currentItem.classList.add('visible'); if (action) { actions[action](true); } } function inactivate(action) { currentItem.classList.remove('visible'); if (action) { actions[action](false); } } window.addEventListener('scroll', () => { let step; let boundingRect; for (let i=ioIndex-1; i<ioIndex+2; i++){ step = stepElems[i]; if(!step) continue; boundingRect = step.getBoundingClientRect(); if(boundingRect.top > window.innerHeight* 0.1 && boundingRect.top < window.innerHeight*0.8){ inactivate(currentItem.dataset.action); currentItem = graphicElems[step.dataset.index]; activate(currentItem.dataset.action); } } }); window.addEventListener('load',()=>{ setTimeout (() => scrollTo(0,0),100); }) activate(); })();
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
[커뮤니티 페이지 생성하기 강의부분] authRoute 논리연산자를 추가하면 error가 뜹니다.
_app.tsxexport default function App({ Component, pageProps }: AppProps) { axios.defaults.baseURL = process.env.NEXT_PUBLIC_SERVER_BASE_URL + '/api'; axios.defaults.withCredentials = true; const { pathname } = useRouter(); const authRoutes = ['/register', '/login']; const authRoute = authRoutes.includes(pathname); return ( <AuthProvider> {!authRoute && <NavBar />} <div className={authRoute ? '' : 'pt-12'}> <Component {...pageProps} /> </div> </AuthProvider> ); } 해당 부분에서 !authRoute 논리연산자를 추가하면Error: Hydration failed because the initial UI does not match what was rendered on the server.에러가 나옵니다.강사님 파일을 클론 해서 빌드 확인해보니 이런 에러가 안나오길래, 이 강의까지의 나머지 파일도 클론한 것과 모두 같은 것을 확인했는데 왜 저만 이런 에러가 나오는걸까요?해당 에러를 구글링해서 해결책으로 나오는 것들을 적용해봤는데 어느것도 에러를 해결해주지 못했습니다ㅠ어떤 부분을 확인해보면 좋을까요?
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
블로그 웹앱 배포 방법
강의에서 배운 내용을 토대로 만들어진 것을 배포하여 사용해보고 싶은데, 어떤 강의를 들으면 실제 구글 플레이스토어에서 다운 받아서 실행해 볼 수 있을까요? android studio에서 app bundle 파일만 뽑아낸다고 배포가 가능한지도 궁금합니다!
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
sizedbox 위젯에 primary = RED_COLOR
'primary' is deprecated and shouldn't be used. Use backgroundColor instead. This feature was deprecated after v3.1.0.. (Documentation) Try replacing the use of the deprecated member with the replacement. primary에 사선으로 줄쳐져서 위의 글 내용이 나와서이렇게 수정하면 될까요?backgroundColor : RED_COLOR,
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
import express 하는 부분에서
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 혹시 아래와 같이 자동완성 사용하는 거랑 같을까요??