173만명의 커뮤니티!! 함께 토론해봐요.
해결됨
실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
p6spy releases를 확인해보면 1.9.0부터 Spring boot 3을 지원한다고 되어있고 테스트시 로그가 안뜹니다. 다른 질문에서보니 해당 버전이 메이븐에서만 지원되어서 그런 듯 합니다. 그래서 바로 아래 버전인 1.8.1을 사용해서 정상적으로 로그가 뜨는 것을 확인했습니다. 그래서 앞으로 최신 버전으로 했을때 안뜬다면 버전을 내려보시면 좋을 것 같습니다.
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
이렇게 떠서 구글링, 유튜브를 보는데 안나와가지고 혹시 방법을 여쭤봐도 될까요 ㅠ
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
안녕하세요 ! 포트폴리오 댓글,등록 삭제 과제 풀고있 었는데요 삭제 만드는중에 왜 포폴용 서버 문서에는 저렇게 리턴값을 명시해줘야한다고 돼있는데 코드는 export const DELETE_BOARD_COMMENT = gql` mutation deleteBoardComment($password: String, $boardCommentId: ID!) { deleteBoardComment(password: $password, boardCommentId: $boardCommentId) } `; 왜 이렇게 작성해야하는건가요? 풀다보니 저렇게 해야 댓글삭제할때 오류가 나지않더라구요 처음에는 export const DELETE_BOARD_COMMENT = gql` mutation deleteBoardComment($password: String, $boardCommentId: ID!) { deleteBoardComment(password: $password, boardCommentId: $boardCommentId) { ID } } `; 이렇게 작성했는데 오류가 떠서 혹시나 삭제해보니 오류가 나지 않아서 궁금합니다. 점점 복잡해지네요 ㅠㅠ 일단 이해는 다 못하지만 댓글삭제, 등록 기능을 구현하긴했는데 다음챕터로 넘어가도될까요 ? 아니면 처음부터 다시 31챕터까지 복습해야할까요?
미해결
안녕하세요. 5강수업 실습 중 오류가 나와 문의 드립니다.
미해결
따라하며 배우는 리액트 A-Z[19버전 반영]
안녕하세요! npm install axios --save 명령어로 axios를 설치하였는데 이런 문구가 나왔습니다. 혹시 설치가 안된것인가요? 그 이후에 수업을 진행하여 "이미지 배너 만들기" 수업을 듣고 코드를 작성 후 실행을 하니 영화에 정보가 나오지 않고 이런 오류들이 나옵니다. api 키도 사이트에서 잘 가져왔는데.. 혹시 axios 설치가 안되어서 나오는 오류 일까요?
해결됨
[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
train 데이터를 별도 분리안하고 범주형은 라벨 인코더로 스케일링하고나서 수치형데이터도 값이 큰건 minmaxscaler나 robustscaler로 적용하고 싶어서 개별 컬럼 선택해서 적용해보는데... 에러가 뜨는데 머가 문제인지 알수 있을까요? 수치형 범주형 개별로 스케일링 하고 싶으면 데이터를 분리했다가 다시 합쳐야 하는 걸까요? train['Total_Trans_Amt'] = scaler.fit_transform(train['Total_Trans_Amt']) test['Total_Trans_Amt']=scaler.transform(test['Total_Trans_Amt'])
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
page를 이동하면 보여줄 page컴포넌트가 바뀌고 그 컴포넌트가 첫렌더링 되고 그 page의 요소들을 전부 그리는 것으로 알고 있는데요. 근데 react dev tool상으로 내부 요소에 하이라이트가 되지 않더라고요. react dev tool에서 보이지 않지만 실제로는 그려지는 것이 맞나요? 회원가입 페이지로 이동했을때의 하이라이트 사진입니다.
미해결
따라하며 배우는 리액트 A-Z[19버전 반영]
안녕하세요 강사님🙇♀️ 다름이 아니라, removeEventListener와 관련되어 질문이 있습니다. 1. window.removeEventListener("scroll", () => {});에서 함수 부분에 아무것도 적어주지 않았는데, 빈 함수를 전달한다면 어떤걸 의미하는건가요? addEventListener과 같은 함수를 적어줘야 하지 않나요? 처음 리액트를 공부하는 거라, 많이 부족합니다ㅠㅠ 바쁘시겠지만 도움주시면 감사하겠습니다! (아래는 참고자료 겸 전체코드 첨부드립니다.) import React, { useState, useEffect } from "react"; import { useNavigate } from "react-router-dom"; import "./Nav.css"; export default function Nav() { const [show, setShow] = useState(false); const [searchValue, setSearchValue] = useState(""); const navigate = useNavigate(); useEffect(() => { window.addEventListener("scroll", () => { console.log("window.scrollY", window.scrollY); if (window.scrollY > 50) { setShow(true); } else { setShow(false); } }); return () => { window.removeEventListener("scroll", () => {}); }; }, []); const handleChange = (e) => { setSearchValue(e.target.value); navigate(`/search?q=${e.target.value}`); }; return ( <nav className={`nav ${show && "nav__black"} `}> <img alt="Netflix logo" src="https://upload.wikimedia.org/wikipedia/commons/thumb/0/08/Netflix_2015_logo.svg/170px-Netflix_2015_logo.svg.png" className="nav__logo" onClick={() => (window.location.href = "/")} /> <input value={searchValue} onChange={handleChange} className="nav__input" type="text" placeholder="영화를 검색해주세요." /> <img alt="User logged" src="https://occ-0-4796-988.1.nflxso.net/dnm/api/v6/K6hjPJd6cR6FpVELC5Pd6ovHRSk/AAAABbme8JMz4rEKFJhtzpOKWFJ_6qX-0y5wwWyYvBhWS0VKFLa289dZ5zvRBggmFVWVPL2AAYE8xevD4jjLZjWumNo.png?r=a41" className="nav__avatar" /> </nav> ); }
미해결
[리뉴얼] React로 NodeBird SNS 만들기
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를 하면 아래와 같은 오류 메세지가 뜹니다 그리고 로컬호스트 들어가보면 사이트에 연결할 수 없음이 뜹니다. 도와주세요 ㅠㅠ > react-nodebird-front@1.0.0 dev > next Browserslist: caniuse-lite is outdated. Please run: npx browserslist@latest --update-db ready - started server on http://localhost:3000 node: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
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
1.이미지 경로는 이미지가 여러개일 경우 배열상태로 존재하는데 왜 post 모델에 배열로 저장하지 않고 따로 테이블을 만들어 관계를 짖는 이유를 알수있을까요 2.테이블에 배열데이터를 저장하려면 json으로 저장이 될꺼같은데 이 데이터를 text타입으로 바꿔서 저장해야하나요? 관계를 지어 테이블을 두개 만드는 방식과 배열데이터를 같은 테이블에 넣는 방식중 머가 더 좋은가요?
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
let isStarted = false; let auth = () => { if(isStarted === false){ // 타이머가 작동중이 아닐때 타이머가 동작하게 함 isStarted = true document.getElementById("finish").disabled = false const token = String(Math.floor(Math.random() * 1000000)).padStart(6,"0") document.getElementById("target").innerText = token document.getElementById("target").style.color= "#" + token let time = 180 let timer timer = setInterval(function() { if(time >= 0 ){ let min = Math.floor( time / 60 ) let sec = String (time % 60).padStart(2,"0") // console.log(min + ":" + sec) document.getElementById("timer").innerText= min + ":" + sec time = time - 1 } else { document.getElementById("finish").disabled=true isStarted = false clearInterval(timer) } },1000) } else { // 타이머가 작동중일때 } } let isStarted를 False로 주고 auth함수 안에 if문에서 isStarted가 False 일때 1.isStarted에 아무것도 할당 안하면 else문으로 넘어가지않는다. 2.처음에 isStarted에 true를 할당하고 마지막에 false를 할당한다 if문 부분에 설명이 모든게 낯선 제 머리로는 이 로직이 이해가 안되네요 ㅠㅠ 왜 true를 줬는지 ture를 주면 어떤일이 일어나는지 아무것도 안줬을때는 어떤일이 일어나는지 조금 더 자세한 설명 부탁드립니닷. 확실히 javascript파트는 어렵습니다.ㅠㅠㅠ
미해결
[리뉴얼] React로 NodeBird SNS 만들기
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상태가 나오는 방법을 알고싶습니다
미해결
따라하며 배우는 리액트 A-Z[19버전 반영]
useParams를 이용한 영화 상세 페이지 구현하기에서 가져올 useParams에 파라미터 값이 movieId인 것을 어떻게 확인할 수 있을까요 ?
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
export default function LibraryIconPage(): JSX.Element { const onClickDelete = (event: MouseEvent<HTMLDivElement>): void => { console.log(event.currentTarget.id) } return ( <div id="삭제게시글id" onClick={onClickDelete}> <MyIcon /> </div> ) } 강사님께서 상위에 div를 만들고 event.currentTarget.id로 값을 받아오라고 설명해주셨는데, svg 상위 태그인 span에 id가 있으니까 MyIcon에 id,onClick 넣고 event.currentTarget.id로 span의 id값을 가져오는 건 잘못된 것인지 궁금합니다.
미해결
[리뉴얼] React로 NodeBird SNS 만들기
다른분들 질문 보다보니 부모컴포넌트와 자식컴포넌트가 동일한 key값으로 서버에 요청을 보내면 한번만 요청을 보내고 부모컴포넌트에서 캐싱된 값을 자식컴포넌트가 사용한다고 봤는데 공식 홈페이지 예제 보니 특정 페이지 내부에서 화면에 렌더링되는 모든 컴포넌트에서는 동일한 key값으로 서버에 요청하는경우에 하나만 요청되고 모두 캐싱되어서 같은화면?내에서 렌더링되는 컴포넌트들은 값을 공유하는것같은데 이도 맞을까요? nextjs _app Custom App component 에서 요청하는 swr key는 전역적으로 캐싱이 안되나요? _app에서 서버로 사용자 정보를 요청하도록 코드를 작성해놨고 각 페이지 마다도 동일한 key값으로 사용자 정보를 서버에 요청하도록 작성해두었습니다. 페이지를 이동하더라도 app에서 사용한 key값과 각 페이지에서 서버로 요청하는 key값이 동일하니 캐싱되어 서버로 사용자 정보를 재요청하지 않고 캐싱된 값을 사용해야된다고 생각되는데 계속해서 서버로 사용자 정보를 재요청을 보냅니다. 왜 그런것일까요..?
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
home.html이나 game.html은 css가 정상적으로 적용되는데 jukebox.html만 css가 적용되지않습니다 왜그런가욤.. jukebox.html: <!DOCTYPE html> <html lang="ko"> <head> <title>JUKEBOX</title> <link href="./styles/jukebox.css"> </head> <body> <div class="wrapper"> <div class="wrapper__header"> <div class="wrapper__title"> <div class="title">추억의 BGM</div> <div class="subtitle">TODAY CHOICE</div> </div> <div class="divideLine"></div> </div> <div class="wrpper__body"> <div class="wrapper__title"> <div class="title">추억의 BGM</div> <div class="subtitle">TODAY CHOICE</div> </div> </div> </div> </body> </html> jukebox.css: *{ box-sizing: border-box; margin: 0px; } html, body{ width: 100%; height: 100%; } .title{ color: #55b2e4; font-size: 13px; font-weight: 700; } .subtitle{ font-size: 8px; padding-left: 5px; } .divideLine{ width: 100%; border-top: 1px solid gray; }
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
id="myword"가 떡하니 있는데 왜저럴까요.. let lastword = word[word.length-1] let firstword = myword[0] 부분도 let 선언이 안되는것같습니다 ㅠ game.html: <!DOCTYPE html> <html lang="ko"> <head> <title>Game</title> <link href="./styles/game.css" rel="stylesheet"> <script src="./game.js"></script> </head> <body> <div class="wrapper"> <div class="wrapper__header"> <div class="header__title"> <div class="title">GAME</div> <div class="subtitle">TODAY CHOICE</div> </div> <div class="divideLine"></div> </div> <div class="game__container"> <img src="./images/word.png"> <div class="game__title">끝말잇기</div> <div class="game__subtitle">제시어 : <span id="word">코드캠프</span> </div> <div class="word__text"> <input class="textbox" id="myword" placeholder="단어를 입력하세요"> <button class="search" onclick="startWord()">입력</button> </div> <div class="word__result" id="result">결과!</div> </div> <div class="game__container"> <img src="./images/lotto.png"> <div class="game__title">LOTTO</div> <div class="game__subtitle"> 버튼을 누르세요. </div> <div class="lotto__text"> <div class="number__box"> <span class="number1">3</span> <span class="number1">5</span> <span class="number1">10</span> <span class="number1">24</span> <span class="number1">30</span> <span class="number1">34</span> </div> <button class="lotto_button">추첨</button> </div> </div> </div> </body> </html> game.js: const startWord = () => { let myword = document.getElementById("").value let word = document.getElementById("word").innerText let lastword = word[word.length-1] let firstword = myword[0] if(lastword === firstword){ document.getElementById("result").innerText = "정답입니다" document.getElementById("word").innerText = myword docement.getElementById("myword").value = "" } else { document.getElementById("result").innerText="떙!" docement.getElementById("myword").value = "" } }
해결됨
실전! 스프링 데이터 JPA
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 안녕하세요. 카운트 쿼리 분리 부분을 듣는 도중에 카운트 쿼리에 LEFT JOIN이 사용되는 결과를 확인하기 위해 다음처럼 코드를 작성하였습니다. public interface MemberRepository extends JpaRepository<Member, Long> { @Query(value = "select m from Member m left join m.team t") Page<Member> findByAge(int age, Pageable pageable); ... } @Test public void paging() throws Exception { //given memberRepository.save(new Member("member1", 10)); memberRepository.save(new Member("member2", 10)); memberRepository.save(new Member("member3", 10)); memberRepository.save(new Member("member4", 10)); memberRepository.save(new Member("member5", 10)); //when PageRequest pageRequest = PageRequest.of(0, 3, Sort.by(Sort.Direction.ASC, "username")); Page<Member> page = memberRepository.findByAge(10, pageRequest); //then List<Member> content = page.getContent(); assertThat(content.size()).isEqualTo(3); assertThat(page.getTotalElements()).isEqualTo(5); assertThat(page.getNumber()).isEqualTo(0); assertThat(page.getTotalPages()).isEqualTo(2); assertThat(page.isFirst()).isTrue(); assertThat(page.hasNext()).isTrue(); } 그런데 결과는 강의와는 달리 카운트 쿼리에 LEFT JOIN 이 사용되지 않았고, 심지어 JPQL select m from Member m left join m.team t 을 @Query에 작성했음에도 조회 쿼리도 LEFT JOIN을 사용하지 않은 것을 확인했습니다. 이후 스프링 부트 3 이하 버전에서 동일한 코드로 실행해보니 강의와 동일한 결과를 얻을 수 있었습니다. 스프링 부트 3 부터 적용된 스프링 데이터 JPA 에서는 이러한 부분의 최적화를 자동으로 제공하는 것일까요?
미해결
즐거운 자바
안녕하세요. 백엔드 개발자 희망하고 있습니다. 자바 독학 공부 시작했는데 기본문법 예제들은 혼자 짤 수 있는데 객체지향/3 로또 부분부터 어렵네요. 구구단, 별찍기 하다가 로또 구현할 수 있을때까지 공부 방법이 궁금합니다. ㅠ.ㅠ 자바 공부 방법 알려주세요 ㅠㅠㅠ 지금은 강사님 강의 보고 이해가 부족하다는 부분 이론서 보면서 나가고있습니다. 이론서에 나와있는 문제들도 타이핑 하면서 진행하구 있습니다. 길게 코드 작성할 수 있을때까지 자바 공부 방법 알려주세요.
