묻고 답해요
156만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결MERN STACK 커뮤니티 : 시작부터 배포까지 알려주는 React
작동은 잘되는데 오류가 뜹니다
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 검색해보니 undefined가 우려되어 그렇다는데이렇게 바꾸니 괜찮아졌습니다.강의에안나와있는데 괜찮을까요??
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
destructuring 사용하지 않았을 때는 어떻게 코드를 작성해야 하나요?
destructuring을 사용하지 않고 const로 time과 setTime을 정의해서 해봤는데요, 이때는 브라우저에서 클릭을 해도 0초에서 1초로 바뀌지 않습니다. 어떤 부분이 문제인가요?React.useState(0) 뒤에 인덱스 값을 잘못 붙인 건가요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
wsl2를 사용하여 windows에 ubunto20.04설치
아직 프리캠프부분 수강중인데혹시 완전히 운영체제를 지우지 않고 위와 같은 방식을 사용하면 이후 진도를 나가는데 있어 문제가 생기나요?
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
return 후 소괄호가 필수인가요
소괄호를 붙여 해결은 했습니다만, return 뒤에 소괄호를 붙이지 않았을 때 unreachable-code라며 코드가 투명하게 보이고 react app 사이트에도 반영되지 않았는데요 소괄호가 필수인지 궁금합니다참고로 return직후 세미콜론은 저장했더니 자동으로 붙었습니다.
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
콘솔로그가 두번씩 찍힙니다
버튼을 한 번씩 누를 때마다 콘솔창에 콘솔로그가 2번씩 찍히는데 왜 이런 건가요?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
npm i antd styled-components @ant-design/icons 를 하면 오류가 뜹니다
npm i antd styled-components @ant-design/icons터미널에 이 코드를 치면 아래와 같은 오류 메세지가 뜹니다.도와주세요ㅠㅠnpm ERR! Cannot read properties of null (reading 'edgesOut')npm ERR! A complete log of this run can be found in:npm ERR! /Users/hyeonyeongjeong/.npm/_logs/2023-06-23T07_52_15_483Z-debug-0.log
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
npm run dev를 하고 localhost로 들어가면 연결을 거부했다고 뜹니다
npm run dev를 하면 아래와 같은 오류 메세지가 뜹니다그리고 로컬호스트 들어가보면 사이트에 연결할 수 없음이 뜹니다.도와주세요 ㅠㅠ > react-nodebird-front@1.0.0 dev> nextBrowserslist: caniuse-lite is outdated. Please run:npx browserslist@latest --update-dbready - started server on http://localhost:3000node:internal/crypto/hash:71 this[kHandle] = new _Hash(algorithm, xofLen); ^Error: error:0308010C:digital envelope routines::unsupported at new Hash (node:internal/crypto/hash:71:19) at Object.createHash (node:crypto:133:10) at module.exports (/Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/webpack/lib/util/createHash.js:135:53) at NormalModule._initBuildHash (/Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/webpack/lib/NormalModule.js:417:16) at handleParseError (/Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/webpack/lib/NormalModule.js:471:10) at /Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/webpack/lib/NormalModule.js:503:5 at /Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/webpack/lib/NormalModule.js:358:12 at /Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/loader-runner/lib/LoaderRunner.js:373:3 at iterateNormalLoaders (/Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/loader-runner/lib/LoaderRunner.js:214:10) at Array.<anonymous> (/Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/loader-runner/lib/LoaderRunner.js:205:4) { opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ], library: 'digital envelope routines', reason: 'unsupported', code: 'ERR_OSSL_EVP_UNSUPPORTED'}Node.js v18.16.1
-
해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
Entity nullable
강사님 강의 다 수강 이후 코드를 하나씩 뜯어보며 이해하던 중 엔티티에서 컬럼의 속성 값에 대한 의문ㅇ이 생겨 질문 드립니다. 강사님의 ChannelChats.entity에서 이와 같이 userId와 channelId가 nullable true로 설정이 되어있는데 널값을 허용하는 이유가 궁금하여 질문 드립니다. 그리고 또 다른 질문이 있는데 아래에서 m:1 관계 설정 후 joinColumn만으로도 테이블에 컬럼이 추가되는 걸로 알고 있는데 위에서 Column데코레이터로 다시 한 번 만들어준 것은 후에 select과 같은 요청시 joinColumn만으로 생성된 컬럼 값은 안넘어와서 column 데코레이터를 다시 한 번 사용해준 것이라고 이해해도 괜찮을까요??
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
이미지경로를 시퀄라이즈 모델에저장시 post모델에 배열로 저장하지 않고 따로 테이블을 만들어 관계형으로 저장하는이유
1.이미지 경로는 이미지가 여러개일 경우 배열상태로 존재하는데 왜 post 모델에 배열로 저장하지 않고 따로 테이블을 만들어 관계를 짖는 이유를 알수있을까요2.테이블에 배열데이터를 저장하려면 json으로 저장이 될꺼같은데 이 데이터를 text타입으로 바꿔서 저장해야하나요?관계를 지어 테이블을 두개 만드는 방식과 배열데이터를 같은 테이블에 넣는 방식중 머가 더 좋은가요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
다대다 관계에서 productTags의 타입에 관한 질문입니다
안녕하세요. 항상 알기쉽게 설명해주셔서 많은 도움이되고 있습니다. (myERD프로젝트하는데 거의 일주일 걸린것 같습니다 ㅎㅎ)섹션29 10-8 다대다 api설계에서 productTags에 대한 질문드립니다.아래와 같이 tags을 productTags에 넣어서 리턴을 해주는 상황입니다.그런데 여기서 ...prevTags와 ...newTags.identifiers의 타입이 서로 다른것 같아서 다음과같이 콘솔로 찍어 보았습니다. 배열요소의 3번째까지가 ...prevTags에 담긴 값인데 저렇게 리턴하면 타입관련에러나 DB에 저장이나 서로 연결이 안될줄 알았는데 강의와 같이 잘 작동하였습니다.그래서 아래와 같이 productTags의 타입인 ProductTag[]도 확인해보았는데도 잘 이해가 안갑니다제생각에는 prevTags에서 id만 뽑아낸 객체배열을 새로 정의한 다음에 스프레드시켜서 넣어주어야 할것같은데, 해보니 둘 다 결과는 같네요... 제가 어떤 걸 놓치고 있는 걸까요?사족 : 그런데 이 문제를 생각하는 도중에 힌트를 얻어서 update에서 에러나는 숙제를 해결했습니다^^
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
http 통신 과제 연습
http 과제 연습 graphql-API 문제에 https://practice.codebootcamp.co.kr/graphql 이 안들어가지는데 어디서 해야하나요?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
createAsyncThunk로 일부러 지연시켜서 pending상태 만드는법 질문
const wait = (timeToDelay) => new Promise((resolve) => setTimeout(resolve, timeToDelay)); export const loginAction = createAsyncThunk(LOG_IN, async (data) => { await wait(1000); return data; }); export const logoutAction = createAsyncThunk(LOG_OUT, async () => { return; });const userSlice = createSlice({ name: "user", initialState, // exraReducers 그냥 reducer는 user/login 이런식으로 액션 이름을 적어야 하지만 extraReducers를 사용하면 login으로 줄일 수 있다 extraReducers: (builder) => builder .addCase([HYDRATE], (state, action) => ({ ...state, ...action.payload.user, })) .addCase(loginAction.pending, (state) => { state.isLoggingIn = true; state.isLoggedIn = false; }) .addCase(loginAction.fulfilled, (state, action) => { state.isLoggingIn = false; state.isLoggedIn = true; state.user = dummyUser; state.loginData = action.data; }) .addCase(loginAction.rejected, (state) => { state.isLoggingIn = true; }) .addCase(logoutAction.pending, (state) => { state.isLoggingOut = true; state.isLoggedIn = true; }) .addCase(logoutAction.fulfilled, (state) => { state.isLoggingOut = false; state.isLoggedIn = false; state.user = null; }) .addCase(logoutAction.rejected, (state) => { state.isLoggingOut = false; }) .addCase(signUp.fulfilled, (state, action) => { state.signUpData = action.data; }) .addDefaultCase((state) => state), });제가 redux toolkit으로 제로초님이 만드시는 코드를 만들고 있는데 createAsyncThunk로 일부러 지연 시켜서 pending상태로 만들려고 했는데 이렇게 코드를 짜니까 pending이 제대로 동작을 안하고 로딩 아이콘이 제대로 보이지 않습니다 제가 추가적으로 실험을 해보았는데 state.isLoggingIn을 pending과 fulfilled두개 모두 state.isLoggingIn = true;로하고 동작을 시켜도 로그인 아이콘이 로딩이 안됩니다 하지만 로그아웃은 모두 true로 하니까 로딩이 보입니다...그래서 액션을 reducer를 작성할때 뭔가를 실수한것 같습니다 무었인지 알 수 있을까요?그리고 saga의 delay처럼 createAsyncThunk의 지연시켜서 pending상태가 나오는 방법을 알고싶습니다
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
typeORM Many to one 관계설정
안녕하세요 typeORM 관계설정 중에 궁금한게 생겨서 질문드립니다.공식문서에 나온 코드를 보면 ManyToOne 데코레이터 안에 두 가지 인자가 있는데 앞에 있는건 강의에서도 작성하지만 두번 째인자는 생략이 가능한 것 같네요.. 혹시 두번 째 인자는 OneToMany를 작성할 때도 생략이 가능한가요?그리고 혹시 OneToMany로 받아오는 배열을 배열말고 count해서 숫자로 칼럼에 넣을 수 있는 방법이 있을까요..? 힌트라도 알려주시면 감사하겠습니다!!@Entity() export class Photo { @PrimaryGeneratedColumn() id: number @Column() url: string @ManyToOne(() => User, (user) => user.photos) user: User }
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
swr 캐싱
다른분들 질문 보다보니 부모컴포넌트와 자식컴포넌트가 동일한 key값으로 서버에 요청을 보내면 한번만 요청을 보내고 부모컴포넌트에서 캐싱된 값을 자식컴포넌트가 사용한다고 봤는데 공식 홈페이지 예제 보니 특정 페이지 내부에서 화면에 렌더링되는 모든 컴포넌트에서는 동일한 key값으로 서버에 요청하는경우에 하나만 요청되고 모두 캐싱되어서 같은화면?내에서 렌더링되는 컴포넌트들은 값을 공유하는것같은데 이도 맞을까요? nextjs _app Custom App component 에서 요청하는 swr key는 전역적으로 캐싱이 안되나요?_app에서 서버로 사용자 정보를 요청하도록 코드를 작성해놨고 각 페이지 마다도 동일한 key값으로 사용자 정보를 서버에 요청하도록 작성해두었습니다. 페이지를 이동하더라도 app에서 사용한 key값과 각 페이지에서 서버로 요청하는 key값이 동일하니 캐싱되어 서버로 사용자 정보를 재요청하지 않고 캐싱된 값을 사용해야된다고 생각되는데 계속해서 서버로 사용자 정보를 재요청을 보냅니다. 왜 그런것일까요..?
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
서버사이드렌더링 전 백엔드 서버와 프론트 로그인 차이
서버사이드렌더링 전 새로고침하면 로그인 풀리는건 알겠는데, 재로그인시에 isAuthenticated 가 발동되면서 서버는 계속 로그인중입니다. 이건 서버사이드렌더링 거치면 해결될까요? 아니면 코드가 잘못돼서 그런걸까요... 백엔드서버를 다시 수동으로 종료후 재실행하면 백서버 로그인은 풀립니다
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
(정보 공유)redux toolkit으로 미들웨어 장착하기
import { configureStore } from "@reduxjs/toolkit"; import { createWrapper } from "next-redux-wrapper"; import reducer from "../reducers"; function getServerState() { return typeof document !== "undefined" ? JSON.parse(document.querySelector("#__NEXT_DATA__").textContent)?.props .pageProps.initialState : undefined; } const loggerMiddleware = ({ dispatch, getState }) => (next) => (action) => { console.log(action); return next(action); }; const serverState = getServerState(); console.log("serverState", serverState); const makeStore = () => configureStore({ reducer, devTools: true, middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(loggerMiddleware), preloadedState: serverState, // SSR }); export default createWrapper(makeStore);redux toolkit으로 미들웨어를 장착하고 싶으시면 getDefaultMiddleware에 concat으로 장착하시면 됩니다 configureStore코든는 제로초님 깃허브에 있습니다
-
미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
강의자료 ppt는 어디서 받을 수 있나요?
안녕하세요 11강에서 강의자료 ppt 파일을 올려주신다고 했는데 어디서 다운로드 받을수 있나요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
Ubuntu 듀얼부팅
안녕하세요 windows 사용자인데 램 24기가라서 듀얼부팅 메뉴얼대로 우분투 설치했습니다 (재부팅하는데 os 윈도우로 할거냐 우분투로 할거냐 선택창이 안떠서 엄청 헤매다가 유투브 찾아보고 결국 해결했네요 ㅠㅠ) 수업자료에 있는 20.04.4 LTS 버전은 안보여서 비슷한 버전으로 20.04.6 LTS로 설치했는데 문제 없겠죠? 그리고 파티션 할당할 때 c드라이브 용량을 최대한 줄여본다 해서 40기가 정도 우분투 환경에 할당해줬는데 충분할까요?빠른 답변 주시면 감사하겠습니다!!
-
미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
9장 추가 과제 관련 질문
안녕하세요. 9장강의를 듣고 추가 과제를 시도해보던 중 궁금증이 생겨 질문드립니다.스스로 해보기 -> 팔로잉 끊기에서 destory와 라우터를 사용하라고 안내해주셨는데 user자체를 삭제하는 것이 아닌 중간테이블(follow)에서 해당 로우만 삭제하는 방법이 따로 있나요? if (user) { const a = await user.destroy({ where: { Followings: { followerId: req.params.id } }, });위와 같이 방법을 여러가지로 시도해보았지만 계속해서 유저 삭제(탈퇴)가 되는 상황이라 도움주시면 감사하겠습니다..!
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
로그 이미지 주소 중 절대 경로 원리에 관한 질문
본 강의 중 로그가 나오지 않는 이슈에 관하여경로 설정에 문제가 있다고 하셨고, grab_market_web/src/App.js의 내용 중 로그 src의 경로를"./imgages/icons/log.png"에서 -> "/imgages/icons/log.png"으로 변경하라고 하였습니다. 작동은 잘 되는데, 작동 원리가 궁금합니다./ 절대값 root경로의 시작은 어디로 설정되어 있나요?이전에는 메인 화면에서는 ./ 상대 경로 중, 현재 경로로 설정되어 있었는데 잘 작동했던 이유도 궁금합니다.App.js파일의 내용이니까 App.js가 존재하는 grab_market_web/src 디렉토리가 현재 경로라고 이해되는데,그보다 상위 디렉토리에 존재하는 grab_market_web/public이 ./ 현재 경로로 인식되어grab_market_web/public/images가 호출 되는 것도 이해가 잘 되지 않으며/ 절대 경로로 설정시에도grab_market_web/public/images가 호출되는 것이 잘 이해가 되지 않습니다.