inflearn logo
강의

강의
N
챌린지

챌린지
멘토링

멘토링
N
클립

클립
로드맵

로드맵
지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

useInput 했을때, 배열의 첫번째 요소가 func으로 나와요

해결됨

[리뉴얼] React로 NodeBird SNS 만들기

id와 nickname에 마우스를 올리면 useState를 이용한 password(string), passwordCheck(boolean)과 다르게, 함수라고 나오는데 이렇게 되어도 괜찮은건가요?? 그리고 이것과 관련된 오류인지는 모르겠는데, 약관동의 버튼을 누르고 아이디와 비밀번호를 수정해도 값이 변경되지않습니다. 강의랑 똑같이 작성한것같은데 어디가 잘못된건지 모르겠네요 ㅠㅠ .. 어떻게 해결해야 할까요?? ```signup.js import React, { useCallback, useState } from 'react'; import AppLayout from '../components/AppLayout'; import Head from 'next/head'; import styled from 'styled-components'; import { Button, Checkbox, Form, Input } from 'antd'; import useInput from '../components/hooks/useInput'; const ErrorMessage = styled.div` color: red; `; const Signup = () => { const [id, onChangeId] = useInput(''); const [nickname, onChangeNickname] = useInput(''); const [password, onChangePassword] = useInput(''); const [passwordCheck, setPasswordCheck] = useState(''); const [passwordError, setPasswordError] = useState(false); const onChangePasswordCheck = useCallback( (e) => { setPasswordCheck(e.target.value); setPasswordError(e.target.value !== password); }, [password] ); console.log(id); const [term, setTerm] = useState(false); const [termError, setTermError] = useState(false); const onChangeTerm = useCallback((e) => { setTerm(e.target.checked); setTermError(false); }, []); const onSubmit = useCallback(() => { if (password !== passwordCheck) { return setPasswordError(true); } if (!term) { return setTermError(true); } console.log(id, nickname, password); }, [password, passwordCheck, term]); return ( <> <AppLayout> <Head> <title>회원가입 | NodeBird</title> </Head> <Form onFinish={onSubmit}> <div> <label htmlFor="user-id">아이디</label> <br /> <Input name="user-id" value={id} required onChange={onChangeId} /> </div> <div> <label htmlFor="user-nick">닉네임</label> <br /> <Input name="user-nick" value={nickname} required onChange={onChangeNickname} /> </div> <div> <label htmlFor="user-password">패스워드</label> <br /> <Input name="user-password" value={password} required onChange={onChangePassword} /> </div> <div> <label htmlFor="user-password-check">비밀번호체크</label> <br /> <Input name="user-password-check" value={passwordCheck} required onChange={onChangePasswordCheck} /> {passwordError && ( <ErrorMessage>비밀번호가 일치하지 않습니다</ErrorMessage> )} </div> <div> <Checkbox name="user-term" checked={term} onChange={onChangeTerm}> 약관에 동의합니다. </Checkbox> {termError && <ErrorMessage>약관에 동의하지 않습니다</ErrorMessage>} </div> <div style={{ marginTop: '10px' }}> <Button type="primary" htmlType="submit"> 가입하기 </Button> </div> </Form> </AppLayout> </> ); }; export default Signup; import { useState, useCallback } from 'react'; export default (initialValue = null) => { const [value, setValue] = useState(initialValue); const handler = useCallback((e) => { setValue(e.target.value); }, []); return [value, handler]; };

  • useinput
  • 커스텀훅
  • nodejs
  • react
  • redux
  • express
  • Next.js
ohjaehokor 댓글 1 좋아요 0 조회수 484

강의 자막

미해결

프론트엔드 개발자를 위한, 실전 웹 성능 최적화(feat. React) - Part. 1

안녕하세요, 동균님! 😁 강의 자막은 제공되지 않는걸까요!?

  • devtools
  • react
한세계 댓글 2 좋아요 1 조회수 976

선생님 삭제기능은 어떤식으로 해야될까요

미해결

따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)

선생님 포스트 나 댓글 삭제기능은 어떤식으로 해야될까요 따로 강의는 없겟죠? ㅠ

  • typescript
  • nodejs
  • react
  • docker
  • postgresql
  • Next.js
  • 클론코딩
레드 댓글 1 좋아요 0 조회수 439

이미지 지연 로딩 질문 있습니다!

해결됨

프론트엔드 개발자를 위한, 실전 웹 성능 최적화(feat. React) - Part. 2

이미지 지연 로딩에서 picture tag를 사용하여 webp가 지원되지 않는 브라우저인 경우 jpg로 로딩되도록 previousSibling을 사용하셨는데 picture tag 안에 source tag가 두 개 이상인 경우에는 어떻게 해야하나요? 반복문을 돌려야 하는 것인가요?

  • devtools
  • react
marios 댓글 1 좋아요 2 조회수 473

오늘 구매햇구요 토씨 하나 안틀리고 클라이언트 환경세팅 9:02까지왔습니다 에러로 안됩니다/

해결됨

풀스택 리액트 라이브코딩 - 간단한 쇼핑몰 만들기

[plugin:vite:react-babel] D:\react_01\shopping-mall\src\routes.tsx: Unterminated string constant. (14:14) 17 | } D:/react_01/shopping-mall/src/routes.tsx:14:14 12 | element: <GlobalLayout />, 13 | children: [ 14 | { path: 'D:\', element: <DynamicIndex />, index: true}, | ^ 15 | { path: 'D:\products\:id', element: <DynamicId />, }, 16 | ] at instantiate (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:67:32) at constructor (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:364:12) at TypeScriptParserMixin.raise (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:3365:19) at Object.unterminated (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:2333:20) at readStringContents (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:2065:16) at TypeScriptParserMixin.readString (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:3244:9) at TypeScriptParserMixin.getTokenFromCode (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:2964:14) at TypeScriptParserMixin.getTokenFromCode (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:7267:18) at TypeScriptParserMixin.getTokenFromCode (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:9752:18) at TypeScriptParserMixin.nextToken (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:2451:10) at TypeScriptParserMixin.next (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:2366:10) at TypeScriptParserMixin.eat (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:2371:12) at TypeScriptParserMixin.parseObjectProperty (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:12126:14) at TypeScriptParserMixin.parseObjPropValue (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:12154:100) at TypeScriptParserMixin.parseObjPropValue (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:9482:18) at TypeScriptParserMixin.parsePropertyDefinition (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:12083:17) at TypeScriptParserMixin.parseObjectLike (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:11993:21) at TypeScriptParserMixin.parseExprAtom (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:11464:23) at TypeScriptParserMixin.parseExprAtom (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:7239:20) at TypeScriptParserMixin.parseExprSubscripts (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:11171:23) at TypeScriptParserMixin.parseUpdate (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:11153:21) at TypeScriptParserMixin.parseMaybeUnary (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:11127:23) at TypeScriptParserMixin.parseMaybeUnary (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:9590:20) at TypeScriptParserMixin.parseMaybeUnaryOrPrivate (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:10956:61) at TypeScriptParserMixin.parseExprOps (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:10962:23) at TypeScriptParserMixin.parseMaybeConditional (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:10937:23) at TypeScriptParserMixin.parseMaybeAssign (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:10895:21) at TypeScriptParserMixin.parseMaybeAssign (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:9529:20) at D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:10863:39 at TypeScriptParserMixin.allowInAnd (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:12640:12) at TypeScriptParserMixin.parseMaybeAssignAllowIn (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:10863:17) at TypeScriptParserMixin.parseExprListItem (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:12380:18) at TypeScriptParserMixin.parseExprList (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:12352:22) at TypeScriptParserMixin.parseArrayLike (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:12240:26) at TypeScriptParserMixin.parseArrayLike (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:8976:24) at TypeScriptParserMixin.parseExprAtom (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:11455:23) at TypeScriptParserMixin.parseExprAtom (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:7239:20) at TypeScriptParserMixin.parseExprSubscripts (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:11171:23) at TypeScriptParserMixin.parseUpdate (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:11153:21) at TypeScriptParserMixin.parseMaybeUnary (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:11127:23) at TypeScriptParserMixin.parseMaybeUnary (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:9590:20) at TypeScriptParserMixin.parseMaybeUnaryOrPrivate (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:10956:61) at TypeScriptParserMixin.parseExprOps (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:10962:23) at TypeScriptParserMixin.parseMaybeConditional (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:10937:23) at TypeScriptParserMixin.parseMaybeAssign (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:10895:21) at TypeScriptParserMixin.parseMaybeAssign (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:9529:20) at D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:10863:39 at TypeScriptParserMixin.allowInAnd (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:12640:12) at TypeScriptParserMixin.parseMaybeAssignAllowIn (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.js:10863:17) at TypeScriptParserMixin.parseObjectProperty (D:\react_01\shopping-mall\node_modules\@babel\parser\lib\index.j 라고 코드 에러낫구요 이런 상황입니다 1화 앱입니다까지 햇고 그뒤로 product 페이지 만드는데서안되네요 오늘 구매햇구요 토씨 하나 안틀리고 클라이언트 환경세팅 9:02까지왔습니다 에러로 안됩니다/ 반품해도될까요? window 환경입니다 지금강의하신것은 mac 으로하시는것으로보입니다만 제환경에서는 안될것같군요 원활한 해결책을 보고 환불을 결정하겟습니다

  • graphql
  • firebase
  • react
oksky2957 댓글 1 좋아요 1 조회수 961

슬랙 초대 부탁드립니다!

해결됨

코딩은 실전이다! - Git알못을 위한 깃린이코스(Git, Github 실습위주)

dpfl420@naver.com 감사합니당

  • github
  • git
  • 버전관리시스템
dpfl420 댓글 1 좋아요 0 조회수 350

연습문제 1 질문입니다

미해결

데이터 분석을 위한 파이썬: 입문부터 꿀팁까지

set_name 함수가 사라지고 set_cat함수가 남는 이유는 후에 class Cat을 정의하는 부분에 set_name에 대한 내용이 없기 떄문일까요? 이전에 정의했던 부분이 새로고침처럼 날아가는 건지, 추가되는건지 헷갈립니다 ㅠㅠ

  • python
  • 데이터 엔지니어링
안녕 댓글 1 좋아요 0 조회수 514

PostForm에서 Input이 초기화가 되지않습니다.

해결됨

[리뉴얼] React로 NodeBird SNS 만들기

짹짹 버튼을 눌렀을 때, 처음 클릭 시에만 해당 Input이 초기화 되고, 그 뒤로는 초기화 되지 않는 오류입니다. useEffect가 addPostDone 이 바뀔 때 마다 작동이 되어야 하는데, Redux Devtool에서는 분명 변경이 되었음에도 , PostForm에서 변경이 없는걸로 감지가 됩니다. PostAction export const ADD_POST_REQUEST = 'ADD_POST_REQUEST'; export const ADD_POST_SUCCESS = 'ADD_POST_SUCCESS'; export const ADD_POST_FAILURE = 'ADD_POST_FAILURE'; const addPostRequestAction = (data) => ({ type: ADD_POST_REQUEST, data, }); export { addPostRequestAction, }; post.js (reducer) import shortId from 'shortid'; const dummyPost = (data) => ({ id: shortId.generate(), content: data, User: { id: 1, nickname: 'admin', }, Images: [], Comments: [], }); const reducer = (state = initialState, action) => { switch (action.type) { case ADD_POST_REQUEST: console.log('ADD_POST_REDUCER'); return { ...state, addPostLoading: true, addPostDone: false, addPostError: null, }; case ADD_POST_SUCCESS: return { ...state, mainPosts: [dummyPost(action.data), ...state.mainPosts], addPostLoading: false, addPostDone: true, }; case ADD_POST_FAILURE: return { ...state, addPostLoading: false, addPostError: action.error, }; default: return state; } }; ==Redux-Saga=== index.js(rootSaga) import { all, fork } from 'redux-saga/effects'; import postSaga from './post'; import userSaga from './user'; export default function* rootSaga() { yield all([ fork(postSaga), fork(userSaga), ]); } postSaga import { all, fork, takeLatest, put, delay } from 'redux-saga/effects'; import axios from 'axios'; import { ADD_POST_REQUEST, ADD_POST_SUCCESS, ADD_POST_FAILURE, } from '../reducers/Actions/post'; function* addPostRequest(action) { try { // const result = yield call(addPostAPI,action.data) delay(1000); yield put({ type: ADD_POST_SUCCESS, data: action.data, }); } catch (err) { yield put({ type: ADD_POST_FAILURE, error: err.response.data, }); } } function* watchAddPost() { yield takeLatest(ADD_POST_REQUEST, addPostRequest); } export default function* postSaga() { yield all([ fork(watchAddPost), ]); } ==Component== PostForm.js import { useCallback, useRef, useEffect, useState } from 'react'; import { Form, Input, Button } from 'antd'; import { useDispatch, useSelector } from 'react-redux'; import { addPostRequestAction } from '../reducers/Actions/post'; const PostForm = () => { const { imagePaths, addPostLoading, addPostDone } = useSelector((state) => state.post); const [text, setText] = useState(''); const dispatch = useDispatch(); useEffect(() => { if (addPostDone) { setText(''); } }, [addPostDone]); const onSubmit = useCallback(() => { dispatch(addPostRequestAction(text)); }, [text]); const onChangeText = useCallback((e) => setText(e.target.value), []); return ( <Form style={{ margin: '10px 0 20px' }} encType="multipart/form-data" onFinish={onSubmit}> <Input.TextArea value={text} onChange={onChangeText} maxLength={140} placeholder="어떤 신기한 일이 있었나요?" /> <div> {imagePaths.map((v) => ( <div key={v} style={{ display: 'inline-block' }}> <img src={v} style={{ width: '200px' }} alt={v} /> <div> <Button>제거</Button> </div> </div> ))} </div> </Form> ); }; export default PostForm;

  • react
  • redux
  • express
  • nodejs
  • Next.js
댓글 1 좋아요 0 조회수 469

장고 서버 실행 오류 질문남깁니다.

미해결

장고 설계철학으로 시작하는 파이썬 장고 입문

안녕하세요 '프로젝트 생성 및 파이참에서 이쁘게 개발하기' 강좌 11:50 경에서 파이참 Configuration 설정 후 디버그 메뉴를 클릭해서 장고 서버를 띄우는 부분이 있는데요 제 환경에서 따라해보니 아래 에러가 뜹니다. 인코딩을 Settings > File Encodings > Project Encoding을 UTF-8로도 바꿔봤는데 동일한데 뭐가 잘못된걸까요? Fatal Python error: init_stdio_encoding: failed to get the Python codec name of the stdio encoding Python runtime state: core initialized LookupError: unknown encoding: x-windows-949 Current thread 0x000047e0 (most recent call first): <no Python frame>

  • python
  • django
HK 댓글 2 좋아요 4 조회수 3507

post 타이틀을 한글로 쓰면 경로이동이 안됩니다

미해결

따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)

안녕하세요 선생님 post 타이틀을 한글로 쓰면 경로이동이 안됩니다 영어로 쓰면 라우터대로 경로가 이동하는데 한글로 쓰면 이동이 안되네요... 왜이럴까요 한글타이틀 도 영어타이틀 처럼 잘 이동될순 없을까요

  • 클론코딩
  • Next.js
  • postgresql
  • docker
  • nodejs
  • react
  • typescript
레드 댓글 1 좋아요 0 조회수 395

프록시 설정했는데 localhost응답 에러 뜨는 분들

미해결

따라하며 배우는 노드, 리액트 시리즈 - 기본 강의

setupProxy.js 파일 내용을 아래처럼 바꾸시면 됩니다. 공식 문서 보니 설정 문법이 바뀌었나봐요. https://create-react-app.dev/docs/proxying-api-requests-in-development/#configuring-the-proxy-manually const { createProxyMiddleware } = require("http-proxy-middleware"); module.exports = function (app) { app.use( "/api", createProxyMiddleware({ target: "http://localhost:5000", changeOrigin: true, }) ); };

  • react
  • nodejs
팀오 댓글 1 좋아요 9 조회수 1275

회원가입 요청이 가지않는 이슈

미해결

Slack 클론 코딩[실시간 채팅 with React]

회원가입을 눌렀으나 회원가입이 안되고 요청이 가지 않는 것 같습니다. 에러메세지를 긁어서 확인 해보았으나 어디가 잘못된건지 모르겠고, 서버 부분의 콘솔을 확인해 보았으나 에러메세지가 나오지 않았습니다. 에러 메세지 이미지와 본문입니다. react_devtools_backend.js:4012 Error: Minified React error #31; visit https://reactjs.org/docs/error-decoder.html?invariant=31&args[]=object%20with%20keys%20%7Bsuccess%2C%20code%2C%20data%7D for the full message or use the non-minified dev environment for full errors and additional helpful warnings. at ka (react-dom.production.min.js:140:47) at react-dom.production.min.js:150:265 at Ml (react-dom.production.min.js:176:171) at Bi (react-dom.production.min.js:271:134) at Eu (react-dom.production.min.js:250:347) at wu (react-dom.production.min.js:250:278) at bu (react-dom.production.min.js:250:138) at pu (react-dom.production.min.js:243:163) at react-dom.production.min.js:123:115 at t.unstable_runWithPriority (scheduler.production.min.js:18:34 혹시나 ENV를 까먹었을까봐 다시 확인했지만 있었고, 아래는 서버쪽 터미널 이미지입니다. 감사합니다.

  • 웹팩
  • Socket.io
  • babel
  • typescript
  • react
  • 클론코딩
퀀텀에듀 댓글 1 좋아요 0 조회수 607

comment 삭제하는법

미해결

따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)

배포하기 전에 커뮤니티, 포스트, comment 삭제하고 다시작성하고 싶은데 어떻게해야될까요?

  • react
  • typescript
  • nodejs
  • docker
  • postgresql
  • 클론코딩
  • Next.js
이은영 댓글 2 좋아요 1 조회수 1039

Uncaught TypeError: Cannot read properties of undefined (reading 'map') 에러

미해결

따라하며 배우는 리액트 A-Z[19버전 반영]

import React, {useState} from "react"; import "./App.css"; export default function App () { const [todoData, setTodoData] = useState([ { id:"1", title:"공부하기", completed: false, }, { id:"2", title:"청소하기", completed: false, } ]); const [Value,setValue] = useState(""); // 첫번째 인수는 변수 두번재 인수는 state를 정하는 변수 const btnStyle ={ color: "#fff", border: "none", padding: "5px 9px", borderRadius: "50%", cursor: "pointer", float:"right", }; const getStyle = (completed) => { return{ padding:"10px", borderBottom:"1px #ccc dotted", textDecoration: completed ? 'line-through' : "none", }; }; const handleClick = (id) =>{ let newTodoData = todoData.filter(data => data.id !== id) console.log("newTodoData",newTodoData) setTodoData(newTodoData); }; const handleChange = (event) => { console.log("event",event.target.Value) setTodoData(event.target.Value); }; const handleSubmit = (event) =>{ console.log("event",event) event.preventDefault(); // reload를 막아줌 // 새로운 할일 데이터 let newTodo ={ id: Date.now(), title : Value, completed: false, }; // 원래 있던 할 일에 새로운 할일을 더해주기 setTodoData(prev => [...prev,newTodo]); setValue(""); }; const handleCompleteChange = (id) => { console.log("todoData",todoData) let newTodoData = todoData.map((data) =>{ if(data.id === id){ data.completed = !data.completed; } return data; }); setTodoData(newTodoData) }; return ( <div className="container"> <div className="todoBlock"> <div className="title"> <h1>할일 목록</h1> </div> {todoData.map((data) => ( <div style={getStyle(data.completed)} key={data.id}> <input type="checkbox" defaultChecked={false} onChange={() => handleCompleteChange(data.id)}/> {data.title} <button style={btnStyle} onClick={() => handleClick(data.id)}>x</button> </div> ))} <form style={{display:'flex'}} onSubmit={handleSubmit}> <input type="text" name="value" style={{flex:'10', pedding:'50'}} placeholder="해야 할 일을 입력하세요." value={Value} onChange={handleChange}/> <input type="submit" value="입력" className="btn" style={{flex:'1'}} /> </form> </div> </div> ); } 아래 코드에서 form에 어떠한 글자를 입력하면 Console 창에 왜 Uncaught TypeError: Cannot read properties of undefined (reading 'map') 에러가 발생하는지 도저히 모르겠습니다. 혹시 아시는분 답변 부탁드립니다. 감사합니다.

  • Next.js
  • redux
  • tdd
  • react
  • typescript
박정훈 댓글 1 좋아요 2 조회수 5447

python matplotlib x축이 생략되어 나타납니다.

미해결

import pandas as pd import matplotlib.pyplot as plt # 한글폰트 사용시 그래프에서 마이너스 폰트 깨지는 문제에 대한 대처 plt.rcParams['axes.unicode_minus'] = False plt.rc('font', family='Malgun Gothic') styles = ['-', '--', '-.', ':'] pd.set_option('mode.chained_assignment', None) # df = pd.read _csv('2021-univ-HR.txt',sep='\t',encoding='euc-kr') df1=df.loc[:,["지역","학교유형","설립","대학규모","정규-전담-계","비정규-전담-계","정규-겸직-계","비정규-겸직-계"]] df2=pd.melt(df1, id_vars =['지역'], value_vars=['정규-전담-계','비정규-전담-계']) df3=df2.groupby(['지역','variable']).mean().reset_index() df3.set_index("지역", inplace=True) print(df3) plt.subplot(2,2,1) plt.xticks() df3.groupby("variable")["value"].plot(legend=True, xlabel="지역", ylabel="평균 인원",ax=plt.gca(), rot=45) 위와 같은 코드의 결과가------------------------------- 이렇게 나오는데요 '지역'이 모두 x축에 나타나지 않고 자동적으로 생략되어 나옵니다.. 강원부터 충북까지 모든 지역이 그래프에서 표시되려면 어떻게 해야 할까요??

  • 파이썬
  • python
류예진 댓글 0 좋아요 1 조회수 739

협업(리뷰 기반)필터링#1 질문

해결됨

파이썬 무료 강의 (활용편7) - 머신러닝

아나콘다 프롬프트에서 설치까지 하고 잘되었는지 pip list확인해 봐도 잘 있는데 왜 주피터에서는 임포트가 안될까요? 다시 실행해봐도 똑같이 에러 뜨네요

  • scikit-surprise
  • python
  • 아나콘다
  • anaconda
  • 패키지설치
  • 머신러닝 배워볼래요?
  • scikit-learn
roider2316 댓글 1 좋아요 0 조회수 924

스크롤탑 동기처리 이슈.

미해결

Slack 클론 코딩[실시간 채팅 with React]

안녕하세요 제로초님. 인피니티 스크롤 로딩 후 추가 데이터를 로딩하고 스크롤 위치를 유지하는 로직에 문제가 있어서 문의드립니다. 아래 코드에서는 setSize의 then문 안에 setTimeout으로 한 번 더 감싸주었는데 setTimeout이 없는경우 데이터가 불러와지기전에(스크롤의 높이가 늘어나지 않은 상태에서) setTimeout내부의 로직이 실행됩니다. 그로인해 스크롤의 높이는 기존높이 - 기존높이 로 scrollTop(0) 과 같은 상태가 되어버리는데요. setTimeout으로 0초의 딜레이를 주면 또 순서대로 동작을 합니다... 이런경우에 좋은 해결책이 있을까요? const onScroll = useCallback((values: positionValues) => { if (values.scrollTop === 0 && !isReachingEnd) { setSize((prevSize) => prevSize + 1).then(() => { setTimeout(() => { if (typeof scrollbarRef !== "function" && scrollbarRef?.current) { scrollbarRef.current.scrollTop(scrollbarRef.current.getScrollHeight() - values.scrollHeight); } }, 0); }); } }, []);

  • babel
  • Socket.io
  • 웹팩
  • react
  • typescript
  • 클론코딩
김영욱 댓글 2 좋아요 0 조회수 463

궁금한 점이 있어요

해결됨

프론트엔드 개발자를 위한, 실전 웹 성능 최적화(feat. React) - Part. 2

캐시 최적화 강의를 보고 난 뒤에 궁금증이 생겼습니다 app.use(express.static(path.join(__dirname, "../build"), header)); 를 통해 빌드된 것들에 대해 해더를 적용하는 것으로 이해했습니다. 근데 이렇게 빌드 된 것이 아니라 FE, BE 따로 나뉘어서 배포되어 서로 다른 도메인인 경우 어떻게 해야 하나요? BE는 static 자료가 없이 api만 보내는 기능을 하고 FE는 vercel이나 netlify 또는 다른 EC2로 배포되어 있는 경우를 말씀드립니다. app.use(header); 이렇게 하면 될까 했지만 이건 에러를 뱉어냅니다

  • devtools
  • react
Big lol 댓글 1 좋아요 1 조회수 375

오픈소스참여-나만의 패키지 만들기(1)

미해결

모두를 위한 파이썬 : 필수 문법 배우기 Feat. 오픈소스 패키지 배포 (Inflearn Original)

안녕하세요 오픈소스 참여 - 나만의 패키지 만들기(1) 질문드립니다 수업들으면서 제가 수업을 따라서 코딩한 결과가 오류는 없는데, result 파일에서 이미지들이 하나씩 넘어가는 것이 아니라, 누적이 되어서 겹쳐서 나옵니다. 그래서 올려주신 수업자료를 열어서 돌렸는데도 수업처럼 이미지들이 하나씩 넘어가지 않고 이미지들이 누적이 되서 겹쳐서 넘어갑니다.

  • python
오미 댓글 2 좋아요 1 조회수 590

axios.get 2번 불러오는데

미해결

프로젝트로 배우는 React.js

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. const getPost = () => { axios.get('http://localhost:3001/posts').then((res) => { console.log(res); }) } axios.get 하면 개발자도구에서 네트워크-> posts 2번 불러오는데 이유를 알고싶습니다.

  • es6
  • react
  • redux
cki6090 댓글 1 좋아요 1 조회수 2916

인기 태그

인프런 TOP Writers

주간 인기글