survey-pie 코드 .. 404...error 입니다. 딱 1년 만에 이 강의 들으려고 왔는데... 흐음.. (요즘 트랜드..리액트 버전이나... 암튼... 자료 , 강의는 업데이트 되고 있나요?종종..수정해서 올리는 강의를 본적이 있어서..) 암튼..주속 확인 부탁드립니다.

안녕하세요문의드립니다. 일단 제공해 주신 소스를 풀어서실행을 해 보았습니다.(당연히 npm i...관련 module 설치 하고요)터미널: npm run start를 실행하면  위와 같은 화면만 나오네요.그리고 개발자 도구 내용을 보면 index.tsx ? .. 소스상에 파일이 없는데 궁금합니다.일단 실행이 해서 개발 완료된 화면을 보고자 합니다.실행하기 전에 선행 작업있나요?(각 확장프로그램..등... )가이드를 봐도 내용이..(제가 못찾은 건지.)설명 부탁드립니다.  

안녕하세요문의드립니다. 일단 제공해 주신 소스를 풀어서실행을 해 보았습니다.(당연히 npm i...관련 module 설치 하고요)터미널: npm run start를 실행하면  위와 같은 화면만 나오네요.그리고 개발자 도구 내용을 보면 index.tsx ? .. 소스상에 파일이 없는데 궁금합니다.일단 실행이 해서 개발 완료된 화면을 보고자 합니다.실행하기 전에 선행 작업있나요?(각 확장프로그램..등... )가이드를 봐도 내용이..(제가 못찾은 건지.)설명 부탁드립니다.  

안녕하세요! 강의 노션에서는이렇게 나와있는데 npx tailwindcss init만으로는 tailwind.config.js만 설치되고, postcss.config.js는 설치가 안되는 게 아닌가요? npx tailwind init -p 명령어를 사용해야 하는지 여쭤보고 싶습니다! 그리고 위 두 명령어만 입력해서 tailwind를 사용하려고 하니 에러가 떠서 찾아보니까Vite가 postcss.config.js 읽다가 autoprefixer 플러그인을 불러오려고 했는데, 프로젝트에 autoprefixer 패키지가 설치되어 있지 않아서 터진 거야.라고 하더라구요npm install -D tailwindcss@3이 아니라 npm install -D tailwindcss@3 postcss autoprefixer 이 명령어를 사용해야 한다고 해서 사용해보니 에러가 해결된 상태입니다.노션에 적혀있는 명령어와 달라서 여쭤봅니다! npm install -D tailwindcss@3 postcss autoprefixernpm install -D taiㅇindcss@3 postcss autopnpm install -D tailwindcss@3 postcss autoprefixerrefixer

안녕하세요 강의를 사놓고 조금 듣고 네이티브 공부를 하다가 다시 공부를 하려고합니다 강의상에서는 넥스트를 9버젼을 쓰는데 최신 버젼을 쓰는걸 추천하실까요? 아니면 구버젼 그대로 쓰는걸 추천하실까요?

안녕하세요 강의 잘 듣고 있습니다.비주얼 스튜디오 Live Server 확장 다운받고 'Open with Live Server'을 눌러서 실행을 했는데 브라우저(크롬)가 자동으로 켜지지 않습니다.실행을 하고 직접 주소를 입력하면 접속은 됩니다. 어떻게 하면 자동으로 활성화 되게 할 수 있을까요?

🛑 질문은 이곳이 아닌, 노션 페이지에 해주세요!!질문 방법 보기: https://youtu.be/2OQoqcQMxhA노션 페이지 링크: https://yalco.notion.site/157ff6b3a35780918b5af38738e7758c?pvs=4 5:50 부분 화면 표시가 잘못된것같습니다.Color count: {colors.length} 인데 위에 const numbers = [1, 2, 3, 4, 5]; 로 표시되어져있어요.

