172만명의 커뮤니티!! 함께 토론해봐요.
미해결
자바 ORM 표준 JPA 프로그래밍 - 기본편
둘 다 null을 허가하지 않는 다는 의미로 쓰이는 것 같은데 어떤 차이가 있는 건가요 ? @EnumType 애노테이션을 제거하고 멤버를 추가해도 @EnumType.Ordinal 옵션을 적용 한 것처럼 Integer로 컬럼을 만들고 user = 0, admin=1 으로 잘 저장하던데 @EnumType은 어떤 역할을 하는 것인가요? EnumType.String이 필수로 써야할만큼 EnuType.Ordinal은 안좋은 옵션같은데 Default가 String이 아니라 Ordinal인 거는 따로 무슨 이유가 있는 건가요 ?
미해결
[리뉴얼] React로 NodeBird SNS 만들기
안녕하세요 제로초님! const { mainPosts, hasMorePosts, loadPostsLoading } = useSelector( (state) => state.post, ); useEffect(() => { function onScroll() { if ( window.scrollY + document.documentElement.clientHeight > document.documentElement.scrollHeight - 300 ) { if (hasMorePosts && !loadPostsLoading) { console.log('로딩상태 ; ', loadPostsLoading); console.log('불러오기'); dispatch({ type: LOAD_POSTS_REQUEST, }); } } } window.addEventListener('scroll', onScroll); return () => { window.removeEventListener('scroll', onScroll); }; }, [hasMorePosts, loadPostsLoading]); 현재 여기까지 코딩이 진행된 상태인요! 콘솔로 찍어보니 이렇게 두번 REQUEST를 보내게 됩니다. 리덕스를 찍어봤을 때는 이렇게 나옵니다. reducers 부분은 const reducer = (state = initialState, action) => produce(state, (draft) => { switch (action.type) { case LOAD_POSTS_REQUEST: draft.loadPostsLoading = true; draft.loadPostsDone = false; draft.loadPostsError = null; break; case LOAD_POSTS_SUCCESS: draft.loadPostsLoading = false; draft.loadPostsDone = true; draft.mainPosts = action.data.concat(draft.mainPosts); draft.hasMorePosts = draft.mainPosts.length < 50; break; case LOAD_POSTS_FAILURE: draft.loadPostsLoading = false; draft.loadPostsError = action.error; break; ... saga > post.js 코드는 function loadPostsAPI(data) { return axios.get('/api/post', data); } function* loadPosts(action) { try { // const result = yield call(loadPostsAPI, action.data) yield delay(1000); const id = shortid.generate(); yield put({ type: LOAD_POSTS_SUCCESS, data: generateDummyPost(10), }); } catch (err) { yield put({ type: LOAD_POSTS_FAILURE, data: err.response.data, }); } } function* watchLoadPosts() { yield throttle(5000, LOAD_POSTS_REQUEST, loadPosts); } 이 상태입니다. 조건문에서 !loadPostsLoading < 이걸 지우면 엄청난 양으로 REQUEST가 보내지는 것을 보니 !loadPostsLoading 이게 먹히는 것 같기는 합니다. 왠지 REQUEST가 보내진 후 loadPostsLoading이 true로 변경된 것 같기는 한데 이게 useEffect 코드에서는 아직 false로 인식해서 또 REQUEST를 보내는 것이 아닌가 하는게 제 추측인데요, 맞을까요?ㅠㅠ
미해결
자바 ORM 표준 JPA 프로그래밍 - 기본편
1차 캐시, 쓰기지연, 더티체킹(스냅샷), 지연로딩 영속성 컨텍스트의 특징이 이정도인 거 같은데 더티체킹은 엔티티(객체)를 컬렉션에서 관리하듯이 도와줘서 수정측면에서 도움이 많이 되는 것 같긴 한데 1차캐시나 쓰기지연 로딩은 디비에 데이터 몇 번 덜 접근한다고 해서 큰 차이 없을 것 같은데 성능적인 측면에서 많이 도움 되나요? 실무를 해본 적이 없어서 제가 잘 모르는 것일까요 ?
미해결
자바 ORM 표준 JPA 프로그래밍 - 기본편
DB 접근 2편이나 활용1편에서는 Gradle을 사용해서application.properties를 통해 h2를 설정하고 build.gradle을 통해서 라이브러리를 받아왔던 것 같은데 이번 강의에서는 xml파일들을 사용해서 상당히 어색한데요. 최근에 Gradle을 많이 사용한다면 xml로 설정하는 방법을 따로 공부할 필요는 없을까요?
미해결
[리뉴얼] React로 NodeBird SNS 만들기
export const getStaticProps = wrapper.getStaticProps(async (context) => { console.log("getStaticProps"); context.store.dispatch({ type: LOAD_USER_REQUEST, data: 1, }); context.store.dispatch(END); await context.store.sagaTask.toPromise(); }); about.js에서 위에 코드를 입력하면 사이트에 연결할수 없음이라고 뜨는데 이코드도 버전 차이면 어떻게 바꿔야 하는지 알려주시면 감사하겠습니다
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
안녕하세요 취업할때 공부한 걸 블로그나 노션에 기록해뒀다가 주소를 이력서에 첨부하면 좋다고 들었는데요 노션에 공부노트 템플릿으로 저렇게 수업내용 같은거 작성하고 있는데 제가 노션이 익숙치 않아서ㅜㅜ 이런식으로 해서 주소첨부해도 괜찮은 게 맞나요? 혹시 팁이 있다면 알려주세요~^^
미해결
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
항상 좋은 강의 감사드려유♡
미해결
[리뉴얼] React로 NodeBird SNS 만들기
import { Card, Button, Avatar, Popover, List, Comment } from "antd"; import { RetweetOutlined, HeartOutlined, MessageOutlined, HeartTwoTone, EllipsisOutlined, } from "@ant-design/icons"; import { useDispatch, useSelector } from "react-redux"; import PropTypes from "prop-types"; import PostImages from "./PostImages"; import { useCallback, useEffect, useState } from "react"; import CommentForm from "./CommentForm"; import PostCardContent from "./PostCardContent"; import FollowButton from "./FollowButton"; import { REMOVE_POST_REQUEST, LIKE_POST_REQUEST, UNLIKE_POST_REQUEST, RETWEET_REQUEST, } from "../reducers/post"; import Link from "next/link"; const PostCard = ({ post }) => { const dispatch = useDispatch(); const { removePostLoading } = useSelector((state) => state.post); const [commentFormOpened, setCommentFormOpened] = useState(false); const id = useSelector((state) => state.user.me?.id); const onLike = useCallback(() => { if (!id) { return alert("로그인이 필요합니다."); } return dispatch({ type: LIKE_POST_REQUEST, data: post.id, }); }, [id]); const onUnLike = useCallback(() => { if (!id) { return alert("로그인이 필요합니다."); } return dispatch({ type: UNLIKE_POST_REQUEST, data: post.id, }); }, [id]); const onToggleComment = useCallback(() => { setCommentFormOpened((prev) => !prev); }, []); const onRemovePost = useCallback(() => { if (!id) { return alert("로그인이 필요합니다."); } return dispatch({ type: REMOVE_POST_REQUEST, data: post.id, }); }, [id]); const onRetweet = useCallback(() => { if (!id) { return alert("로그인이 필요합니다."); } return dispatch({ type: RETWEET_REQUEST, data: post.id, }); }, []); const liked = post.Likers?.find((v) => v.id === id); return ( <div style={{ marginBottom: 10 }}> <Card cover={post.Images[0] && <PostImages images={post.Images} />} actions={[ <RetweetOutlined key="retweet" onClick={onRetweet} />, liked ? ( <HeartTwoTone twoToneColor="#eb2f96" key="heart" onClick={onUnLike} /> ) : ( <HeartOutlined key="heart" onClick={onLike} /> ), <MessageOutlined key="message" onClick={onToggleComment} />, <Popover key="more" content={ <Button.Group> {id && post.user?.id === id ? ( <> <Button>수정</Button> <Button type="danger" onClick={onRemovePost} loading={removePostLoading} > 삭제 </Button> </> ) : ( <Button>신고</Button> )} </Button.Group> } > <EllipsisOutlined /> </Popover>, ]} title={ post.RetweetId ? `${post.user.nickname}님이 공유하셨습니다` : null } extra={id && <FollowButton post={post} />} > {post.RetweetId && post.Retweet ? ( <Card cover={ post.Retweet.Images[0] && ( <PostImages images={post.Retweet.Images} /> ) } > <Card.Meta avatar={ <Link href={`/user/${post.Retweet.user.id}`}> <a> <Avatar>{post.Retweet.user.nickname[0]}</Avatar> </a> </Link> } title={post.Retweet.user.nickname} description={<PostCardContent postData={post.Retweet.content} />} /> </Card> ) : ( <Card.Meta avatar={ <Link href={`/user/${post.user.id}`}> <a> <Avatar>{post.user.nickname[0]}</Avatar> </a> </Link> } title={post.user.nickname} description={<PostCardContent postData={post.content} />} /> )} </Card> {commentFormOpened && ( <div> <CommentForm post={post} /> <List header={`${post.Comments.length}개의 댓글`} itemLayout="horizontal" dataSource={post.Comments} renderItem={(item) => ( <li> <Comment author={item.user?.nickname} avatar={ <Link href={`/user/${post.user?.id}`}> <a> <Avatar>{post.user?.nickname[0]}</Avatar> </a> </Link> } content={item.content} /> </li> )} /> </div> )} </div> ); }; PostCard.propTypes = { post: PropTypes.shape({ id: PropTypes.number, user: PropTypes.object, content: PropTypes.string, createdAt: PropTypes.string, Comment: PropTypes.arrayOf(PropTypes.object), Images: PropTypes.arrayOf(PropTypes.object), Likers: PropTypes.arrayOf(PropTypes.object), RetweetId: PropTypes.number, Retweet: PropTypes.objectOf(PropTypes.any), }).isRequired, }; export default PostCard; 아바타를 클릭하면 해당 아이디 정보하고 그 아이디 게시물만 떠야하는데 해당 아이디 프로필은 잘뜨는데 게시물이 다른사람 게시글까지 같이 뜹니다. 참고로 저는 post.User를 u로 바꿔야지만 뜹니다
미해결
실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
Junit5로 테스트를 생성해서 그런지 Test애노테이션에 expected 라는 옵션이 없어서 @Test() public void 상품주문_재고수량초과() throws Exception { //given Member member = createMember(); Item book = createBook(10000, 10, "시골 JPA"); int orderCount = 11; //when Assertions.assertThatThrownBy(() ->orderService.order(member.getId(), book.getId(), orderCount)) .isInstanceOf(NotEnoughStockException.class); } 이렇게 만들어서 돌렸는데 테스트가 통과했다면 그냥 넘어가도 되는 것일까요? @Test() public void 상품주문_재고수량초과() throws Exception { //given Member member = createMember(); Item book = createBook(10000, 10, "시골 JPA"); int orderCount = 11; //when Assertions.assertThatThrownBy(() ->orderService.order(member.getId(), book.getId(), orderCount)) .isInstanceOf(NotEnoughStockException.class); fail("재고 수량 부족 예외가 발생해야 한다."); } 이렇게 돌리면 재고 수량 부족 예외가 발생해야 한다. java.lang.AssertionError: 재고 수량 부족 예외가 발생해야 한다. 라는 예외가 발생했습니다.
미해결
실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
public int getTotalPrice() { return orderPrice * count; } public int getTotalPrice() { return getOrderPrice() * getCount(); } 주문 아이템의 가격을 반환해야할 때 당연히 위처럼 코드를 작성해야겠다고 생각했는데, 강의를 보니 아래처럼 하시더라구요 결국 같은 값을 반환하는 것 같은데 어떤 차이가 있는지 알 수 있을까요 ?
해결됨
[리뉴얼] React로 NodeBird SNS 만들기
실제 몇몇 서비스를 보면 글 작성이나 수정같은 비동기 요청이 성공한 후에 새로고침을 하는데 이 강좌와 같이 Next.js를 사용하는 리액트 개발은 새로고침을 하는게 맞는건가요?
미해결
자바 ORM 표준 JPA 프로그래밍 - 기본편
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요. @Column에서 unique나 length제약조건을 거는것은 런타임에 영향을 주지 않는다 하시고 @Table에서 name을 사용해서 테이블 명을 바꾸는것은 런타임에 영향을 주신다고 하셧는데 둘의 차이를 이해하지 못하고 있습니다. @Table의 name을 변경하는것이 인서트 쿼리나 업데이트 쿼리에 영향을 준다고 하셧는데 이 말 자체를 이해하지 못하고 있는 것 같습니다..
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
안녕하세요 혹시 강의 내용을 복습할 때 깃허브나 블로그에 정리 요약 해서 업로드 해도 될까요?
해결됨
스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 윈도우 cmb창에서 명령 프롬프트에서 gradlew.bat 를 실행하려면 gradlew 하고 엔터를 치면 됩니다. --> 여기까지는 실행이 됬으나 gradlew build에서 BUILD FAILED 됩니다... 도저히 모르겠습니다.
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
let i = 0; while (i <10) { console.log(i) i = i +1 } 여기서 콘솔로 0 ~10 까지 찍히는데 왜 10까지 찍히는건가요?? 강의 마지막에 편집오류인지 짤려서 이유가 안나와요
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
안녕하세요 멘토님 매번 강의 잘 듣고 있습니다. 이번 강의를 마무리로 별도로 개인 토이프로젝트 개발을 시작하고 배포를 할 때가 오면 다시 배포 부분부터 수강할 예정인데 이 강의에서 이해가 좀 정확히 안되는 부분이 있어서 질문 글을 올렸습니다. API 모킹을 통해 가짜 게시글 생성 테스트 API를 보내서 result를 받는 부분 중, _id 값 부분이 이해가 잘 안됩니다. writer , title , contents 는 테스트 input 부분에 있던 내용들 그대로 result에 적어서 이 값들이 제대로 insert 되었는지 테스트를 하기 때문에 같은 값을 입력했다는 것은 이해를 했습니다. 그런데 _id 부분은 왜 백엔드에서-받은-게시글ID 이라고 임의로 입력을 했는지 부분을 이해 못했습니다. id, _id 와 같은 값은 랜덤으로 생성되기에 뭘로 받아올지 모르기 때문에 테스팅 라이브러리에서 임의의 값으로 지정하도록 설정이 가능해서일까요? 그렇다면 아폴로에서 캐싱할 때도 _id, id 라는 명을 인식해서 캐싱이 더 잘되듯이, 테스팅 라이브러리도 _id, id 명에 한정해서 개발자가 임의의 값을 입력해도 되도록 만들어 둔 것인지도 궁금합니다. // 가짜 mutation 만들기 (요청, 응답 모두) const mocks = [ { request: { query: CREATE_BOARD, variables: { createBoardInput: { writer: "철수", title: "안녕하세요", contents: "반갑습니다", password: "1234", }, }, }, result: { data: { createBoard: { _id: "백엔드에서-받은-게시글ID", writer: "철수", title: "안녕하세요", contents: "반갑습니다", }, }, }, }, ];
미해결
[리뉴얼] React로 NodeBird SNS 만들기
SerializableError: Error serializing `.initialState.post.loadPostsError` returned from `getServerSideProps` in "/user/[id]". Reason: `undefined` cannot be serialized as JSON. Please use `null` or omit this value all together. at isSerializable (/Users/js/Desktop/sansbook/node_modules/next/dist/lib/is-serializable-props.js:7:95) at /Users/js/Desktop/sansbook/node_modules/next/dist/lib/is-serializable-props.js:7:503 at Array.every (<anonymous>) at isSerializable (/Users/js/Desktop/sansbook/node_modules/next/dist/lib/is-serializable-props.js:7:304) at /Users/js/Desktop/sansbook/node_modules/next/dist/lib/is-serializable-props.js:7:503 at Array.every (<anonymous>) at isSerializable (/Users/js/Desktop/sansbook/node_modules/next/dist/lib/is-serializable-props.js:7:304) at /Users/js/Desktop/sansbook/node_modules/next/dist/lib/is-serializable-props.js:7:503 at Array.every (<anonymous>) at isSerializable (/Users/js/Desktop/sansbook/node_modules/next/dist/lib/is-serializable-props.js:7:304) 이 에러가 떴는데 user-[id].js에서 getServerSideProps 코드가 잘못되었다는 뜻인가요? 아니면 undefined나 null을 어떻게 처리할것인지.. 잘모르겠습니다
미해결
나도코딩의 자바 기본편 - 풀코스 (20시간)
이렇게 뜨는데 해결 방법을 알려주시면 감사하겠습니다
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
section 19 refresh Token을 공부하면서 새로고침시 토큰을 유지하는 방법에 대해 다음과 같이 알려주셨는데요 const [accessToken, setAccessToken] = useRecoilState(accessTokenState); useEffect(() => { // 1. 기존방식(refreshToken 이전) // console.log("지금은 브라우저다!!!!!"); // const result = localStorage.getItem("accessToken"); // console.log(result); // if (result) setAccessToken(result); // 2. 새로운방식(refreshToken 이후) - 새로고침 이후에도 토큰 유지할 수 있도록 void getAccessToken().then((newAccessToken) => { setAccessToken(newAccessToken); }); }, []); 이게 withAuth가 아닐시의 방법이고 withAuth 일때는 나중에 리뷰해주신다고 했는데, 강의 자료를 살펴보니 따로 적힌 방법이 없어서요. withAuth가 아닐때는 토큰 유지를 어떻게 하나요?
미해결
만들면서 배우는 프론트엔드 DO IT 코딩 (Next.js, Typescript)
fireBase인증 과정에 대하여 질문있습니다. 제가 이해한 것이 맞는지 확인해주시면 감사하겠습니다. 질문 1. (1) try { const signInResult = await signInWithPopup(FirebaseAuthClient.getInstance().Auth, provider); if (signInResult.user) { const idToken = await signInResult.user.getIdToken(); const { uid, displayName, photoURL, email } = signInResult.user; // uid // photoURL // displayName const resp = await memberAddForClient({ data: { uid, displayName: displayName || undefined, email: email!, screenName: email!.split('@')[0], photoURL: photoURL || undefined, provider: 'google', }, token: idToken, }); } signInWithPopup메서드를 통해 구글 로그인 후 로그인 한 유저 정보(signInResult)를 가져옵니다. (2) const idToken = await signInResult.user.getIdToken(); 여기서 accesstoken과 다른 유저정보 email,uid등등을 가져와서 filestore에 저장합니다 (3) export default async function verifyFirebaseIdToken(token: string) { try { const id = await FirebaseAdmin.getInstance().Auth.verifyIdToken(token); return id.uid; } 그후 사용자가 어떤 api요청을 보낼 때 verifyFirebaseIdToken 함수에에 있는 verifyIdToken메서드를 통해 아까 받은 accesstoken을 보내 토큰이 유효한지 검사합니다. accessotken이 유효하면 id를 주어 api에 함께 보내 api 요청을 성공시킵니다. 이 과정이 맞나요? 질문 2. const id = await FirebaseAdmin.getInstance().Auth.verifyIdToken(token); verifyFirebaseIdToken에서 유효성 검사를 할 때 token이 로그인할 때 받은 accesstoken과 동일한 token인가요? 질문 3. firestore에 accesstoken은 저장되어 있지 않던데 어디에 저장되어 있는 건가요? 질문 4. 코드에 accesstoken으로 인증하고 유효성 검사하는 것이 있는데요 따로 refreshToken은 없는데 firebase auth는 refreshtoken 시나리오는 잘 안하나요? 질문 5. 코드에는 브라우저에 쿠키나 로컬스토리지를 사용하지 않음에도 브라우저를 껐다가 다시 켜도 로그아웃 되어있지 않고 로그인이 되어있는데 어떻게 가능한 것인가요? 질문 6. 지금 이 로그인이 흔히 말하는 oauth맞나요?
