묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
enum 컬럼 옵션에 대한 질문합니다.
10강의 Typeorm 이론의 EnumColumn에서는 EumColumn에서는 @Column({ type : 'enum', enum : Role, default : Role.USER, }) role: Role;enum에 Role 타입을 enum : Role 이렇게 넣고 11강의 Relations강의에서 Enum Column에서는@Column({ enum : Object.values(RolesEnum), type : 'enum', default : RolesEnum.USER }) role : RolesEnum;옵션에서 enum : Object.values(RolesEnum)로 설정을 하는데 무슨 차이가 있나요?
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
게시판만들다가 질문드립니다
import "./App.css"; import { BrowserRouter, Route, Routes } from "react-router-dom"; import MainPage from "./pages/MainPage"; import Board from "./pages/Board"; import { useEffect } from "react"; function App() { useEffect(() => console.log("app is loading"), []); return ( <BrowserRouter> <Routes> <Route path="/" element={<MainPage />}></Route> <Route path="/board/:bbsId" element={<Board />}></Route> <Route path="/board/:bbsId/new" element={<Board />}></Route> </Routes> </BrowserRouter> ); } export default App; import React, { useEffect, useState } from "react"; import { useNavigate, useParams } from "react-router-dom"; // useParams를 import import BoardList from "../pagesComponent/BoardList"; import BoardEdit from "../pagesComponent/BoardEdit"; import BoardView from "../pagesComponent/BoardView"; import Layout from "../layout/Layout"; import axios from "axios"; export const BbsSettingContext = React.createContext(); const Board = () => { const { bbsId } = useParams(); // const [currentUrl, setCurrentUrl] = useState(null); const [boardSettData, setBoardSettingData] = useState(null); useEffect(() => { let mode = window.location.pathname.split("/")[3] == null ? "list" : window.location.pathname.split("/")[3]; console.log(`mode::::::::::::::${mode}`); setCurrentUrl(mode); axios .get("http://localhost:8080/board/" + bbsId) .then((response) => { const boardSettData = response.data.bbsEntity; console.log(boardSettData); setBoardSettingData(boardSettData); }) .catch((error) => console.log(error)); }, [currentUrl]); return ( <BbsSettingContext.Provider value={boardSettData}> {currentUrl == "list" ? ( <Layout> <BoardList /> </Layout> ) : currentUrl == "new" ? ( <Layout> <BoardEdit /> </Layout> ) : currentUrl == "edit" ? ( <Layout> <BoardEdit /> </Layout> ) : currentUrl == "view" ? ( <Layout> <BoardView /> </Layout> ) : ( <BoardList /> )} </BbsSettingContext.Provider> ); }; export default Board; import React from "react"; import { useContext, useHistory } from "react"; import { BbsSettingContext } from "../pages/Board"; import PageNationPage from "./PageNationPage"; import { useNavigate } from "react-router-dom"; const BoardList = () => { const boardSetData = useContext(BbsSettingContext); console.log(boardSetData); const Navigate = useNavigate(); const handleBoardEdit = () => { // 원하는 동작을 수행할 코드를 여기에 추가 console.log("쓰기로 이동"); Navigate("/board/1/new"); }; return ( <div className="BoardList"> <table className="bbsTable"> <colgroup> <col style={{ width: "10%" }} /> <col style={{ width: "40%" }} /> <col style={{ width: "10%" }} /> <col style={{ width: "20%" }} /> <col style={{ width: "10%" }} /> </colgroup> <thead> <tr> <th scope="col">번호</th> <th scope="col">제목</th> <th scope="col">작성자</th> <th scope="col">등록일</th> <th scope="col"> 조회</th> </tr> </thead> </table> <PageNationPage /> <button onClick={handleBoardEdit}>쓰기</button> </div> ); }; export default BoardList; import React from "react"; import { useState, useEffect, useContext } from "react"; import { BbsSettingContext } from "../pages/Board"; const BoardEdit = () => { const boardSetData = useContext(BbsSettingContext); console.log(boardSetData); return <div>BoardEdit</div>; }; export default BoardEdit; 안녕하세요 다름이 아니라 일기장 보고 게시판을 응용해서 만들던 도중에 안되는게 있어서 질문드립니다.http://localhost:3000/board/1이 리스트로 나오는데요 ...거기서 쓰기를 누르면 http://localhost:3000/board/1/new으로 위에 url은 바뀌는데밑에 ui는 전혀 바뀌질 않습니다 .그리고 Board.js에 useEffect쪽에 콘솔로 찍어봐도 들어오지가 않는데 이유를 좀 알수있을까요 ????? 근데 쓰기 버튼말고 그냥 직접 url을 입력하고 enter를 입력하면 이동합니다 .
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청드립니다
인프런 아이디 : sangkipm@gmail.com인프런 이메일 : sangkipm@gmail.com깃헙 아이디 : sangkipm@gmail.com깃헙 username : kimsangkipm
-
미해결[리뉴얼] 코딩자율학습 제로초의 자바스크립트 입문
fragment 질문
fragment는 메모리를 사용하니까 직접 화면에 그리는것보다 빠른 건가요?그렇다면 메모리 속도 > 화면 그리는 속도 라고 봐도 될까요??
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
이렇게해도 괜찮은걸까요?
(사진)
-
미해결[리뉴얼] 코딩자율학습 제로초의 자바스크립트 입문
제시어가 비어잇는가 ???
여기서 왜 if(!word) 를 해석하면 왜 이게 word 가 언디 파인드라고 하면 false 가되고 여기에 !주면 true 인건 알겟는데 워드가 트루인경우이지 이게왜 제시어가 비어잇는경우인가요 ????? 말자체가이해가 안되는데요 ??? 저는 이게 어떤원리로 돌아가는지 그림으로 안그려집니다 ㅜㅜ if(!word) // 제시어가 비어잇는가? { // 비어잇다 word = newWord; // 입력한단어가 제시어가 된다 // $word.textContent = word; $input.value=''; }
-
미해결Vue.js 시작하기 - Age of Vue.js
props 이름 명명 시 주의사항?
props의 이름을 정할 때 카멜식으로 했더니 인식이 안되네요.. 대소문자 섞이면 안되나요?
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
filter를 이용해서 풀어보았습니다.
감사합니다. // 내코드 function solution(array) { let max = 0; return array.filter((v) => { if (v > max) { max = v; return true; } }).length; } console.log(solution([130, 135, 148, 140, 145, 150, 150, 153]));결과는 : [130,135,148,150,153] 5가 나옵니다
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
filter를 이용한 풀이
강의 보기전 제가 문제를 제대로 이해 했는지 모르겠으나,첫줄6과 7을 비교를 처음 시작, 그 이후 부터 자신의 바로 앞 수보다 큰 수만 출력 이렇게 이해해서 filter와 삼항연산자를 이용하여 풀어보았습니다.function solution(num, array) { return array.filter((v, index) => index === 0 ? v > num : array[index] > array[index - 1] ); } console.log(solution(6, [7, 3, 9, 5, 6, 12]));
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
Promise, resolve, setTimeout에 대한 질문입니다.
async function aaa() { console.log(1); console.log(2); await new Promise((resolve, reject) => { setTimeout(resolve, 3000); }).then(() => { console.log("히히히"); }); console.log(3); } aaa();async function aaa() { console.log(1); console.log(2); await new Promise((resolve, reject) => { setTimeout(() => {}, 3000); }).then(() => { console.log("히히히"); }); console.log(3); } aaa(); 맨위의 코드는 12히히히3 이렇게 잘 찍힙니다. 위의 코드에서 setTimeout(resolve,3000) 에서 resolve를 ()=>{} 로 바꾸니, 12 이렇게 찍힙니다. resolve라는 것을 쓰지 않음으로써 then으로 가지 못해 console.log('히히히')가 동작을 하지 않는 것은 이해가 되는데, promise 외부 코드인 console.log(3); 이 동작하지 않는건 이해가 되지 않습니다. resolve에 뭔가 더 특별한 기능이 더 있는 건가요??
-
미해결[리뉴얼] 코딩자율학습 제로초의 자바스크립트 입문
코드 작성..
function onLeftClick(e) { const target = e.target; const rowIndex = target.parentNode.rowIndex; const cellIndex = target.cellIndex; const clikedCellData = tableData[rowIndex][cellIndex]; console.log(clikedCellData); if (clikedCellData === CODE.FLAG || clikedCellData === CODE.QUESTION) { console.log('click') return; } if (clikedCellData === CODE.FLAG_MINE || clikedCellData === CODE.QUESTION_MINE || clikedCellData === CODE.MINE) { alert('펑!'); return; } if (clikedCellData === CODE.NORMAL) { const mineCount = countMine(rowIndex, cellIndex); target.textContent = mineCount || ''; target.className = 'opened'; tableData[rowIndex][cellIndex] = mineCount; } }순서도대로 작성해봤는데 강좌 코드랑 if문 순서가 다릅니다. 제대로 동작은 하는거같아요! 어떤게 더 좋은 방법인가요? 더 좋은 if문 작성 팁이 따로있을까요?
-
해결됨웹 애니메이션을 위한 GSAP 가이드 Part.02
.left는 quickTo를 쓰지 않는 이유
.left도 지속적으로 x를 호출하니 quickTo를 쓰면 더 좋지않을까 라고 생각했는데 .left는 to로 컨트롤하시는 이유가 있을까요?quickTo의 기본값이 픽셀이라 퍼센트 넣으면 동작이 이상해지던데 혹시 이런 이유일까요?!
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
파이널 과제도중 질문
파이널 과제중에 html이랑 css는 어느정도 다를수있게된거같은데 타이머나 인증번호쪽 js가 쫌 안되더라고요..이걸 공부를 어떻게해야할지 고민입니다파이널과제를 완벽하게 할수있을때까지 복습을해야할지..아니면 다음 커리큘럼이 js니까 일단 진도를 나가야할지 고민입니다
-
해결됨웹 애니메이션을 위한 GSAP 가이드 Part.03
ScrollTrigger의 animation에 함수호출
function rotation_text(){ const tl = gsap.timeline({defaults:{duration:2}}) tl .to('.container6>.textbox',{ rotation:720 }) .to('.container6>.textbox',{ scale:5 }) // .to('.container6>.textbox',{ // opacity:0 // }) } ScrollTrigger.create({ trigger:'.container6', start:'top', end:'+=2000', scrub:1, pin:true, markers:true, animation:rotation_text() })안녕하세요 선생님 좋은 강의 항상 감사하면서 공부하고 있습니다.다름이 아니라 위 코드처럼 타임라인을 함수로 등록하여 사용하고 싶은데요..위의 코드를 실행하면 스크롤트리거에 걸리지 않고 이미 함수가 실행되어 container6으로 내려오는데 제가 뭘 잘못했을까요...ㅜㅜ고민고민하고 이리저리 뜯어보다 질문드립니다.
-
해결됨[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
where에서 이상 이하를 입력하는 방법
where : [ { id : 1, //version : 1 이건 id = 1AND version = 1; 로 된다는 의미이다. }, { version : 1 // 이땐 id = 1 OR version = 1; 로 된다. }, { profile : { id : 3 } } ],and와 or 그리고 값에 대한 조건설정은 있지만 프로퍼티에서 이상과 이하에 대한 검색은 어떻게 하나요?
-
해결됨React + GPT API로 AI회고록 서비스 개발 (원데이 클래스)
const handleEnter 문에 궁금한게 있습니다.
setUserInput("")을 하면 userInput 값이 ""로 바뀌고그다움 num 선언문에 ""의 숫자변환값이 들어가는게 아닌가 궁금합니다.
-
미해결2022 30분 요약 강좌 시즌 1 : HTML, CSS, Linux, Bootstrap, Python, JS, jQuery&Ajax
codesandbox 문서 버튼이 안보여요
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. codesandbox 문서 버튼이 안보여요코딩실습을 해야하는데 문서 버튼이 아예 없어서 어딜 눌러서 코딩을 해야할지...
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
리프레시 토큰 관련 질문이 있습니다.
안녕하세요.해당 강의에 대한 질문이라기 보다 현재 우리가 구현한 인증/인가 구현 방법에 대한 질문이 있습니다. accessToken은 만료되었을 시 refreshToken을 재발급 받을 수 있도록 우리가 API를 만들었습니다. 따라서 클라이언트 측에서 accessToken 만료 시 refreshToken을 재발급하는 API를 요청하고 갱신을 할 것이라고 생각됩니다. 하지만 refreshToken을 갱신하는 API는 refreshToken이 만료되었을 시에는 리프레쉬 토큰을 갱신하지 못합니다. 이 때 사용자에게 재로그인을 시킨다는 기획이라면 문제가 없을 것 같습니다. (재로그인이라면 리프레시 토큰 갱신 API는 불필요할 것으로 생각됩니다.) 그렇다면 리프레시 토큰을 갱신하는 API는 클라이언트 입장에서 언제 호출을 해야되나요?사용자가 우리 서비스를 이용한다면 주기적으로 리프레시 토큰을 갱신하는 API를 호출하고 리프레시 토큰을 갱신을 해놔야하나요? 정답이야 없겠지만 스탠다드한 방법이 궁금합니다!
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
access token 관련 질문드립니다.
안녕하세요 강의를 다 듣고 개인 포트폴리오 제작중에 있습니다.현재 로그인 부분을 구현중인데, 포인트 충전이라던가 마이페이지 접근시, 비밀번호 변경 시 등의 경우에 인가(여기선 fetchUser)를 받아야 한다고 이해했습니다. 그러려면, 강의에선 아래 사진처럼 header에 토큰을 넣어서 보내었습니다.하지만 직접 프론트엔드를 구축해서 api 호출하려고 하니 header에 토큰을 넣어줘야 하는데, 현재 로그인시 그냥 토큰 값인 문자열을 리턴할 뿐 엑세스토큰을 저장하는 곳이 없습니다.보통 액세스토큰을 저장할 때 변수, 로컬스토리지, 세션스토리지, 쿠키 중 무엇을 가장 많이 사용하나요?섹션 13-11의 강의에서 처럼 변수에 액세스토큰을 저장하는 경우를 생각해 봤습니다. 그러면 인증하는 컴포넌트(ex: login)와 인가를 받는 컴포넌트(ex: 포인트 충전)가 다를 때 컴포넌트에서 token을 변수로 저장하더라도 다른 컴포넌트에서는 사용 못할텐데 recoil같은 라이브러리를 사용해서 전역변수로 사용해야 하는지 궁금합니다. 아래는 프론트엔드의 login 컴포넌트를 예시를 적어보았습니다. const [token, setToken] = useState(""); await axios.post("http://localhost:5656/graphql", { query: ` mutation { login(id: "${inputId}", password: "${inputPw}") } `, }) .then(res => { setToken(res.data.data.login); } }) 감사합니다.
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
스웨거에 글 등록시 401 에러가 나와요 ㅠ
스웨거에 글 등록시 401 에러가 나와요 ㅠ 뭐가 문제일까요?