Day 19 미션 안내에서 '요구사항 2'의 State 생성 요구사항 중 action.type이 INIT인 경우에는 어떤 액션을 구현 하면 될까요?

 로그인시 401 Unauthorized 오류가 떠서리덕스 액션을 봤더니 LOG_IN_FAILURE에 error 내용이 비어 있었습니다.routes/user.jsconst express = require("express"); const bcrypt = require("bcrypt"); const { User, Post } = require("../models"); const passport = require("passport"); const router = express.Router(); router.post("/login", (req, res, next) => { console.log("🧾 req.body:", req.body); passport.authenticate("local", (err, user, info) => { if (err) { console.error(err); return next(err); } if (info) { return res.status(401).send(info.reason); } return req.login(user, async (loginerr) => { if (loginerr) { console.error(loginerr); return next(loginerr); } const fullUserWithoutPassword = await User.findOne({ where: { id: user.id }, attributes: { exclude: ["password"], }, include: [ { model: Post, }, { model: User, as: "Followings", }, { model: User, as: "Followers", }, ], }); return res.status(200).json(fullUserWithoutPassword); }); })(req, res, next); }); router.post("/", async (req, res, next) => { try { const exUser = await User.findOne({ where: { email: req.body.email, }, }); if (exUser) { return res.status(403).send("이미 사용중인 아이디입니다."); } const hashedPassword = await bcrypt.hash(req.body.password, 12); await User.create({ email: req.body.email, nickname: req.body.nickname, password: hashedPassword, }); res.status(201).send("ok"); } catch (error) { console.error(error); next(error); } }); module.exports = router; 세션 쿠키가 잘 전달이 안된건가 싶어서 req.body를 서버 터미널로 찍었더니 req.body: undefined 로 나왔습니다.로그인 폼에서 데이터를 잘못 넘겨준건가 해서 확인해봤더니 loginForm.js const onSubmitForm = useCallback(() => { console.log(email, password); dispatch(loginRequestAction({ email, password })); }, [email, password]);데이터도 잘 넘겨준 것 같고sagas/user.jsfunction logInAPI(data) { return axios.post("/user/login", data); } function* logIn(action) { try { const result = yield call(logInAPI, action.data); yield put({ type: LOG_IN_SUCCESS, data: result.data, }); } catch (err) { console.error(err); yield put({ type: LOG_IN_FAILURE, error: err.response.data, }); } }사가쪽도 문제가 없어보여서 프론트 쪽 문제는 아닌 것 같고 백엔드쪽 문제 같은데 도저히 어디서 문제가 생긴건지 모르겠습니다.app.jsconst express = require("express"); const cors = require("cors"); const session = require("express-session"); const cookieParser = require("cookie-parser"); const postRouter = require("./routes/post"); const userRouter = require("./routes/user"); const db = require("./models"); const passportConfig = require("./passport"); const passport = require("passport"); const dotenv = require("dotenv"); dotenv.config(); const app = express(); db.sequelize .sync() .then(() => { console.log("db 연결성공"); }) .catch(console.error); passportConfig(); app.use( cors({ origin: "*", credentials: false, }) ); app.use(express.json()); app.use(express.urlencoded({ extended: true })); app.use(cookieParser(process.env.COOKIE_SECRET)); app.use( session({ saveUninitialized: false, resave: false, secret: process.env.COOKIE_SECRET, }) ); app.use(passport.initialize()); app.use(passport.session()); app.get("/", (req, res) => { res.send("hello express"); }); app.get("/api", (req, res) => { res.json([ { id: 1, content: "hello", }, { id: 2, content: "hello2", }, { id: 3, content: "hello3", }, ]); }); app.get("/api/posts", (req, res) => { res.json([ { id: 1, content: "hello", }, { id: 2, content: "hello2", }, { id: 3, content: "hello3", }, ]); }); app.use("/post", postRouter); app.use("/user", userRouter); app.listen(3065, () => { console.log("서버 실행 중!"); }); passport/local.jsconst passport = require("passport"); const { Strategy: LocalStrategy } = require("passport-local"); const { User } = require("../models"); const bcrypt = require("bcrypt"); module.exports = () => { passport.use( new LocalStrategy( { usernameField: "email", passwordField: "password", }, async (email, password, done) => { try { console.log("입력값:", email, password); const user = await User.findOne({ where: { email }, }); console.log("찾은 유저:", user && user.email); if (!user) { return done(null, false, { reason: "존재하지 않는 이메일입니다!" }); } const result = await bcrypt.compare(password, user.password); if (result) { return done(null, user); } return done(null, false, { reason: "비밀번호가 틀렸습니다." }); } catch (error) { console.log(error); return done(error); } } ) ); }; passport/index.jsconst passport = require("passport"); const local = require("./local"); const { User } = require("../models"); module.exports = () => { passport.serializeUser((user, done) => { done(null, user.id); }); passport.deserializeUser(async (id, done) => { try { const user = await User.findOne({ where: { id } }); done(null, user); } catch (error) { console.error(error); done(error); } }); local(); }; 백엔드 코드를 첨부하였습니다.터미널에 나온 콘솔 내용입니다.local.js파일에서도 콘솔("입력값:","찾은 유저:" )을 찍었는데 터미널에 찍힌 콘솔은 req.body만 찍혔습니다..

