inflearn logo
강의

강의
N
챌린지

챌린지
멘토링

멘토링
N
클립

클립
로드맵

로드맵
지식공유

묻고 답해요

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

eslint 적용안됨

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

선생님이 설명하신 것처럼 따라서 했는데 저장할 시 저절로 2칸 tab되는 기능이 안되는데 어디서 잘못된 지 알려주시면 감사하겠습니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
redbull1777 댓글 1 좋아요 0 조회수 748

로그인에 성공해도 name을 불러오지 못 하는거 같습니다

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

playgroud 에서 회원을 생성 이후 login 페이지에서 로그인을 성공적으로 하였으나 login success 페이지에서 fetchuserloggedin 이 성공적으로 이루어 지지 않는거 같습니다. 회원가입을 여러번 해서 다른 계정으로 시도해도 name 부분이 표시가 되지 않네요. 혹시 뭐가 문제일까요? import { useState } from "react"; import { gql, useMutation } from "@apollo/client"; import { IMutation, IMutationLoginUserArgs, } from "../../../src/commons/types/generated/types"; import { accessTokenState } from "../../../src/commons/stores"; import { useRecoilState } from "recoil"; import { useRouter } from "next/router"; const LOGIN_USER = gql` mutation loginUser($email: String!, $password: String!) { loginUser(email: $email, password: $password) { accessToken } } `; export default function LoginPage() { const router = useRouter(); const [email, setEmail] = useState(""); const [password, setPassword] = useState(""); const [loginUser] = useMutation< Pick<IMutation, "loginUser">, IMutationLoginUserArgs >(LOGIN_USER); const [, setAccessToken] = useRecoilState(accessTokenState); const onChangneEmail = (event) => { setEmail(event.currentTarget.value); }; const onChangnePassword = (event) => { setPassword(event.currentTarget.value); }; const onClickLogin = async () => { try { //1.로그인 뮤테이션 날려서 accessToken 받아오기 const result = await loginUser({ variables: { email, password, }, }); const accessToken = result.data?.loginUser.accessToken; console.log(accessToken); //받아온 accessToken 을 글로벌 스테이트에 저장해야지 모든 애들이 쓸수 있음 if (accessToken === undefined) { alert("로그인에 실패했습니다: 다시 시도해주세요"); return; } setAccessToken(accessToken); // 3. 로그인 성공 페지이로 이동하기 void router.push("/section23/23-01-login-success"); } catch (error) { if (error instanceof Error) alert(error.message); } }; return ( <> 이메일:{" "} <input onClick={onChangneEmail} type="text" placeholder="이메일 입력" /> 비밀번호:{" "} <input onClick={onChangnePassword} type="password" placeholder="비밀번호 입력" /> <button onClick={onClickLogin}>로그인</button> </> ); } import { useQuery, gql } from "@apollo/client"; import type { IQuery } from "../../../src/commons/types/generated/types"; const FETCH_USER_LOGGED_IN = gql` query { fetchUserLoggedIn { email name } } `; export default function LoginPage() { const { data } = useQuery<Pick<IQuery, "fetchUserLoggedIn">>(FETCH_USER_LOGGED_IN); return <>{data?.fetchUserLoggedIn.name}님 환영합니다!</>; }

  • react
  • node.js
  • seo
  • graphql
  • next.js
hwj9975 댓글 4 좋아요 0 조회수 490

섹션28 오류 질문

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

검색 해보니까 input태그에 자식을 넣어서 발생하는 에러라고 하는데 코드에는 input태그에 props를 넣은것 빼곤 그럴만한 에러사항이 없습니다. 무엇이 문제인가요..?ㅠ index.js import BoardWrite from "../../../src/components/units/board/write/BoardWrite.container"; export default function GraphqlMutationPage() { // 한 줄일 땐 괄호() 필요 없음 return ( <div> <div>########## 여기는 페이지입니다.####### </div> <BoardWrite />;<div>########## 여기는 페이지입니다.####### </div> </div> ); } BroadWrite.container.js: import { useMutation } from "@apollo/client"; import { useState } from "react"; import BoardWriteUI from "./BoardWrite.presenter"; import { 나의그래프큐엘셋팅 } from "./BoardWrite.queries"; export default function BoardWrite(props) { const [writer, setWriter] = useState(); const [title, setTitle] = useState(); const [contents, setContents] = useState(); const [나의함수] = useMutation(나의그래프큐엘셋팅); const onClickSubmit = async () => { const result = await 나의함수({ variables: { // variables 이게 $ 역할을 함 writer: writer, title: title, contents: contents, }, }); console.log(result); }; const onChangeWriter = (event) => { setWriter(event.target.value); }; const onChangeTitle = (event) => { setTitle(event.target.value); }; const onChangeContents = (event) => { setContents(event.target.value); }; return ( <div> <div>$$$$$$$$$여기는 컨테이너입니다.$$$$$$$$</div> <BoardWriteUI aaa={onClickSubmit} bbb={onChangeWriter} ccc={onChangeTitle} ddd={onChangeContents} /> <div>$$$$$$$$$여기는 컨테이너입니다.$$$$$$$$</div> </div> ); } BroadWrite.presenter.js import { RedInput, BlueButton } from "./BoardWrite.styles"; export default function BoardWriteUI(props) { return ( <div> <div>@@@@@@@@@@@여기는 프리젠터입니다.@@@@@@@@@@</div> <div> 작성자: <RedInput type="text" onChange={props.bbb} /> 제목: <input type="text" onChange={props.ccc} /> 내용: <input type="text" onChange={props.ddd} /> <BlueButton onClick={props.aaa}>GRAPHQL-API 요청하기</BlueButton>; </div> <div>@@@@@@@@@@@여기는 프리젠터입니다.@@@@@@@@@@</div> </div> ); } BroadWrite.styles.js import styled from "@emotion/styled"; export const RedInput = styled.input` border-color: red; `; export const BlueButton = styled.input` background-color: blue; `;

  • react
  • node.js
  • seo
  • graphql
  • next.js
전현욱 댓글 1 좋아요 0 조회수 329

AOP가 적용되지않습니다.

미해결

스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] "package hello.hellospring.aop; import org.aspectj.lang.ProceedingJoinPoint; import org.aspectj.lang.annotation.Around; import org.aspectj.lang.annotation.Aspect; import org.springframework.stereotype.Component; @Component @Aspect public class TimeTraceAop { @Around("execution(* hello.helloSpring..*(..))") public Object execute(ProceedingJoinPoint joinPoint) throws Throwable { long start = System. currentTimeMillis (); System. out .println("START : " + joinPoint.toString()); try { return joinPoint.proceed(); } finally { long finish = System. currentTimeMillis (); long timeMs = finish - start; System. out .println("END : " + joinPoint.toString()+ " " + timeMs + "ms"); } } }" TimeTraceAop 클래스를 작성한 이후에 실행을 시켜보아도 수업처럼 START END 부분이실행되지 않습니다. 단순 스프링 실행화면만 보이는데 어디가 문제일까요?

  • java
  • spring
  • mvc
  • spring-boot
digeuthi 댓글 3 좋아요 0 조회수 2231

@Deprecated

해결됨

실전! Querydsl

안녕하세요 queryDsl의 기본 문법에 대해서 듣고 있는데요. 현재 기준, fetchResults(), fetchCount() 가 deprecated 되었네요.(자바11, springboot 2.7 버전에 맞는 queryDsl) 강의 끝부분에서 말씀하신, 복잡한 페이징 & 쿼리 부분에서는 coun와 select 쿼리가 다르니까 따로 작성해서 해야된다는 말씀 것과 연관되어서 그런 것 맞을까요? 그러면 @Deprecated 된 현재는 fetchResults(), fetchCount() 는 사용을 지양하고 별개의 쿼리로 각각의 값들을 얻어 조합해서 response 해주는 것이 맞죠?

  • java
  • jpa
highjune 댓글 1 좋아요 3 조회수 1573

이미지 업로드 url 오류

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

어떤 부분때문에 이런 오류가 나는 걸까요? 이미지 등록 버튼을 눌러서 파일 선택하면 이 오류 메세지가 뜹니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
suny_fun 댓글 2 좋아요 0 조회수 506

dig 질문입니다.

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

가비아 에서 도메인 결제 후 터미널 dig 부분에서 막혀서 질문 드립니다. 가비아 AWS 여기까지 잘 따라 왔는데 터미널에서 오류가 뜨네요 강의에서 2-3일 걸릴수도 있다했는데 현재 6시간 이상 지나도 안돼서 궁금함에 질문 남겨요.. 기다리면 될까요? 아님 잘못한 부분이 있을까요?

  • react
  • node.js
  • seo
  • graphql
  • next.js
임프런 댓글 1 좋아요 0 조회수 229

타입을 적을때 쓰는 JSX.Element

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

deprecated 되는 걸로 알고있고 안써줘도 되는 것 같은데 리액트랑 타입스크립트 버전업에 따른 결과인가요?

  • react
  • node.js
  • seo
  • graphql
  • next.js
Jun 댓글 1 좋아요 0 조회수 536

대댓글 쿼리문

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

강사님 안녕하세요 혹시 쿼리문좀 백엔드에서 잘못되는거 같은데 한번 봐주시면 안될까요... 아무리 _id로 할려고해도 같은 유저가 질문하게 되면 컨텐츠로도 확인해야해서요 ㅠㅠ 강사님 댓글이라도 대댓글 이거에 관한 힌트라도 얻을수있게 남겨주시면 감사하겠습니다.. 아무리해도 쿼리문에서 필요한게 없으니 어떻게 해야할지를 모르겠습니다...

  • react
  • node.js
  • seo
  • graphql
  • next.js
donig1225 댓글 2 좋아요 0 조회수 530

Graphql 강의중 질문

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

보시는 것과 같이 첫번째 사진처럼 백틱을 넣으면 두번째 사진과 같은 자동완성기능이 제기능을 못합니다. 이유와 해결방법이 있나요?

  • react
  • node.js
  • seo
  • graphql
  • next.js
전현욱 댓글 1 좋아요 0 조회수 384

재설치를 해도 app.tsx 빨간줄

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

재설치를 해도 에러 메시지가 사라지지않네요 ㅠㅠ 저랑 같은 문제인가 싶어 https://www.inflearn.com/questions/872799/%ED%83%80%EC%9E%85%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8%EC%98%A4%EB%A5%98#259807 해당글의 방법도 시도했지만 달라지지가 않네요 ㅠ

  • react
  • node.js
  • seo
  • graphql
  • next.js
김윤원 댓글 1 좋아요 0 조회수 558

Cannot snapshot 오류가 뜹니다.

해결됨

스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요. 코드를 모두 정상적으로 작성하였는데 Cannot snapshot C:\Users\이름\OneDrive\바탕 화면\App\Programming\study\inflearn\Spring\forBeginner\hello-spring\build\test-results\test\binary\output.bin: not a regular file 이런 오류가 뜹니다.

  • java
  • spring
  • mvc
  • spring-boot
재밌는코딩 댓글 1 좋아요 0 조회수 1629

d-day 오류

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

<!DOCTYPE html> <html lang="ko"> <head> <script src="./js/calculator.js"></script> <link rel="stylesheet" href="./calculator.css"> <title>D-Day</title> </head> <body> <h1>D-day</h1> <div id="d__day__container"> <div class="d__day__child__container"> <span id="days">0</span> <span>일</span> </div> <div class ="d__day__child__container"> <span id="hours">0</span> <span>시간</span> </div> <div class ="d__day__child__container"> <span id="min">0</span> <span>분</span> </div> <div class ="d__day__child__container"> <span id="sec">0</span> <span>초</span> </div> </div> <div id="target-selector"> <input id="year" type="text" placeholder="년도" class="day-caleander" size=5 maxlength="4"> <input id="month" type="text" placeholder="월" class="day-caleander" size=5 maxlength="2"> <input id="day" type="text" placeholder="일" class="day-caleander" size=5 maxlength="2"> </div> <div id="target__selector"> <button onclick="counterMake()" id="start__btn">카운트다운</button> </div> </body> </html> const dateFormMaker = () => { const inputYear = document.getElementById("year").value; const inputMonth = document.getElementById("month").value; const inputDay = document.getElementById("day").value; const dateFormat = `${inputYear} - ${inputMonth} - ${inputDay}`; return dateFormat; } const counterMake = () => { const targetDateInput = dateFormMaker(); const nowDate = new Date() const targetDate = new Date(targetDateInput); const remaining = (targetDate-nowDate) / 1000; if(remaining <=0) { console.log("타이머가 종료되었습니다.") }else if (isNaN(remaining)) { "유효한 시간 형식이 아닙니다" } const reaminingDate = Math.floor(remaining /3600 /24); const remainingHours = Math.floor (remaining/3600) & 24; const remainingMin = Math.floor(remaining/60) % 60; const remainingSec = Math.floor(remaining) & 60; const dDayCounter = `남은 시간 : ${reaminingDate}일 ${remainingHours}시 ${remainingMin}분 ${remainingSec}초`; console.log(dDayCounter) return dDayCounter; } console 하나하나 찍어가며 파악한 결과 targetDate에서 NaN이 뜨는데, 아무리 봐도 이유를 모르겠습니다 ㅠㅠㅠ input 박스에 적은 값들도 잘 읽어오는데 갑자기 저기서 에러가 뜨니까 답답하네요 . 피드백 부탁드립니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
주철민 댓글 1 좋아요 0 조회수 400

(Section 26. Graphql Mutation) ApolloError:Failed to fetch

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

useMutation section 에서 해당 소스를 작성하고 Graphql API 요청하기 버튼을 누르면 아래와 같이 오류 메세지가 나옵니다. 설치 오류인가 싶어 package.json 을 봐도 특별히 어떤 문제인지 확인되지 않습니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
댓글 1 좋아요 0 조회수 498

apoll-cilent 관련된 질문

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

apoll-cilent 관련된 질문입니다. 질문1. 지금 강의에서는 api url이 한개만 있을 경우인데, 경로가 다 다른 경우는 어떻게 연결을 하나요?? client를 여러개 만들어서 porivder에 담아줘야하나요?? 질문2. provider는 꼭 app.jsx를 감싸야하나요?? 아니면 내부 컴토넌트안에서 원하는 컴포넌트를 provider로 감싸도 동일하게 사용이 가능한가요??

  • react
  • node.js
  • seo
  • graphql
  • next.js
tamo 댓글 2 좋아요 0 조회수 381

댓글 작성기능중 별점 rating 부분 질문

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

31-2 포트폴리오 과제를 진행하다가 막혀서 질문드려요!! 다른기능들은 이미 해봤던내용의 복습인것같아 잘진행을 하고있던 와중에 별점 기능을 구현하는데 어려움이 좀 있네요. 처음 만들어보는 기능이라 혼자 만들어보다가 잘진행이 되지않아 레퍼런스 코드를 한번보고싶은데요 해당 과제 세션에 링크된 레퍼런스코드에는 그기능이 따로 없는것같아서 여쭈어봅니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
김윤원 댓글 1 좋아요 0 조회수 387

영속성 컨텍스트에 대해 질문이 있습니다.

미해결

자바 ORM 표준 JPA 프로그래밍 - 기본편

https://www.inflearn.com/questions/789381/%EC%97%94%ED%8B%B0%ED%8B%B0-%EB%A7%A4%EB%8B%88%EC%A0%80-%EB%8F%99%EC%8B%9C%EC%84%B1 위에 질문과 답변을 봤을때는 엔티티매니저가 달라도 트랜잭션이 같으면 같은 영속성컨텍스트를 사용한다고 되어있습니다. 하지만 이 부분이 실제로 어떻게 이뤄질 수 있는것인지 이해되지 않습니다. 코드로 어떻게 되어져 있는지 찾아볼 수 있을까요? 제가 찾아본 내용으로는 SessionImpl이라는 엔티티매니저 구현체에 아래 처럼 엔티티매니저를 넣어서 영속성컨텍스트를 생성하는 코드를 볼 수 있었습니다. 그럼 영속성 컨텍스트는 따로 만들어지는게 아닌가? 라는 생각도 하게되었습니다. protected StatefulPersistenceContext createPersistenceContext() { return new StatefulPersistenceContext( this ); } 트랜잭션에 따라 영속성 컨텍스트가 공유되고 스레드마다 영속성 컨텍스트가 어떻게 나눠질 수 있는지 궁금합니다. 그리고 영속성컨텍스트는 프록시라도 Bean으로 등록되는데 실제 동작을 하는건 원본객체일테고 그럼 그 객체이 있는 영속성컨텍스트를 공유하게 되는것은 아닌가? 의문이 들었습니다. 질문을 정리하겠습니다. 트랜잭션에 따라 영속성 컨텍스트가 어떻게 공유될 수 있나요?(확인할 수 있는코드나 기술이 있다면 말씀해주시면 감사하겠습니다.) Bean으로 등록된 엔티티매니저가 다른 상태를 유지할 수 있는 방법이 무엇인가요? 프록시라해도 원본객체를 통해 동작하는게 아닌가요? 영속성컨텍스트는 프록시라도 Bean으로 등록되는데 실제 동작을 하는건 원본객체일테고 그럼 그 객체이 있는 영속성컨텍스트를 공유하게 되는것은 아닌가요? 바보같은 질문일 수 있지만 답변해주시면 너무 감사하겠습니다.

  • java
  • jpa
YOGURT 댓글 2 좋아요 0 조회수 878

엔티티매니저의 대해 질문이 있습니다!

미해결

자바 ORM 표준 JPA 프로그래밍 - 기본편

EntityManager는 빈 스코프가 프록시로 설정된다고 알고있습니다. 하지만 결국은 원본 엔티티매니저를 사용하는것이라고 이해했습니다. 그러면 요청이 들어오면 엔티티매니저를 사용하는데 엔티티매니저 내에 영속성 컨텍스트가 있고 싱글톤으로 유지된다면 영속성컨텍스트가 다른 요청이랑 공유되는게 아닌가요? 싱글톤으로 등록되어 있는데 영속성컨텍스트가 공유되지 않는 이유가 궁금합니다. 엔티티매니저가 빈인데 어떻게 요청마다 생성되는것인지 궁금합니다.

  • java
  • jpa
YOGURT 댓글 1 좋아요 1 조회수 430

인기 태그

인프런 TOP Writers

주간 인기글