173만명의 커뮤니티!! 함께 토론해봐요.
미해결
따라하며 배우는 리액트 A-Z[19버전 반영]
영화 상세페이지 구현에서 className으로 modal_poster-img를 주니까 다른 곳에 있던 css가 적용되는데 위에 import하지 않아도 가능한건가요??
미해결
[리뉴얼] 처음하는 파이썬 데이터 분석 (쉽게! 전처리, pandas, 시각화 전과정 익히기) [데이터분석/과학 Part1]
section 9 듣다가 피벗테이블 질문있어요 코드 : doc_covid2 = pd.pivot_table(doc_covid, index=['Country_Region'], values=['Confirmed'], aggfunc={'Confirmed': 'sum'}, fill_value=0, margins=True, margins_name='Total' ) 같은 경우 말그대로 doc_covid 에서 피벗테이블을 만드는데 Country_Region 에 대해서 Confirmed 를 더한 값을 컬럼으로 만드는 내용이잖아요 혹시 여기서 열을 추가 하는게 가능한 건가요?? Confirmed의 median 값을 컬럼으로 만드는 열을 추가 하고 싶은데 가능한건지요 ... 라고 질문글을 썼는데 혹시 몰라 그냥 구글에 검색하니까 aggfunc=['sum','median'] 이라 쓰면 됐었네요... 다른 분들에게도 도움 되시라고 그냥 남깁니다.
미해결
스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 위처럼 join_membership하면 체크표시가 뜨고 한글로 작성하면 No tests were found라고 뜨는 이유는 뭔지 궁금합니다
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
그리드 부분 영상에서 헷갈리는 부분이 있습니다. 그리드 강의 영상에는 밑에 이미지처럼 grid-column: 1 / 3 부분이 첫번째 라인에서 시작해서 3번라인에서 끝난다고 하는데 사이부분까지 해서 4개의 라인이 되서 grid-column: 1 / 3이 아니라 1 / 4 가 아닌가요? 혹시 몰라 노션을 보니 노션은 1 / 4라고 되어있던데 뭐가 맞는 것인지 너무 헷갈립니다.
해결됨
Next + React Query로 SNS 서비스 만들기
안녕하세요 제로초님 강의를 듣던 중 궁금한 것이 있어서 여쭈어 봅니다. 강의에서는 데이터를 mutation으로 리페칭 후 if (queryClient.getQueryData(["posts", "recommends"])) { queryClient.setQueryData( ["posts", "recommends"], (prevData: { pages: Post[][] }) => { const shallow = { ...prevData, pages: [...prevData.pages], }; shallow.pages[0] = [...shallow.pages[0]]; shallow.pages[0].unshift(newPost); return shallow; } ); } 이런 식으로 데이터를 업데이트 해주었는데, 이 부분을 아래와 같이 queryClient.invalidateQueries({ queryKey: ["posts", "recommends"] }); 이런 식으로 업데이트를 하면 어떤 차이점이 있나요 ?? 데이터 업데이트시 쿼리를 업데이트 하고 리페칭하는 동작은 같은 것 같은데, 강의에서와 같이 복잡한 데이터 구조를 복사 해가며 구현하는 이유가 궁금합니다. 성능상의 차이가 있는 것인가요 ??
미해결
Next + React Query로 SNS 서비스 만들기
로그인 버튼을 클릭하면 우선 '/login' 주소로 이동했다가 'i/flow/login'으로 이동하기 때문에 이때 '/login'에서 배경이 메인 컴포넌트를 보여줘야 메인 페이지가 바탕이 되고로그인 모달 창을 띄운다는 점은 이해했습니다. 따라서 app/(beforeLogin)/login/page.tsx 에서 Main 컴포넌트를 보여주도록 했습니다. export default function Login() { const router = useRouter(); router.replace("/i/flow/login"); return <Main />; } 문제는 '/i/flow/login' 에서 새로고침하면 모달 창은 그대로지만 배경은 메인 페이지가 아닙니다. 이때 아래와 코드와 같이 따로 Main 컴포넌트를 불러오면 새로고침 시, 배경은 메인 페이지로 잘 나옵니다.그런데 강의와 깃허브 코드를 보니 LoginModal 컴포넌트만 보여주고 있습니다. LoginModal 컴포넌트만 있어도 app/(beforeLogin)/page.tsx에서 Main 컴포넌트를 보여주고 있으므로 app/(beforeLogin)/layout.tsx에서 Main 컴포넌트가 {children}에 할당된다고 생각했습니다. 따라서 아래 코드에서 Main 컴포넌트가 없어도 배경은 메인 페이지가 나온다고 생각했습니다. 아래 코드와 같이 Main 컴포넌트가 있으면 새로고침 시, 메인 페이지가 배경이 되고 그 위에 로그인 모달창이 띄워지지만 Main 컴포넌트가 없으면 새로고침 시, 메인 페이지가 빈 페이지가 나옵니다. 여기서 Main 컴포넌트를 넣어서 해결해도 되는건지 의문이 들었습니다. 아래 코드에서 Main 컴포넌트를 넣지 않으면 Main 페이지가 어떻게 배경으로 보여지는 건지 알고 싶습니다! import LoginModal from "@/app/(beforeLogin)/@modal/(.)i/flow/login/page"; import Main from "@/app/(beforeLogin)/_component/Main"; export default function Page() { return ( <> <LoginModal /> <Main /> </> ); }
미해결
스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] <!DOCTYPE HTML> <html xmlns:th="http://www.thymeleaf.org"> <body> <div class="container"> <form action="/members/find" method="post"> <div class="form-group"> <label for="name">찾기</label> <input type="text" id="name" name="name" placeholder="이름을 입력하세요"> </div> <button type="submit">찾기버튼</button> </form> </div> <!-- /container --> </body> </html> find.html입니다. <!DOCTYPE HTML> <html xmlns:th="http://www.thymeleaf.org"> <body> <div class="container"> <div> <table> <thead> <tr> <th>#</th> <th>이름</th> </tr> </thead> <tbody> <tr th:each="member : ${members}"> <td th:text="${member.id}"></td> <td th:text="${member.name}"></td> </tr> </tbody> </table> </div> </div> <!-- /container --> </body> </html> memberfind.html 입니다 memberController.java 입니다 @GetMapping("members/find") public String find(MemberForm form) { return "members/find"; } @PostMapping("members/find") public String find(Model model) { List<Member> members = memberService.findMembers(); model.addAttribute("members", members); return "members/memberfind"; } } List<Member> members = memberService.findMembers(); 여기 부분을 List<Member> members = memberService.findOne(); 으로 바꾸어야할텐데 ()-> 여기안에 매개변수를 뭘로 해야할까요
미해결
Kevin의 알기 쉬운 Spring Reactive Web Applications: Reactor 1부
안녕하세요. 수업 잘 듣고 있습니다~ 백프레셔 전략 중 DROP과 LATEST 전략은 결국 버퍼가 비워질 때까지 Publsiher에서 emit되는 데이터를 제거(drop or discard)하는 것으로 이해했습니다. 버퍼가 비어지는 시점 이후로 emit되는 데이터를 다시 버퍼에 채운다는 점에서 두 전략은 같은 것으로 보입니다. 차이점을 알려주시면 감사하겠습니다~
미해결
김영한의 자바 입문 - 코드로 시작하는 자바 첫걸음
같은 패키지 내부에 Test.java 와 BusObject.java 가 있습니다. Test에서 BusObject객체를 만들어서 사용하는 것을 테스트하고자 하는데 다음과 같이 에러가 나옵니다. javac BusObject.java Test.java java BusObject.java Test.java (java BusObject Test 도 동일하게 안 됩니다ㅜㅜ) Error: Could not find or load main class week11.BusObject Caused by: java.lang.ClassNotFoundException: week11.BusObject 뭔가 문제인가요..? 지금까지 컴파일할때 week11.하고 패키지도 붙여보고, -classpath . 도 해봤습니다...
미해결
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
커뮤니티 name을 Name1 이렇게 지었으면 http://localhost:3000/r/Name1 이런식으로 바로 넘어가져서 404 page가 뜨는데요 이유가 create.tsx파일 const handleSubmit = async (event: FormEvent) => { event.preventDefault(); try { const res = await axios.post("/subs", { name, title, description }); router.push(`/r/${res.data.name}`); } catch (error: any) { console.log(error); setErrors(error.response.data); } }; 여기서 router.push(`/r/${res.data.name}`); 이 부분때문에 그런건가요? 원래 커뮤니티 등록하면 넘어가지는게 정상인가요? 강의에서는 안넘어가는걸로 보이는데...
미해결
실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화
토이 프로젝트를 진행하던 중 궁금한 내용이 생겨서 질문 드립니다. 과거 Mybatis와 같은 것을 활용해 진행할 때는 코드 매핑 테이블에 코드값 (기본키)과 코드명 이렇게 있고 특정 테이블에서는 이러한 코드 값 키를 들고 있어 서브쿼리를 활용해 코드 명을 가져오는 방식으로 활용했습니다. JPA에서 위 구조를 활용하려면 특정 엔티티에 코드 엔티티를 넣고 서로 연관관계를 걸어 준 후에 fetch join으로 select 하는게 베스트 일까요?
해결됨
Next + React Query로 SNS 서비스 만들기
안녕하세요 제로초님 강의 듣던 중 동작이 원하는대로 안되어서 질문 드립니다. 로그인 후 로그아웃 후 다른 아이디로 로그인 해도 로그아웃 버튼에는 전 계정의 정보가 뜹니다. 아래는 로그인 모달의 코드입니다. "use client"; import style from "@/app/(beforelogin)/_component/login.module.css"; import { ChangeEventHandler, FormEventHandler, useState } from "react"; import { redirect, useRouter } from "next/navigation"; import { signIn } from "next-auth/react"; export default function LoginModal() { const [id, setId] = useState(""); const [password, setPassword] = useState(""); const [message, setMessage] = useState(""); const router = useRouter(); const onSubmit: FormEventHandler<HTMLFormElement> = async (e) => { e.preventDefault(); setMessage(""); try { const response = await signIn("credentials", { username: id, password, redirect: false, }); console.log(response, "1"); router.replace("/home"); console.log("2"); } catch (err) { console.error(err); setMessage("아이디와 비밀번호가 일치하지 않습니다."); } }; const onClickClose = () => { router.back(); }; const onChangeId: ChangeEventHandler<HTMLInputElement> = (e) => { setId(e.target.value); }; const onChangePassword: ChangeEventHandler<HTMLInputElement> = (e) => { setPassword(e.target.value); }; return ( <div className={style.modalBackground}> <div className={style.modal}> <div className={style.modalHeader}> <button className={style.closeButton} onClick={onClickClose}> <svg width={24} viewBox="0 0 24 24" aria-hidden="true" className="r-18jsvk2 r-4qtqp9 r-yyyyoo r-z80fyv r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-19wmn03" > <g> <path d="M10.59 12L4.54 5.96l1.42-1.42L12 10.59l6.04-6.05 1.42 1.42L13.41 12l6.05 6.04-1.42 1.42L12 13.41l-6.04 6.05-1.42-1.42L10.59 12z"></path> </g> </svg> </button> <div>로그인하세요.</div> </div> <form onSubmit={onSubmit}> <div className={style.modalBody}> <div className={style.inputDiv}> <label className={style.inputLabel} htmlFor="id"> 아이디 </label> <input id="id" className={style.input} value={id} onChange={onChangeId} type="text" placeholder="" /> </div> <div className={style.inputDiv}> <label className={style.inputLabel} htmlFor="password"> 비밀번호 </label> <input id="password" className={style.input} value={password} onChange={onChangePassword} type="password" placeholder="" /> </div> </div> <div className={style.message}>{message}</div> <div className={style.modalFooter}> <button className={style.actionButton} disabled={!id && !password}> 로그인하기 </button> </div> </form> </div> </div> ); } 아래는 로그아웃 버튼의 코드입니다. "use client"; import { useRouter } from "next/navigation"; import style from "./logoutButton.module.css"; import { signOut } from "next-auth/react"; import { Session } from "@auth/core/types"; type Props = { me: Session | null; }; export default function LogoutButton({ me }: Props) { const router = useRouter(); const onLogout = async () => { try { const response = await signOut({ redirect: false, }); console.log("signout", response); router.replace("/"); } catch (err) { console.log(err); } }; console.log("me", me); if (!me?.user) { return null; } return ( <button className={style.logOutButton} onClick={onLogout}> <div className={style.logOutUserImage}> <img src={me.user?.image as string} alt={me.user?.email as string} /> </div> <div className={style.logOutUserName}> <div>{me.user?.name}</div> <div>@{me.user?.email}</div> </div> </button> ); } 로그아웃 버튼에는 알려주신대로 레이아웃의 const session = await auth(); session을 prop으로 내려주어서 사용하였습니다. 처음 test 계정으로 로그인 했을 때의 콘솔을 찍어보면 이렇게 test 계정이 정상적으로 나옵니다. 이후 로그아웃 후에(session token 쿠키는 정상적으로 지워진 상태입니다) test4 계정으로 다시 로그인 하면 이렇게 콘솔에 me 데이터가 test로 찍혀있고 test4의 정보가 로그아웃 버튼에 있습니다. 하지만 서버쪽 콘솔은 이렇게 test4로 나옵니다. 이 상태에서 페이지 새로고침을 하면 정상적으로 로그아웃 버튼에는 test4의 데이터가 다시 들어가게 됩니다. 로그아웃을 누를 때 세션 토큰이 정상적으로 지워지는 것을 확인했고, 재 로그인을 했는데 서버쪽에는 test4데이터가 찍히고 클라이언트 콘솔에는 test데이터가 찍히는 이유가 궁금합니다.. 2. 틀린 아이디 비밀번호를 입력했을 때에 제로초님과 응답이 다르게 날라옵니다. 로그인 시에 틀린 아이디 비밀번호를 입력시에 저는 401에러가 아닌 이런 응답이 날라옵니다. 이 부분은 에러인지 아니면 버전이 달라서 응답이 다른 것 인지는 잘 모르겠습니다. error는 credentialSignIn으로 날라오지만 ok와 status는 true에 200으로 날라오는데, 버전차이인가요 ..? next-auth 버전은 5.0.0-beta.17 입니다.
해결됨
[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)
원핫인코딩 시, 만약에 test 데이터에 train에서 포함하지 않은 값이 있어 컬럼이 하나 더 생기는 상황이 발생한다면 레이블인코딩으로 진행해야 하나요?
해결됨
Next.js 시작하기(feat. 지도 서비스 개발)
현재 next.js 를 생성시킨후, 서버 start를 시킨후, 화면을 수정하면, 화면이 리로딩되고 있지 않습니다. 계속 새로 빌드를 해야지만, 화면 소스가 바꼈을 경우, 리로딩이 되는건가요?
미해결
@Test @DisplayName("쿠폰 여러 명 발급") void 쿠폰_여러_명_발급() throws InterruptedException { int threadCount = 1000; ExecutorService executorService = Executors.newFixedThreadPool(32); CountDownLatch latch = new CountDownLatch(threadCount); for (int i = 0; i < threadCount; i++) { final int threadNumber = i + 1; Integer key = i; executorService.submit(() -> { try { couponService.issueCoupon(param, usersMap.get(key)); } catch (PessimisticLockingFailureException e) { .... } 쿠폰 발급 동시성 처리 관련해서 테스트 코드 작성 간 궁금한 점이 있어서 질문을 올립니다. 구글링해서 작성해봤는데, 제가 이해하는 게 맞나 싶어서요... Executors.newFixedThreadPool(32) 이렇게 설정해주면, 32 개의 고정된 스레드 풀을 생성한다는 것이고 1,000 명의 유저가 해당 스레드 풀이 나눠서 작업이 수행된다는 것인가요 ? 그러니까 하나의 스레드에서 약 31명의 유저를 담당한다는 뜻일까요 ? 아니면 순차적으로 1,000 명의 유저를 하나의 스레드에 한 명씩 배치하여 작업하는 것이고, 실질적으로 한 순간에 32명의 유저만 작업한다는 뜻일까요 ? ㅠㅠㅠ
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
현재 css에서 calc부분에 대해 강의를 보고 있는데 궁금한 점이 처음부터 계산해서 한번에 값을 적으면 되지 왜 calc(100% - 70px) 이런식으로 하는지 궁금합니다.
미해결
따라하며 배우는 리액트 A-Z[19버전 반영]
저장할 때 밑에 코드를 쓰면 에러가 뜹니다ㅠㅠ어떻게 해결해야하나요? const initalTodoData = localStorage.getItem("todoData") ? JSON.parse(localStorage.getItem("todoData")) : []; function App() { const [todoData, setTodoData] = useState([initalTodoData]);
미해결
1시간만에 끝내는 virtual thread in spring boot
https://github.com/openjdk/jdk/pull/17221 이런 내용이 있네요. -Djdk.tracePinnedThreads 보다 JFR 을 권장하는 것 같습니다.
미해결
Next + React Query로 SNS 서비스 만들기
안녕하세요 제로초님 제목처럼 api호출 3초뒤로 하고, loading.tsx 파일이 있을 때 없을때 /home/page.tsx 이런식으로 테스트를 해봤습니다. /home/page.tsx에서는 react-query로 ssr을 적용했고 import style from './home.module.scss' import Tab from "@/app/(afterLogin)/home/_component/Tab"; import TabProvider from "@/app/(afterLogin)/home/_component/TabProvider"; import PostForm from "@/app/(afterLogin)/home/_component/PostForm"; import { HydrationBoundary, QueryClient, dehydrate } from '@tanstack/react-query'; import TabDecider from "@/app/(afterLogin)/home/_component/TabDecider"; import { getPostRecommends } from '@/app/(afterLogin)/_lib/getPostRecommends'; export default async function Home() { const queryClient = new QueryClient(); await queryClient.prefetchInfiniteQuery({ queryKey: ['posts', 'recommends'], queryFn: getPostRecommends, initialPageParam: 0, }); const dehydratedState = dehydrate(queryClient); return ( <main className={style.main}> <HydrationBoundary state={dehydratedState}> <TabProvider> <Tab /> <PostForm /> <TabDecider /> </TabProvider> </HydrationBoundary> </main> ); } /mocks/handlers.tsx에서는 postRecommends를 가져오되 3초 delay를 줬습니다. http.get('/api/postRecommends', async ({ request }) => { console.log('----------------------------------handlers /api/postRecommends'); await delay(3000); const url = new URL(request.url); const cursor = parseInt(url.searchParams.get('cursor') as string) || 0; return HttpResponse.json( [ { postId: cursor + 1, User: User[0], content: `${cursor + 1} ${faker.lorem.paragraph()}`, Images: [{ imageId: 1, link: faker.image.urlLoremFlickr({ category: 'animals' }) }], createdAt: generateDate(), }, { postId: cursor + 2, User: User[0], content: `${cursor + 2} ${faker.lorem.paragraph()}`, Images: [ { imageId: 1, link: faker.image.urlLoremFlickr({ category: 'animals' }) }, { imageId: 2, link: faker.image.urlLoremFlickr({ category: 'animals' }) }, ], createdAt: generateDate(), }, { postId: cursor + 3, User: User[0], content: `${cursor + 3} ${faker.lorem.paragraph()}`, Images: [], createdAt: generateDate(), }, { postId: cursor + 4, User: User[0], content: `${cursor + 4} ${faker.lorem.paragraph()}`, Images: [ { imageId: 1, link: faker.image.urlLoremFlickr({ category: 'animals' }) }, { imageId: 2, link: faker.image.urlLoremFlickr({ category: 'animals' }) }, { imageId: 3, link: faker.image.urlLoremFlickr({ category: 'animals' }) }, { imageId: 4, link: faker.image.urlLoremFlickr({ category: 'animals' }) }, ], createdAt: generateDate(), }, { postId: cursor + 5, User: User[0], content: `${cursor + 5} ${faker.lorem.paragraph()}`, Images: [ { imageId: 1, link: faker.image.urlLoremFlickr({ category: 'animals' }) }, { imageId: 2, link: faker.image.urlLoremFlickr({ category: 'animals' }) }, { imageId: 3, link: faker.image.urlLoremFlickr({ category: 'animals' }) }, ], createdAt: generateDate(), }, ] ); }), 이 후에 ssr화면 테스트를 위해서 브라우저의 자바스크립트 사용중지 했습니다. 서버도 각각 재시작하고 테스트했습니다. 그리고 나서 테스트한 화면입니다. 아래 화면은 loading.tsx가 업을때, 아래 화면은 loading.tsx가 있을때 입니다. 선생님 강의에서 ssr을 적용했을때 loading화면을 포기해야한다고 이해했었습니다. prefetchInfiniteQuqery를 쓰고 loading을 포기하거나, prefetchInfiniteQuqery을 포기하고 loading을 사용하거나. 그런데 제가 테스트했을때는 ssr이라도 로딩 화면이 보이는걸로 봐서 제가 테스트를 잘못한건지, loading.tsx가 있는것 자체가 suspense를 사용한것과 동일한 효과를 주어서 보여지게 되는건지 여쭙고 싶습니다. 제가 잘못테스트했다면 어떻게 테스트를 해야 좀 더 정확히 구분지을 수있을지도 궁금합니다.
미해결
따라하며 배우는 리액트 A-Z[19버전 반영]
List 컴포넌트 생성하기에서 props로 key={ data.id }를 넘겨주는데 저기서는 사용하지 않는데 넘겨주어야 하나요? 빼도 상관 없나요??