안녕하세요.지금 리액트 따라하기 하면서 보고있는데eslint 부분 설정에서저는 eslintrc.cjs란 파일이 없고 eslint.config.js란 파일만 있는데 rules 상에서는 처음에 no-unsed-vars는 error로 되있어서 off로 바꿔줬는"react/prop-types": "off" , 부분은 어떡해 추가해 줘야 하는지요.

🚨 필독) 질문하시기 전에 꼭 읽어주세요 (10초 소요)제목을 구체적으로 작성해 주세요✅ 좋은 예 : 감정일기장 Home 구현중 xx 이슈가 발생합니다.⛔️ 나쁜 예 : 이거 왜 안되나요?, 오류나요 도와주세요 등비슷한 궁금함을 갖고 계신 분들께 도움이 될 수 있어요!   코드의 이슈는 전체 프로젝트를 "링크 형태"로 올려주셔야 원인을 파악할 수 있습니다.깃허브, 구글드라이브 등의 수단을 통해 링크 형태로 전달해주세요직접 실행해보며 원인을 파악해야 하기 때문에 텍스트 형태로 붙여넣는건 삼가해주세요 🥲 답변이 도움이 되셨다면 답글 or 해결완료 버튼을 클릭해주세요비슷한 궁금함을 갖고 계신 분들께 도움이 될 수 있어요!제 답변이 여러분께 도움이 되었는지 저도 알고 싶어요 🥲 강의 내용에 궁금한 점이 있다면 몇 챕터의 몇 분 몇 초인지 알려주시면 더 좋아요더 빠른 답변이 가능합니다!  영상과 똑같이 코드를 작성하였을 때, 렌더링 되는 화면이 모두 날아갔습니다. 이때  이렇게 return 을 추가하니 정상작동하게 되었는데 이유가 궁금합니다.

