묻고 답해요
160만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨Supabase, Next 풀 스택 시작하기 (feat. 슈파베이스 OAuth, nextjs 14)
9.1 강의에서 생긴 servercomponent 변수
9.1장에서 user.action.ts의 getUser 함수에 serverComponent라는 속성이 갑자기 생겨났는데 이거에 대한 설명이 필요한 것 같습니다.
-
해결됨Slack 클론 코딩[실시간 채팅 with React]
alias 경로 설정 오류
안녕하세요 제로초님components 의 alias 경로가 오류가 나서요 질문 드립니다저는 src 폴더를 추가해서 한번 더 감싼 구조에서 이에 맞게 alias 경로를 세팅했는데요import { TextField, Button } from '@components'; 이렇게 불러오면 components 폴더의 index 파일이 자동으로 인식되는 걸로 알고 있는데, 에러가 뜨더라구요그래서 import { TextField, Button } from '@components/index'; 로 해야 정상적으로 불러오던데 왜 index를 별도로 입력해야 하는지 모르겠어서요반면 @assets alias 경로에 있는 icons는 index 입력 없이 index 파일을 잘 불러와서 문제가 없더라구요 // webpack.config.ts alias: { '@assets': path.resolve(__dirname, './src/assets'), '@hooks': path.resolve(__dirname, './src/hooks'), '@components': path.resolve(__dirname, './src/components'), '@layouts': path.resolve(__dirname, './src/layouts'), '@pages': path.resolve(__dirname, './src/pages'), '@utils': path.resolve(__dirname, './src/utils'), '@typings': path.resolve(__dirname, './src/typings'), }, // tsconfig.json "paths": { "@assets/*": ["./src/assets/*"], "@hooks/*": ["./src/hooks/*"], "@components/*": ["./src/components/*"], "@layouts/*": ["./src/layouts/*"], "@pages/*": ["./src/pages/*"], "@utils/*": ["./src/utils/*"], "@typings/*": ["./src/typings/*"] }
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
"calendar_scheduler 프로젝트"의 "일정 불러오기" 2:50에서 snapshot.hasData가 false에 관한 질문입니다.
안녕하세요.먼저 정말 좋은 강의를 만들어 주셔서 감사합니다.초보자로써 많은 도움을 받고 있습니다. schedule_bottom_sheet.dart의 onSavePressed() 함수를 통하여 값은 입력이 되었습니다.I/flutter ( 6559): [ScheduleTableData(id: 1, startTime: 12, endTime: 14, content: Test Flutter !!!, date: 2024-07-24 00:00:00.000, color: 2196F3, createdAt: 2024-07-24 07:55:37.000), ScheduleTableData(id: 2, startTime: 15, endTime: 17, content: AAAAAAAA !!, date: 2024-07-25 00:00:00.000, color: F44336, createdAt: 2024-07-24 07:56:16.000), ScheduleTableData(id: 3, startTime: 9, endTime: 11, content: Flutter 프로그래밍, date: 2024-07-24 00:00:00.000, color: F44336, createdAt: 2024-07-24 10:34:38.000), ScheduleTableData(id: 4, startTime: 9, endTime: 11, content: Flutter 프로그래밍, date: 2024-07-24 00:00:00.000, color: F44336, createdAt: 2024-07-24 10:35:41.000), ScheduleTableData(id: 5, startTime: 12, endTime: 14, content: I want to trip in Japan !!!, date: 2024-07-23 00:00:00.000, color: F44336, createdAt: 2024-07-24 10:43:57.000)]I/flutter ( 6559): snapshot.hasData: false home_screen.dart의 FutureBuilder에서 builder의 snapshot에서 DB에 등록된 값을 가져오지 못하고 있습니다. snapshot.hasData -> false 이고 snapshot.connectionState은 waiting 상태입니다.if (!snapshot.hasData && snapshot.connectionState == ConnectionState.waiting) { return Center( child: CircularProgressIndicator(), ); }위 코드에서 조건에 만족하기 때문에 if문에서 CircularProgressIndicator()가 실행 되어야 하는데, CircularProgressIndicator()가 표지되지 않습니다. 다음과 같이 수정하여 확인한 결과, 글자가 짧은 순간 표시되었다가 사라졌습니다.child: Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ CircularProgressIndicator(), SizedBox(height: 32.0), Text( 'Loading, Please wait.....', style: TextStyle( fontSize: 18, color: Colors.red, fontWeight: FontWeight.w700, ), ), ], ), 감사합니다.
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
정말 최고의 강의 였습니다.
플러터 강의는 정말 완벽해요 초반 성장기에 정말 많은 도움을 받았습니다. 너무 감사합니다. 리엑트 강의는 안찍으실까요? 있다면 꼭 듣고 싶내요. 아니면 추천할만한 리엑트 강의가 있을까요?
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
minSdk 입력 방법이 바뀐걸까요?
defaultConfig { // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html). applicationId = "com.byjun0302.flutter_blogweb_app" // You can update the following values to match your application needs. // For more information, see: https://docs.flutter.dev/deployment/android#reviewing-the-gradle-build-configuration. minSdk = flutter.minSdkVersion targetSdk = flutter.targetSdkVersion versionCode = flutterVersionCode.toInteger() versionName = flutterVersionName }제 build.gradle 의 defaultConfig 에는 minSdk 적는 부분이 이렇게 나와있는데 뭔가 바뀐 것 같아 질문드립니다
-
미해결Slack 클론 코딩[실시간 채팅 with React]
fetcher 함수의 data 값이 두번 찍히는 이유
Login.tsx에서 swr로 호출한 users의 data 값을 return 직전에 console 로그로 찍어봤는데요네트워크 탭에서는 users 요청은 한번 밖에 없었는데undefined와 false가 연달아서 찍히더라구요다른 질문에서 답변해주신 내용을 보니 데이터 로딩중엔 undefined라고 말씀해주셨는데, 맨 처음 컴포넌트가 렌더링될 때 useSWR이 api를 호출하게 되고 이때 console.log(data)는 아직 데이터가 로딩 중이라서 undefined가 찍히게 되고, 이후 데이터 로딩이 완료되면 useSWR이 다시 호출되어? false가 찍히는 프로세스로 이해했는데 맞는걸까요그렇다면 useSWR로 api호출 시 무조건 최소 2번 렌더링될 수 밖에 없는걸까요?// Login.tsx import React, { useState, useCallback, useEffect } from 'react'; import { TextField, Button } from '@components/index'; import { Link, Navigate } from 'react-router-dom'; import { useInput } from '@hooks/useInput'; import { LogoSlack } from '@assets/icons/'; import axios from 'axios'; import useSWR from 'swr'; import fetcher from '@utils/fetcher'; const Login = () => { // useSWR은 get으로 요청한 데이터를 받아와서 저장한다. // mutate : 내가 원할 때 SWR 호출하기 const { data, error, mutate } = useSWR('http://localhost:3095/api/users', fetcher, { dedupingInterval: 5000, // 주기적으로 호출하지만, dedupingInterval 기간 내에는 캐시에서 불러온다 }); const [logInError, setLogInError] = useState(false); const [email, setEmail, onChangeEmail] = useInput(''); const [password, setPassword] = useInput<string>(''); const onChangePassword = useCallback( (e: React.ChangeEvent<HTMLInputElement>) => { setPassword(e.target.value); }, [email, password, data], ); const onSubmit = useCallback( (e) => { setLogInError(false); axios .post( 'http://localhost:3095/api/users/login', { email, password }, { withCredentials: true, }, ) .then(() => { mutate(); }) .catch((error) => { setLogInError(error.response?.status === 401); }); }, [email, password], ); console.log(data); // if (data) return <Navigate to="/workspace/channel" />; return ( <div className="max-w-[400px] mx-auto px-[20px]"> <h1 className="flex justify-center pt-[60px] pb-[20px]"> <LogoSlack /> <span className="blind">Slack</span> </h1> <TextField label="이메일 주소" type="email" value={email} onChange={onChangeEmail} /> <TextField label="비밀번호" type="password" value={password} onChange={onChangePassword} /> {logInError && <p className="mb-[20px] mt-[-10px] text-red-500 font-normal">로그인 실패</p>} <Button text="로그인" onClick={onSubmit} /> <p className="mt-[10px] text-center"> Slack을 처음 사용하시나요? <Link to="/sign" className="ml-[4px] text-blue-600"> 회원가입 </Link> </p> </div> ); }; export default Login;
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
에러 메시지를 대하는 방향성에 대한 질문이에요 (플러터 왕초보)
안녕하세요.. 쌤 강의를 열심히 듣고 공부하고 있는 플러터 초보입니다. 제가 완전 초보라서 그런지 에러가 뜨면 어떻게 고쳐야 할지 모르겠어요 ㅠㅠ 이미 망해서.. 손 놓고 쌤 강의 마저 듣고 이번 프로젝트는 마무리 하려고 합니다. 해결 방법을 아예 모르겠어요. 현 상황을 설명해 드릴게요.캘린더_스케쥴러 강의 막바지에 발생했습니다. 이전 강의는 모두 잘 따라갔음<처음 에러가 뜬 시점은 schedulebottomsheet> child: GestureDetector( onTap: () async { await showModalBottomSheet<ScheduleTable>( context: context, builder: (_) { return ScheduleBottomSheet( selectedDay: selectedDay, ); }, );<아래의 에러 메시지도 함께 떴는데, 해결 방법을 몰라 귿대로 코딩 진행함>lib/screen/home_screen.dart:144:63: Error: Required named parameter 'id' must be provided. return ScheduleBottomSheet( ^lib/component/schedule_bottom_sheet.dart:14:9: Context: Found this candidate, but the arguments don't match. const ScheduleBottomSheet({ ^^^^^^^^^^^^^^^^^^^<결국 아래처럼 에러 메시지가 쌓여서 손을 놓게 됨>lib/screen/home_screen.dart:144:63: Error: Required named parameter 'id' must be provided. return ScheduleBottomSheet( ^lib/component/schedule_bottom_sheet.dart:14:9: Context: Found this candidate, but the arguments don't match. const ScheduleBottomSheet({ ^^^^^^^^^^^^^^^^^^^lib/screen/home_screen.dart:65:21: Error: The getter 'schedule' isn't defined for the class '_HomeScreenState'. - '_HomeScreenState' is from 'package:calendar_scheduler/screen/home_screen.dart' ('lib/screen/home_screen.dart').Try correcting the name to the name of an existing getter, or defining a getter or field named 'schedule'. id: schedule.id, ^^^^^^^^lib/component/schedule_bottom_sheet.dart:41:61: Error: The getter 'waiting' isn't defined for the class 'ConnectionState'. - 'ConnectionState' is from 'package:flutter/src/widgets/async.dart' ('../../flutter_windows_3.22.2-stable/flutter/packages/flutter/lib/src/widgets/async.dart').Try correcting the name to the name of an existing getter, or defining a getter or field named 'waiting'. if (widget.id != null && snapshot.connectionState.waiting) { ^^^^^^^lib/component/schedule_bottom_sheet.dart:43:22: Error: The argument type 'Type' can't be assigned to the parameter type 'Widget?'. - 'Type' is from 'dart:core'. - 'Widget' is from 'package:flutter/src/widgets/framework.dart' ('../../flutter_windows_3.22.2-stable/flutter/packages/flutter/lib/src/widgets/framework.dart'). child: CircularProgressIndicator, ^lib/component/schedule_bottom_sheet.dart:220:17: Error: No named parameter with the name 'initialValue'. initialValue: startTimeInitValue, ^^^^^^^^^^^^lib/component/custom_text_field.dart:10:9: Context: Found this candidate, but the arguments don't match. const CustomTextField({ ^^^^^^^^^^^^^^^lib/component/schedule_bottom_sheet.dart:229:17: Error: No named parameter with the name 'initialValue'. initialValue: endTimeInitValue, ^^^^^^^^^^^^lib/component/custom_text_field.dart:10:9: Context: Found this candidate, but the arguments don't match. const CustomTextField({ ^^^^^^^^^^^^^^^lib/component/schedule_bottom_sheet.dart:259:9: Error: No named parameter with the name 'initialValue'. initialValue: initialValue, ^^^^^^^^^^^^lib/component/custom_text_field.dart:10:9: Context: Found this candidate, but the arguments don't match. const CustomTextField({ ^^^^^^^^^^^^^^^요약 <캘린더 스케쥴러 - 기존 일정 업데이트하는 기능 만들기 강의> 초반부에서 제가 키를 잘못 눌렀는지, ScheduleBottomSheet에 밑줄이 그어졌어요. 근데 그냥 무시하고 강의를 들으면서 쭉 코딩을 해서 오류 메시지가 쌓인 것입니당이때 느낀게, 코드가 한 번 꼬이면 뒤까지 모두 지장을 주는 구나라는 것을 알게 되었어요. 만약 초보인 제가 코드 에러를 마주했을 때 어떤식으로 해결을 해야하는 지 알려주실 수 있나요 ?? 스케쥴러에서는 구조가 복잡해 지다 보니 특정 오류나 오타를 잡아 내는 것이 좀 벅차다는 느낌을 받았습니다. 하하.. 아니면 코드가 복잡해 진다 싶으면 챕터별로 나누어서 저장하는 것도 방법인지? 궁금하네요.
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
선언하는 게 헷갈립니다(섹션15_선택된 날짜 상태관리하기)
선생님의 강의 진도를 나가면서 기본기를 계속 복습하고 있지만 제가 머리가 좋지 않아서 질문이 있습니다TopState 클래스 안에서 selctedDate는 왜 _TopState 함수 아래에 바로 선언하는데 now,textTheme 같은 경우엔 왜 빌드 함수 아래에 선언하는지 모르겠습니다
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
"Asset 파일 pubspec.yaml에 등록하기" 강의 1:17에서 '말씀드린 대로 인터넷에서 완성된 파일을 다운로드 받으셨을 텐데~' 이렇게 말씀해주셨는데 혹시 완성된 파일을 어디에서 다운로드 받을 수 있나요!?
"Asset 파일 pubspec.yaml에 등록하기" 강의 1:17에서 '말씀드린 대로 인터넷에서 완성된 파일을 다운로드 받으셨을 텐데~' 이렇게 말씀해주셨는데 혹시 완성된 파일을 어디에서 다운로드 받을 수 있나요!?
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
윈도우 에뮬세팅 강의 질문 입니다.
안녕하세요. 이전에 무료 강의를 잘 보고 이번에 유료강의도 신청하게되었습니다.다름이 아니라 에뮬레이터 세팅하는 강좌에서막히는 부분이 있어서 문의 드립니다.제가 안드로이드를 처음 설치한건 22년도 였고,플러터는 23년에 처음 접하게 되어서 유투브의 무료강의를 보며 배우고 있었는데그 당시에는 에뮬도 잘 돌아갔고 문제없이 핫리로드도 잘 되었습니다. 그러나 유투브 강의의 버전과 제가 설치한 버전의 차이로불편함이 많아지는 와중에 코드팩토리님을 알게되어 이렇게 찾아뵙게 되었습니다. 이번 기회에 안드로이드와플러터도 업데이트를 했는데.. 에뮬이 뭔가 이상합니다.사진을 첨부해보겠습니다. 혹시라도 부족한 부분이 있으면 언제든지 말씀해주세요. 보완해서 사진이나 기타 등등 올리겠습니다.첫번째사진.이게 왜 계속 뜨는지 모르겠습니다.C:\Users\hy_co\AppData\Local\Android\Sdk 경로로 가서 에뮬을 지우고 다시 깔아봤는데도 좀비처럼 계속 나타납니다...ㅜ두번째 사진.핫리로드도 잘되고 괜찮은거 같은데 숫자 카운팅되는 프로그램이 100% 작동되지 않습니다...@ 번외로 드리는 질문 입니다. @ 1. 코드팩토리 디스코드는 운영시간이 있으신가요? 원격조종도 운영시간이 있으신가요?제가 평일에는 낮에는 일을하고 집에 오면 육아 후에 공부를 할 수 있어서오후 9시30분 이후에나 컴퓨터를 할 수 있습니다..ㅜ주말에는 언제나 시간이 가능합니다. 스택오버플로우나 구글링으로 해결해보려 했으나 제가 실력이 부족한 탓에 해결하지 못하였습니다 ㅜ부디 도와주시면 감사하겠습니다.
-
해결됨Slack 클론 코딩[실시간 채팅 with React]
제네릭 질문
커스텀 훅에서 사용된 제네릭에 대해서 공부하다가 궁금한게 생겨서요.아래 테스트 코드에서'+' 연산자는 'T' 및 'T' 유형에 적용할 수 없습니다. 라는 에러 코드가 발생하는 이유가 이해가 안 가서요위 함수는 사용한다면 아래 처럼 숫자 또는 문자인 타입으로 쓰일텐데, 그러면 return 값에서 + 연산자가 number + number 또는 문자열 + 문자열로 실행되어 문제가 없을 것 같은데 에러가 뜨는 이유가 모르겠어서요add<number>(1, 2); add<string>('1', '2');지피티에 질문해보니 함수 오버로드를 쓰거나 return 값에 any를 쓰라곤 하는데 잘못된 방법 같고 extends로 타입 제한을 걸어도 같은 에러가 뜹니다function add<T extends number | string>(x: T, y: T): T { return x + y; }제가 참고한 제네릭 레퍼런스 자료입니다https://inpa.tistory.com/entry/TS-%F0%9F%93%98-%ED%83%80%EC%9E%85%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-Generic-%ED%83%80%EC%9E%85-%EC%A0%95%EB%B3%B5%ED%95%98%EA%B8%B0#%EC%A0%9C%EB%84%A4%EB%A6%ADgenerics_%EC%86%8C%EA%B0%9C
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
"E/updateAcquireFence: Did not find frame." 라는 로그와 함께 구글 지도가 정상적으로 표시되지 않습니다.
강사님께서 제공하신 버전으로도 진행을 해보았고, 새롭게 업데이트 된 버전으로 해보았으나 되지 않아 질문 남기게 되었습니다.API Key에 안드로이드 앱으로 설정을 완료도 해놓았고, 기타 부가적인 설정들도 pub.dev의 readme을 읽어보니 기존 버전과 같아서 동일하게 진행했지만, 사진 처럼 정상적으로 화면이 로드되지 않고 있습니다. 사진 상단의 텍스트는 frame을 찾지 못했다고 하길래 제가 추가해본 위젯입니다!
-
미해결애플 웹사이트 인터랙션 클론!
React에서 load 상태를 어떻게 감지할 수 있을까요?
안녕하세요. 강의 재미있게 완강하였습니다.Next.js에 애니메이션을 구현해보려고 하는데요.현재는 load event 대신 useEffect안에서 기능들을 호출하는 방식으로 구현하였는데, useEffect는 DOM요소들이 생성이 완료되는 시점에서 기능이 실행되어 이미지들의 다운로드가 다 완료되지 않은 상태에서도 Loading 화면이 끝나버립니다.useEffect안에서 onLoad나 eventListener load를 시도해보았지만 다른 eventListener와 다르게 제대로 동작하지 않는 현상이 발생합니다.혹시 답변이 가능하시다면 React에서는 Resource의 다운로드 완료 시점을 어떻게 알 수 있을지 조언 부탁드립니다!
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
list mapping 자동완성
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.colors.map에서 tab 누르면 colors.map((e)) => null), 이렇게 자동완성이 안되는데설정을 어디서 바꿔야하나요?코드팩토리 디스코드https://bit.ly/3HzRzUMFlutter 강의를 구매하시면 코드팩토리 디스코드 서버 플러터 프리미엄 채널에 들어오실 수 있습니다! 디스코드 서버에 들어오시고 저에게 메세지로 강의를 구매하신 이메일을 보내주시면 프리미엄 채널에 등록해드려요! 프리미엄 채널에 들어오시면 모든 질의응답 최우선으로 답변해드립니다!
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
프로젝트에서 dart map method가 보이지 않습니다.
위 처럼 map 함수 자체가 노출되지 않는 상황입니다.어떤 방법으로 해결할 수 있을까요?const를 빼도 동일합니다.자료형은 List<Color>로 잡혀있는 상황입니다.
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
part 파일 보기 설정 문의
안녕하세요.수업 중에 놓쳤을 수도 있는데, 강의 화면에의 안드로이드스튜디오 좌측 파일구조에서 part파일은 연결파일의 하위처럼 트리구조가 보이는데, 어떻게 설정해야되나요?
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
FutureBuilder에서 setstate사용
FutureBuilder를 사용하는 목적이 비동기 함수의 변경 사항을 감지하고 자동으로 ui를 업데이트 해주는 기능으로 알고 있습니다.그래서 stateless위젯에서도 사용가능한걸로 알고 있습니다.이번 프로젝트에서는 FutureBuilder를 사용해도 setState가 필요한지 헷갈립니다.혹시 제가 잘못 알고 있는 건지 아니면 future로 받는 테이블 데이터가 변경 사항이 없어서 그런 건지 궁금합니다!
-
미해결기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)
소스 수정 후 자동 컴파일 문의드립니다.
1.3 NextJS 설치 편에서다크모드 설정하는 부분에서 문의드립니다.<ThemeProvider attribute="class" defaultTheme="system" enableSystem disableTransitionOnChange > {children} </ThemeProvider>설정 후, 영상에서는 dark, light로 수정하면 반영되는것을 확인할 수 있는데 제 코드에서는Warning: Extra attributes from the server: class,style그리고Warning: Prop className did not match. Server: "__className_aaf875 vsc-initialized" Client: "__className_aaf875"라는 워닝이 발생하여 자동적으로 반영되지 않는 것을 확인했습니다.해당 이슈를 수정할 수 있는 방법이 있을까요 ?
-
해결됨기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)
정적배포
안녕하세요 ! 강의를 따라하고있다가문득 생각이 들었는데요.channel / [id] 이렇게 동적 페이지가 나오게 되면 정적 배포를 하게 될땐 어떤 방식으로 하시게 되나요 ?
-
해결됨기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)
zustand 상태관리
안녕하세요 ! 강의따라서 zustand 라는 상태관리 지금 사용해보고있는데요 강사님은 현업에서 백엔드와 같이 작업하시면서 zustand 사용하고 계시나요 ?? 만약 사용하고 계신다면 제한사항이나 불편한것들이 있었나요 ??