172만명의 커뮤니티!! 함께 토론해봐요.
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
Github 연결하려 하는데 마지막 단계에서 오류가 자꾸 떠요ㅜㅠ 홈페이지에서 precamp 파일을 지웠다가 다시 만들어도 보고 했는데 계속 저런 알 수 없는 오류가 뜨네요,, 어떻게 다시 연결할 수 있을까요? ㅜㅅㅜ
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
안녕하세요 쇼핑몰 레퍼런스 css 코드 104줄에 있는 .item .imgBox img는 왜 들어가있는지 알수있을까요? transition하고 아무 상관 없지 않나요?
해결됨
[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
ANOVA를 배울때는 ols 사용할때 독립변수 앞에 C()를 붙이는것이 분산분석은 범주형 분석이기에 앞에 C를 붙인다고 생각했는데요~ 로지스틱 회귀분석은 독립변수가 수치형, 종속변수가 이산/명목형으로 알고있는데.. Gender 앞에 C를 붙이는 이유가 있을가요? 오히려 Gender은 수치로 바꿔줘야할것 같은데.. 혹시 C 의 의미가 수치형->범주형, 범주형->수치형으로 양쪽 모두 바꿔주는 역할인건지 궁금합니다.
해결됨
[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
다중분류에서 쓰는 average = 'macro'가 무슨 의미일까요??
미해결
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
상품등록 페이지를 cypress 를 통해 test 해보던 도중 kakao map 을 사용해 주소입력 하는 부분에서 문제가 발생하고 있습니다. 개발자 도구를 사용해서 kakao map 의 input 의 class 확인해 해당 class name 으로 get()요청을 했지만 인식을 못하고 있습니다
해결됨
윤파고의 정보처리기사 DB/프로그래밍 All-In-One
혹시 기출문제 올인원은 어디서 볼 수 있나요?
해결됨
[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! 질문과 관련된 영상 위치를 알려주면 더 빠르게 답변할 수 있어요 먼저 유사한 질문이 있었는지 검색해보세요 문제 지문에서알려주는 제출 CSV 파일 형식은 0, 1, 1, 0 ... 이런 predict 결과값인데 0.11385 와 같이 predict_proba 확률값으로 결과를 제출해도 괜찮은 이유가 궁금합니다! roc_auc가 predict_proba 로 해야한다면 predict_proba로 모형 성능테스트를 하고 제출은 predict로 해야하는 것이 아닌가... 라는 의문이 들어서 문의드립니다
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
FAIL __test__/test/index.test.ts ● Test suite failed to run ReferenceError: TextEncoder is not defined 1 | // 하드코딩된 미니 백엔드 > 2 | import { graphql } from "msw"; | ^ 다음과 같은 에러가 뜨는 이유가 뭘까요? 찾아보니 node 18을 사용하지 않아 발생하는 문제라는데 node -v 을 확인해보면 제대로 18버전을 이용하고 있습니다
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
안녕하세요, 슬랙 채널에서 Next 14 강의 업로드 예정이시라는 글을 봤습니다. 해당 강좌의 리뉴얼 버전이라고 보면 될까요? 차이점이 궁금합니다. 감사합니다.
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
//app.js app.use('/', express.static(path.join(__dirname, 'uploads'))); //PostForm.js import { Button, Form, Input } from 'antd'; import React, { useCallback, useEffect, useRef } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import styled from 'styled-components'; import useInput from '../hooks/useInput'; import { ADD_POST_REQUEST, REMOVE_IMAGE, UPLOAD_IMAGES_REQUEST, addPost, } from '../reducers/post'; const FormWrapper = styled(Form)` margin: 10px 0 20px; `; const ButtonStyle = styled(Button)` float: 'right'; `; const PostForm = () => { const { imagePaths, addPostLoading, addPostDone } = useSelector( (state) => state.post ); const dispatch = useDispatch(); const imageInput = useRef(); const [text, onChangeText, setText] = useInput(''); useEffect(() => { if (addPostDone) { setText(''); } }, [addPostDone]); const onSubmitForm = useCallback(() => { if (!text || !text.trim()) { return alert('게시글을 작성하세요.'); } const formData = new FormData(); imagePaths.forEach((p) => { formData.append('image', p); }); formData.append('content', text); return dispatch({ type: ADD_POST_REQUEST, data: formData, }); }, [text, imagePaths]); const onClickImageUpload = useCallback(() => { imageInput.current.click(); }, [imageInput.current]); const onChangeImages = useCallback((e) => { console.log('images', e.target.files); //배열모양을 띄는 객체 const imageFormData = new FormData(); [].forEach.call(e.target.files, (f) => { imageFormData.append('image', f); }); dispatch({ type: UPLOAD_IMAGES_REQUEST, data: imageFormData, }); }, []); const onRemoveImage = useCallback( (index) => () => { dispatch({ type: REMOVE_IMAGE, data: index, }); }, [] ); return ( <FormWrapper encType='multipart/form-data' onFinish={onSubmitForm}> <Input.TextArea value={text} onChange={onChangeText} maxLength={140} placeholder='어떤 신기한 일이 있었나요?' /> <div> <input onChange={onChangeImages} type='file' name='image' hidden multiple ref={imageInput} /> <Button onClick={onClickImageUpload}>이미지 업로드</Button> <ButtonStyle type='primary' htmlType='submit'> Twit </ButtonStyle> </div> <div> {imagePaths.map((item, i) => ( <div key={item} style={{ display: 'inline-block' }}> <img src={`http://localhost:3065/${item}`} style={{ width: '200px' }} alt={item} /> <div> <Button onClick={onRemoveImage(i)}>제거</Button> </div> </div> ))} </div> </FormWrapper> ); }; export default PostForm; //post.js const multer = require('multer'); const path = require('path'); const fs = require('fs'); const { Post, Image, Comment, User } = require('../models'); const { isLoggedIn } = require('./middlewares'); const router = express.Router(); try { fs.accessSync('uploads'); } catch (error) { console.log('uploads 폴더가 없으므로 생성합니다.'); fs.mkdirSync('uploads'); } //이미지나 동영상처리는 웬만하면 프론트에서 클라우드로 바로 올리는게 좋다. const upload = multer({ storage: multer.diskStorage({ destination(req, file, done) { done(null, 'uploads'); }, //배포때는 s3로 , 개발에는 드라이브에 filename(req, file, done) { const ext = path.extname(file.originalname); //확장자 추출 const basename = path.basename(file.originalname, ext); done(null, basename + '_' + new Date().getTime() + ext); //이나당151817842.png }, }), limits: { fileSize: 20 * 1024 * 1024 }, //20MB }); router.post('/', isLoggedIn, upload.none(), async (req, res, next) => { // POST /post try { const post = await Post.create({ content: req.body.content, UserId: req.user.id, }); if (req.body.image) { if (Array.isArray(req.body.image)) { const images = await Promise.all( req.body.image.map((image) => Image.create({ src: image })) ); await post.addImages(images); } else { const image = await Image.create({ src: req.body.image }); await post.addImages(image); } } console.log('POST', post); const fullPost = await Post.findOne({ where: post.id, include: [ { model: Image, }, { model: Comment, include: [{ model: User, attributes: ['id', 'nickname'] }], }, { model: User, //작성자 attributes: ['id', 'nickname'], }, { model: User, //좋아요 누른 사람 as: 'Likers', attributes: ['id'], }, ], }); res.status(201).json(fullPost); } catch (error) { console.error(error); next(error); } }); router.post( '/images', isLoggedIn, upload.array('image'), async (req, res, next) => { //POST /post/images try { console.log(req.files); res.json(req.files.map((v) => v.filename)); } catch (error) { console.error(error); next(error); } } ); 안녕하세요 제로초님! 질문이 있습니다.. 파일은 제대로 올라가서 uploads 폴더안에 있는데 화면에서 이미지를 가져오지 못하고있습니다.. 프론트-백 api통신도 잘 되는데, 왜 개발자도구-네트워크에서 이미지를 가져올 수 없는지 이유를 모르겠습니다 ㅠㅠ
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
수업에서 async await를 쓰게 되면, await 뒤쪽 함수가 실행 된 후, await를 보자마자 어? 오래걸리겟네? 하면서 스레드가 해당 async함수를 통째로 마이크로큐에 넣어버린다고 말씀하셨는데요. 만약 await뒤의 함수가 Promise를 반환하게 되면, 해당 Promise를 반환하는 함수가 먼저 큐에 쌓이고, 그 뒤에 async함수가 들어가서 pipo구조에 따라, promise가 반환된 후 async함수가 실행되면서 기다리는것처럼 보인다고 말해주셨습니다. 근데... 이 말 대로라면, await 함수 뒤에 굳이 Promise가 올 필요가 있나요? XMLHttpRequest()가 오더라도, 콜스택에서 해당요청이 실행된 후, 결과값을 가진 상태에서 마이크로큐로 들어가니까, 똑같이 await가 되는게 아닌지요? 분명 순차적으로 수업을 들으면서 다 이해햇다고 생각햇는데 갑자기 헷갈립니다.
해결됨
[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
원핫 인코딩 코드에서 괄호 안에 [cols]를 쓸 때와 columns=cols를 쓸 때의 차이가 궁금합니다. 3-4 Feature engineering에서와 3-6 Regression에서 작성법이 달라서요. 3-6 Regression에서는 train[cols]로 썼더니 에러가 나네요ㅠ # 3-4 Feature engineering c_train[col] = le.fit_transform(c_train[col]) c_test[col] = le.transform(c_test[col]) # 3-6 Regression train = pd.get_dummies(train, columns=cols) test = pd.get_dummies(test, columns=cols)
해결됨
Next.js 시작하기(feat. 지도 서비스 개발)
선생님, 안녕하세요. 너무 기초적인 질문일 수 있지만, 갑자기 궁금해져서 질문드립니다. 서버사이드 렌더링의 경우, 서버에서 pre-render된 코드를 만들어서 보내주고, 클라이언트에서 hydrate를 해서 페이지를 만든다고 알고 있습니다. 클라이언트 사이드 렌더링의 경우는 html코드와 js코드를 함께 보내서, 클라이언트에서 페이지를 만들구요. 서버사이드 렌더링을 할 때, pre-render된 코드를 만드는 서버는 각 클라이언트들의 컴퓨팅 자원을 사용하는 건지(클라이언트의 컴퓨터에서 만드는 건지), 아니면 배포하는 중앙(?)서버(aws ec2 또는 이 강의에서 처럼 vercel)의 컴퓨팅 자원을 사용하는 건지(서버에서 만드는 건지) 궁금합니다. 클라이언트 측에서 다 계산을 한다고 하면, 중앙(?)서버의 부담이 적을테지만, 중앙(?)서버에서 한다고 하면, 부담이 갈 수 있을 것 같아서요. 최근 next.js 14버전이 되면서 디비와 직접 통신하는 등 기능이 많이 생겼는데, 이 통신하는 등의 역할은 client side가 아닌 server side에서만 가능하더라구요. 그래서 server side라는 게 중앙서버 하나에만 있다면, 계산이 오래걸린다거나 트래픽이 늘어나거나 한다면 다른 사용자들에게도 영향을 끼치지 않을까 궁금했습니다.(자동 확장이 되지 않을때) 또, 이런식으로 간다면 따로 백엔드 서버가 필요없게 될 수도 있겠다라고도 생각해봤는데, 어떻게 보고계시는지도 궁금합니다.
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
구글 웹에서 콘솔창을 켜면 계속 이 오류 화면이 뜨는데, 처음에는 무시하고 진행했는데 몇 달간 계속 뜨고 타이머 실습할 때 조금 끊기는 것 같기도 해요ㅜㅠ GPT에 물어보니까 권한이 적절치 않다고 하는데 어떻게 해결할 수 있는 건가요??ㅜㅜ
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
import { useRouter } from 'next/router'; const Profile = () => { ... const router = useRouter(); if (!me) { router.push('/'); return null; } ... } 이런식으로 하면 잘 동작해요~
미해결
따라하며 배우는 리액트 A-Z[19버전 반영]
input checkbox 에서 onChange ={() => this.handleCompleChange ( data .i d)} 함수를 실행하게끔하는데 () => 는 왜들어가는걸까요? 예를들어 같은 방식의 함수중에 onChange={this.handleChange} 함수의경우엔 () => 가 없더라구요. 구현 부분은 똑같이 함수이름 = (파라미터) => {} 로 구현되어 있습니다.
미해결
따라하며 배우는 리액트 A-Z[19버전 반영]
8분 47초 까지 따라했는데, 오류가 뜹니다. import React, { useEffect } from 'react' import axios from '../api/axios' export default function Row({ isLargeLow, title, id, fetchUrl }) { useEffect (() => { fetchMovieData(); }, []); const fetchMovieData = async () => { const request = await axios.get(fetchUrl); console.log('request', request); }; return ( <div> </div> ) } 터미널에서는 아래와 같은 오류가 뜨고, WARNING in ./src/components/Banner.css (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!./node_modules/source-map-loader/dist/cjs.js!./src/components/Banner.css) Module Warning (from ./node_modules/postcss-loader/dist/cjs.js): Warning (75:5) autoprefixer: start value has mixed support, consider using flex-start instead WARNING in [eslint] src/components/Row.js Line 7:8: React Hook useEffect has a missing dependency: 'fetchMovieData'. Either include it or remove the dependency array react-hooks/exhaustive-deps webpack compiled with 2 warnings 아래는 크롬에서 뜨는 오류입니다. Uncaught runtime errors: × ERROR Cannot read properties of undefined (reading 'fetchNetflixOriginals') TypeError: Cannot read properties of undefined (reading 'fetchNetflixOriginals') at App (http://localhost:3000/static/js/bundle.js:46:61) at renderWithHooks (http://localhost:3000/static/js/bundle.js:20698:22) at mountIndeterminateComponent (http://localhost:3000/static/js/bundle.js:23984:17) at beginWork (http://localhost:3000/static/js/bundle.js:25280:20) at HTMLUnknownElement.callCallback (http://localhost:3000/static/js/bundle.js:10290:18) at Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/bundle.js:10334:20) at invokeGuardedCallback (http://localhost:3000/static/js/bundle.js:10391:35) at beginWork$1 (http://localhost:3000/static/js/bundle.js:30265:11) at performUnitOfWork (http://localhost:3000/static/js/bundle.js:29512:16) at workLoopSync (http://localhost:3000/static/js/bundle.js:29435:9) ERROR Cannot read properties of undefined (reading 'fetchNetflixOriginals') TypeError: Cannot read properties of undefined (reading 'fetchNetflixOriginals') at App (http://localhost:3000/static/js/bundle.js:46:61) at renderWithHooks (http://localhost:3000/static/js/bundle.js:20698:22) at mountIndeterminateComponent (http://localhost:3000/static/js/bundle.js:23984:17) at beginWork (http://localhost:3000/static/js/bundle.js:25280:20) at HTMLUnknownElement.callCallback (http://localhost:3000/static/js/bundle.js:10290:18) at Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/bundle.js:10334:20) at invokeGuardedCallback (http://localhost:3000/static/js/bundle.js:10391:35) at beginWork$1 (http://localhost:3000/static/js/bundle.js:30265:11) at performUnitOfWork (http://localhost:3000/static/js/bundle.js:29512:16) at workLoopSync (http://localhost:3000/static/js/bundle.js:29435:9) ERROR Cannot read properties of undefined (reading 'fetchNetflixOriginals') TypeError: Cannot read properties of undefined (reading 'fetchNetflixOriginals') at App (http://localhost:3000/static/js/bundle.js:46:61) at renderWithHooks (http://localhost:3000/static/js/bundle.js:20698:22) at mountIndeterminateComponent (http://localhost:3000/static/js/bundle.js:23984:17) at beginWork (http://localhost:3000/static/js/bundle.js:25280:20) at beginWork$1 (http://localhost:3000/static/js/bundle.js:30243:18) at performUnitOfWork (http://localhost:3000/static/js/bundle.js:29512:16) at workLoopSync (http://localhost:3000/static/js/bundle.js:29435:9) at renderRootSync (http://localhost:3000/static/js/bundle.js:29408:11) at recoverFromConcurrentError (http://localhost:3000/static/js/bundle.js:28900:24) at performConcurrentWorkOnRoot (http://localhost:3000/static/js/bundle.js:28812:26)
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
타입스크립트 본수업은 문제없이 진행했는데 freeboard 부분을 진행하다가 api 관련 타입스크립트 설치 과정을 하는데 에러가 보입니다.. 이부분 혹시 뭐때문에 발생하는건지 확인 해주실 수 있으실까요ㅠㅠ
미해결
따라하며 배우는 리액트 A-Z[19버전 반영]
모달 창 외부 클릭 시 모달 닫게 만드는 Custom Hooks 생성 이 강의에서 useOnClickOutside custom hooks부분에서 event listener해제하는 부분이 addEventListener로 잘못되어 있내요
해결됨
손에 익는 Next.js - 공식 문서 훑어보기
혹시 서버 컴포넌트에서만 비동기 호출이 가능한건가요?? 그렇다면 서버 컴포넌트가 컴포넌트를 서버 내에서 미리 만들어 둘 때, 비동기 호출을 통해 데이터를 가져와서 이 값을 미리 가져와서 컴포넌트를 만드는 건가요?? 그리고 만약 그렇다면 왜 서버 컴포넌트에서만 비동기 호출이 가능하도록 만드신 건지 의도를 아시고 계신지 궁금합니다! (단순히 서버 컴포넌트의 장점 때문인건가요??) 그리고 강의의 진행은 SSR을 사용한다는 가정하에 진행해주셨던 게 맞나요?? (SSG도 동일한 건가요?)