npm : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Program Files\nodejs\npm.ps1 파일을 로드할 수 없습니다. 자세한 내용은 about_Execution_Policies(https://go.microsoft.com/fwlink/?LinkID=135170)를 참조하십시오.위치 줄:1 문자:1+ npm i randomcolor+ ~~~ + CategoryInfo : 보안 오류: (:) [], PSSecurityException + FullyQualifiedErrorId : UnauthorizedAccess  왜 이러죠... npm.ps1 파일을 찾아봣는데 없어요....

eslintrc.cjs 파일이 eslint.config.js 와 같은 건가요? 같은 아이콘의 파일을 받았는데 eslint.config.js라고 되어있어서 여쭈어봅니다

102강 강의를 듣고 있는데요,react-native-reanimated-carousel 설치 위해 노션에 링크대로npm install react-native-reanimated-carousel@3.3.0 명령어로 설치하고그 이후 expo install --npm react-native-reanimated react-native-gesture-handler 를 입력하여 터미널에서 설치 완료하였습니다질문 1.이후babel.config.js 파일에 가서 plugins: ["react-native-reanimated/plugin"], 추가 해야하는데 문제는 babel.config.js 파일이 존재하지 않아 어디에 플러그인 작성해야 하는지 모르겠습니다 첨부 사진package.json에 디펜던시를 보면 아래와 같아요"react": "19.1.0", "react-native": "0.81.5", "react-native-reanimated-carousel": "^3.3.0", "react-native-reanimated": "~4.1.1", "react-native-gesture-handler": "~2.28.0"질문 2. Babel 설정 위해 Cache 초기화 하는 부분도 위에 질문1이 순서대로 정상적으로 진행이 되지 않아스킵했는데 babel.config.js에 플러그인 문구부터 저장한 뒤 바벨 설정 캐시초기화 하는 것이 옳지요? 질문 3102강 시작부터 ~ 18분 56초 까지 타이핑한 grab-market-mobile의 App.js소스 내용아래와 같은데 이것을 실행하면 사진과 같이 안드로이드 스튜디오(runtime not ready)에서 에러 발생 아래 App.js 는 강의 전체 완성본 소스가 아니라 에러가 난 시점까지의 소스 입니다질문4->여기서 Carousel 부분 살펴보면 아래 App.js 소스에서 아래와 같이 작성하는 것 맞나요?만약 아래 작성 소스가 다르면 어떻게 작성 해야하는지 댓글에 소스 적어주세요<Carouseldata={banners}width={Dimensions.get("window").width} height={200}autoPlay={true}renderItem={(obj)=>{ return( <TouchableOpacity> <Imagesource={{uri:obj.item.imageUrl}} /> </TouchableOpacity> ) }} />  import { StatusBar } from "expo-status-bar"; import React from "react"; import { StyleSheet, Text, View, Image, ScrollView, Dimensions, TouchableOpacity } from "react-native"; import BasketballImage from "./assets/products/basketball1.jpeg"; import Avatar from "./assets/icons/avatar.png"; import {API_URL} from "./config/constants"; import axios from "axios"; import dayjs from "dayjs"; import relativeTime from "dayjs/plugin/relativeTime"; import "dayjs/locale/ko"; import Carousel from "react-native-reanimated-carousel"; dayjs.extend(relativeTime); dayjs.locale("ko"); export default function App() { const [products, setProducts] = React.useState([]); const [banners, setBanners] = React.useState([]); React.useEffect(()=>{ axios.get(`${API_URL}/products`).then((result)=>{ setProducts(result.data.products); }).catch((error)=>{ console.error(error); }) axios.get(`${API_URL}/banners`).then((result)=>{ setBanners(result.data.banners); }).catch((error)=>{ console.error(error); }) },[]) return ( <View style={styles.container}> <ScrollView> <Carousel data={banners} width={Dimensions.get("window").width} height={200} autoPlay={true} renderItem={(obj)=>{ return( <TouchableOpacity> <Image source={{uri : obj.item.imageUrl}} /> </TouchableOpacity> ) }} /> <Text style={styles.headline}>판매되는 상품들</Text> <View style={styles.productList}> { products.map((product, index)=>{ return (<View style={styles.productCard} key={product.id}> {product.soldout === 1 && <View style={styles.productBlur}/>} <View> <Image style={styles.ProductImage} source={{uri: `${API_URL}/${product.imageUrl}`,}} resizeMode={"contain"} /> </View> <View style={styles.productContents}> <Text style={styles.productName}>{product.name}</Text> <Text style={styles.productPrice}>{product.price}원</Text> <View style={styles.productFooter}> <View style={styles.productSeller}> <Image style={styles.productAvatar} source={Avatar} /> <Text style={styles.productSellerName} >{product.seller}</Text> </View> <Text style={styles.productDate}>{dayjs(product.createdAt).fromNow()}</Text> </View> </View> </View>); }) } </View> </ScrollView> </View> ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: '#fff', paddingTop: 32, }, productCard: { width: 320, borderColor: 'rgb(230,230,230)', borderWidth:1, borderRadius: 16, backgroundColor: "white", marginBottom: 8, }, ProductImage :{ width: '100%', height: 210 }, productContents : { padding: 8 }, productSeller : { flexDirection: 'row', alignItems: 'center' }, productAvatar: { width:24, height:24, }, productFooter: { flexDirection: 'row', justifyContent:'space-between', alignItems: 'center', marginTop: 12, }, productName : { fontSize: 16 }, productPrice: { fontSize: 18, fontWeight: '600', marginTop: 8 }, productSellerName: { fontSize: 16, }, productDate: { fontSize: 16, }, productList: { alignItems:"center", }, headline : { fontSize: 24, fontWeight: "800", marginBottom:24 }, productBlur : { position: 'absolute', top: 0, bottom: 0, right: 0, left: 0, backgroundColor: "#ffffffaa", zIndex: 999, }, }); 에러 해결 차근차근 알려주셨으면 좋겠습니다---------------------------------------------------------------------------------------------질문 5 babel.config.js 없기에 프로젝트 루트에 파일을 직접 생성하고 module.exports = {presets: ['babel-preset-expo'],plugins: ['react-native-reanimated/plugin'],};위 소스입력 후 저장 완료 후 캐시 초기화를 위해 expo start -c 까지 차례대로 수행 후 ngrok과 모바일/서버로 연동 후 결과가 위 버전 에러와 다르게 새로운 에러가 발생했습니다어떻게 해결하죠? 질문6 아래 게시글 답변대로 질문 2까지 수행 하니 아래와 같은 에러가 발생질문7 아래게시글 답변에 질문 3 및 3-1은 하라는대로 실행해보면 에러가 발생할까 실행을 안했는데 3개를 입력해 줘도 괜찮은건가요?명령어 1: npm uninstall react-native-reanimated-carousel react-native-reanimated명령어 2:npm install react-native-reanimated-carousel@3.3.0 react-native-reanimated@^2.0.0명령어 3:expo install react-native-gesture-handler질문8 잘 되던 안드로이드 스튜디오가 로딩을 왜 못할까요?  

PS D:\programming\react-Lee\projects\section12> vercel loginvercel : 'vercel' 용어가 cmdlet, 함수, 스크립트 파일 또는 실행할 수 있는 프로그램 이름으로 인식되지 않습니다. 이름이 정확한지 확인하고 경로가 포함된 경우 경로가 올바른지 검증한 다음 다시 시도하십시오.위치 줄:1 문자:1+ vercel login+ ~~~~~~ + CategoryInfo : ObjectNotFound: (vercel:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundExceptionPS D:\programming\react-Lee\projects\section12> --- vercel login이란 명령어를 입력하니 위와 같은 에러가 뜨는데요. vscode에 아무것도 안깔고 회원가입만 했다고 vercel이란 명령어를 쓸 수 있는건가요??

안녕하세요!제가 vercel에 배포를하려고 시도하고 있습니다.현재까지 진행 상황과 문제를 정리하면 아래와 같습니다. 프로젝트 배포는 정상적으로 완료됨그러나 브라우저에 접속 시 파비콘이 표시되지 않음 <link rel="icon" type="image/svg+xml" href="/favicon.ico" /> public 폴더 내 favicon.ico 파일 존재로컬 개발 서버(npm run dev)에서는 정상적으로 표시됨배포 후 URL 접속 시 브라우저 캐시를 지워도 여전히 표시되지 않음 혹시 Vercel 환경에서 파비콘이 정상적으로 나오도록 하기 위해 추가로 확인해야 할 부분이나, 권장 설정이 있을지 조언 부탁드립니다. 

Day10 미션 안내에서 예시 이미지가 보이지 않는 거 같습니다. 

useEffect 함수 안에서 setCurDiaryItem을 호출했는데,“setState를 동기적으로 호출하면 안 된다” 는 경고가 발생합니다.기능적으로는 정상 동작하는 것처럼 보이는데,이런 방식이 올바른 사용인지, 아니면 구조를 수정하는 게 맞는지 궁금해서 질문드립니다.

안녕하세요 Header.jsx 수정중 궁금한점이 있어서 질문드립니다!new Date() 함수는 날짜를 가져오는 함수라 리렌더링이 계속 될것같은데 memo 를 사용하면 리렌더링이 안되는건가요 ??  

강의 10.3에서 TodoItem.jsx의 onchange 이벤트가 발생할때마다 부모도 같이 재랜더링 되는것 같아서요. 제가 짠 소스도 참고해보시면 부모 태그들에 각각 재랜더링이 될때마다 로그를 찍어봤는데 다 찍혀서로그 찍는 시점이 잘못된건지React dev tool이 이상한건지제가 코드를 잘못 친건지모르겠어서 질문 드립니다.   https://github.com/Joonsby/one-bite-react/tree/master/section10코드는 위에 링크에 올려놨으니 참고해주시면 될것 같습니다.