173만명의 커뮤니티!! 함께 토론해봐요.
미해결
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
문득 강의 수강 중에 강사님께서 개발자모드를 활성화하면 전체적인 화면이 반응형으로 되어있는데 쭉 수강하다가 제꺼에서는 지정이 안되있어 어느 챕터를 놓쳤는지 감이 안옵니다ㅜㅜ 혹여나 다른 분들도 비슷한 사례가 있을까싶어 여쭈어봅니다.
미해결
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
isLoading 기능을 추가했는데 수정하기, 다이어리 페이지에서 새로고침하면 존재하지 않는 일기입니다. 라고 나오네요. https://github.com/pdh9311/onebite-react 작성했던 코드 입니다. import { Route, Routes } from "react-router-dom"; import "./App.css"; import { createContext, useEffect, useReducer, useRef, useState } from "react"; import Diary from "./pages/Diary"; import Edit from "./pages/Edit"; import Home from "./pages/Home"; import New from "./pages/New"; import Notfound from "./pages/Notfound"; function reducer(state, action) { let nextState; switch (action.type) { case "INIT": return action.data; case "CREATE": nextState = [action.data, ...state]; break; case "UPDATE": nextState = state.map((item) => String(item.id) === String(action.data.id) ? action.data : item ); break; case "DELETE": nextState = state.filter( (item) => String(item.id) !== String(action.data.id) ); break; default: nextState = state; } localStorage.setItem("diary", JSON.stringify(nextState)); return nextState; } export const DiaryStateContext = createContext(); export const DiaryDispathContext = createContext(); function App() { const [isLoading, setIsLoading] = useState(true); const [data, dispatch] = useReducer(reducer, []); const idRef = useRef(0); useEffect(() => { const storedData = localStorage.getItem("diary"); if (!storedData) { setIsLoading(false); return; } const parsedData = JSON.parse(storedData); if (!Array.isArray(parsedData)) { setIsLoading(false); return; } let maxId = 0; parsedData.forEach((item) => { if (Number(item.id) > maxId) { maxId = Number(item.id); } }); idRef.current = maxId + 1; console.log(parsedData); dispatch({ type: "INIT", data: parsedData, }); setIsLoading(false); }, []); const onCreate = (createdDate, emotionId, content) => { dispatch({ type: "CREATE", data: { id: idRef.current++, createdDate, emotionId, content, }, }); }; const onUpdate = (id, createdDate, emotionId, content) => { dispatch({ type: "UPDATE", data: { id, createdDate, emotionId, content, }, }); }; const onDelete = (id) => { dispatch({ type: "DELETE", data: { id, }, }); }; if (isLoading) { <div>데이터 로딩중입니다....</div>; } return ( <> <DiaryStateContext.Provider value={data}> <DiaryDispathContext.Provider value={{ onCreate, onUpdate, onDelete }}> <Routes> <Route path="/" element={<Home />} /> <Route path="/new" element={<New />} /> <Route path="/diary/:id" element={<Diary />} /> <Route path="/edit/:id" element={<Edit />} /> <Route path="*" element={<Notfound />} /> </Routes> </DiaryDispathContext.Provider> </DiaryStateContext.Provider> </> ); } export default App; import { useContext, useEffect, useState } from "react"; import { useNavigate } from "react-router-dom"; import { DiaryStateContext } from "../App"; //커스텀 훅 const useDiary = (id) => { const data = useContext(DiaryStateContext); const [currDiaryItem, setCurrDiaryItem] = useState(); const nav = useNavigate(); useEffect(() => { console.log("useDiary"); const currentDiaryItem = data.find( (item) => String(item.id) === String(id) ); if (!currentDiaryItem) { window.alert("존재하지 않는 일기입니다."); nav("/", { replace: true }); } setCurrDiaryItem(currentDiaryItem); }, [id]); return currDiaryItem; }; export default useDiary;
해결됨
[Live 챌린지] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)
강의자료 다운로드시 위의 메시지로 다운이 되질 않습니다.
미해결
[Live 챌린지] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)
윈도우환경에서 커서를 이용하여 강의를 따라가는중인데 cursor에서 커밋메시지를 작성하고 커밋을하면 한글 인코딩이 깨지는 현상이 발생합니다. ctrl-shift-p 로 select default profile을 통해 기본 터미널을cmd로 변경해도 적용이되지않는것같습니다 커서가 기본 cmd 또는 git bash를 터미널로 사용하도록 설정할수있을까요 ??
해결됨
구조 탐색과 조작의 모든 것 - [DOM 완전 정복 Part 1]
안녕하세요. 좋은 강의 감사합니다! 26. 클래스와 스타일을 다루는 가장 강력한 방법 – classList, style, 그리고 리플로우까지 에서 인라인 스타일로 스타일을 바꾸면 리플로우/리페인트가 자주 발생할 수 있어 성능에도 안 좋을 수 있다고 설명하셨는데요. 예시로 들어주신 코드에서는 어차피 자바스크립트 엔진이 싱글 스레드라 클래스든 인라인 스타일이든 모두 반영된 후에, 리플로우/리페인트가 발생하기 때문에 성능적으로는 유의미한 차이가 없을 것 같은데요. 좀 더 구체적인 설명을 해주실 수 있을까요? ChatGPT 답변도 같이 첨부합니다. https://chatgpt.com/share/69181628-34d0-8007-8e81-02401c649370
미해결
비전공자를 위한 진짜 입문 올인원 개발 부트캠프
그랩님, 강의 잘 듣고 있습니다. 다름이 아니라 궁금한 사항( =에러 해결방법 ) 이 필요해서 글을 남기게 되었습니다. 101강 에서 Axios 에러(400) 가 안드로이드 스튜디오 에뮬레이터에서 발생 하고 이어 아래의 추가 사진2 에서 보시다시피 502 Bad Gateway가 발생 하여 어떻게 해결 할 수 있는지 에 대해 알고 싶어서 질문 드립니다. 일단 101강 처음부터 ~ 4분 52초까지 그랩님께서 작성하신 소스코드를 똑같이 작성 후 결과 를 보려하는데, 농구공 그림 (세부사항:판매자:그랩,가격,상품명등등) 이 나오지 않아 서 이것을 어떻게 하면 그랩님과 같은 결과를 볼 수 있을지에 대해 여쭈어봅니다. 사진 1 첨부 : 판매되는 상품들 밑에 100강만 들었을 시에 농구공 화면이 잘 나왔으나 101강 4분 52초까지 의 내용의 소스코드를 입력 후 결과값 보면 400 에러도 발생하고 농구공도 안나오게 됩니다. 어떻게 해야 하나요? 사진 2 첨부 : ngrok http 8080후 진행 하면, 아래와 같이 502 Bad Gateway라고 뜨는데, 이 에러 의미와 무엇이 잘못된건지 그리고 어떻게 해결 해야 하는지 답변 주시면 좋겠습니다. 이어서 중간에 아래 사진 과 같은 절차 를 겪었었는데요, 필요할 것 같아 참고 로 스샷을 첨부합니다. axios 설치 후 grab-market-mobile에서 npm start하니 다른 프로세스에의해 포트 8081이 사용 되고 있는데 8082 포트를 대신 쓸거냐는 질문 에서 y or n 하라는데 y하게 되었는데요 , 이 다음에 어떻게 해야 그랩님 강의와 똑같이 잘 작동할 수 있을까요? 더불어서 또 다른 에러가 발생하는데요, 또 다른 에러는 cmd에서 ngrok http 8080 입력 후 포워딩 주소 를 크롬브라우저에 복사 후 붙여넣으면 , 이전 밑에 질문에서는 정상 작동되었으나 지금 은 아래와 같이 바뀐 에러 가 발생 하였습니다. 해결법을 모르기에 아래에 사진을 첨부합니다. 꼭 답변 부탁 드립니다. 그랩님의 답변 부탁 드립니다.
미해결
죽음의 Spring Batch: 새벽 3시의 처절한 공포는 이제 끝이다.
JobListener 를 구현하면서 동적으로 executionContext 를 밀어 넣을때 설명이 내가 이해한게 맞다면 오타가 발생한 듯 하다. 이렇게 InfiltrationPlanListener를 JobBuilder 의 listener() 메서드로 등록해주면 beforeStep() 메서드에서 동적으로 생성한 데이터를 각 Step에서 참조할 준비가 완료된다. 해당 문구의 작업은 JobExecutionListener 로 동작한 부분으로 beforeStep 이 아닌 beforeJob 에 의해서 동적으로 생성되는게 맞지 아니한가?!
미해결
인프런 클론코딩 Part 1: Next.js와 NestJS로 시작하는 실전 프로젝트
✅ 모든 질문들은 슬랙 채널에서 답변드리고 있습니다. 💡 ”로펀의 인프런 상담소” 슬랙 채널 가입하기 💡 평일중에는 퇴근 이후(저녁 7시)에 답변을 받아보실 수 있고, 주말중에는 상시 답변드리고 있습니다. 강의화면에서 코드를 읽는데 클릭하실 때 화면이 울렁거려 심히 신경쓰이고 더구나 클릭하면 주변 크기가 늘어나는게 아니라 오히려 줄어드니까 글 읽기가 더 힘드네요...반드시 개선해주셨으면 합니다.
미해결
[4주 과정] <밑바닥부터 시작하는 웹 브라우저> 완독 챌린지
안녕하세요. 목차를 살펴보다가 이상한 점을 발견해서 문의합니다. (책 맨 앞의 목차가 아니라 "목차 메뉴"의 출력이 이상해서 문의합니다.) 저는 알라딘에서 전차잭으로 구매했는데 홈페이지 상세 페이지에서는 순서가 제대로 잘 나와있는 것 같은데... 제 전자책에서는 목차가 이상하게 출력됩니다. 챕터10 -> 파트4(300페이지) 챕터14~17까지 순서대로 나오다가 -> 챕터 11~13까지 나옵니다. 이건 해당 구매처로 문의해야 하는 걸까요?
미해결
죽음의 Spring Batch: 새벽 3시의 처절한 공포는 이제 끝이다.
킬구형 ㅎㅇ 요즘 형 spring-batch 오픈소스 이슈에서 잘 보고 있어. 진짜 형 대단한 거 같아. 형 그런데 나는 궁금한 게 있어 일단 이번에 나도 간단한 오타 수정으로 기여를 하기는 했는데 나도 이슈를 한번 찾아보고 싶은데 감이 안 잡혀서 형은 보통 이슈를 어떻게 찾는지, 아니면 오픈소스를 볼 때 팁 같은 게 있는지 궁금해.
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
안녕하세요. 좋은 강의 들으며 많은 것을 배우고 있어서 감사히 생각하고 있습니다. 그런데 강의 들으면서 작성한 코드 (예를 들면 감정 일기장 코드)를 제 github repository에 public으로 올려도 되나요? 답변해주시면 감사합니다.
미해결
스프링 부트와 리액트로 구현하는 소셜 로그인
사용자 등록 번호가 없습니다. 거의 대부분의 수강생이 없을거라고 생각 되는데 이 경우는 어떻게 해야하는지 설명 부탁드립니다.
미해결
김영한의 실전 자바 - 중급 2편
안녕하세요, 강사님. 현재 자바 중급 2편을 이번 주 내로 수강 완료할 예정인 수강생입니다. 인프런에 올라와 있는 ‘김영한의 자바 공부법 로드맵’에서는 자바 고급 1, 고급 2를 뒤로 미루고 스프링 강의로 먼저 넘어가는 흐름을 추천해 주셨는데, 영상으로 올려주신 ‘김영한의 실전 자바 로드맵’에서는 자바 고급 1은 6강까지, 자바 고급 2는 전부 수강한 뒤 스프링으로 넘어가는 것이 최적이라고 말씀해 주셔서 두 로드맵 중 어떤 흐름을 따르는 것이 좋을지 고민되어 질문드립니다. 저의 목표는 다음과 같습니다. 올해 안에 「스프링 핵심 원리 - 기본편」까지 들어가는 것 스프링을 활용해서 직접 무언가를 개발해 보는 것 다만, 스프링을 빨리 배우고 싶으면서도 자바 기본기와 객체 지향에 대한 공부를 소홀히 하고 싶지는 않아서 인프런 로드맵처럼 자바 고급 1, 2를 건너뛰고 스프링으로 넘어가도 괜찮은 선택인지 확신이 서지 않습니다. 제 상황에서는 어느 로드맵 흐름을 따르는 것이 더 좋을지,자바 고급 1, 2를 어느 정도까지 수강한 뒤 스프링으로 넘어가는 것이 좋을지 추천해 주실 수 있을까요?
미해결
스프링 부트와 리액트로 구현하는 소셜 로그인
OAuthAttributes와 CustomOAuth2User 간의 차이가 궁금합니다. OAuthAttribute는 google로부터 받은 사용자 정보를 우리가 원하는 대로 확장 가능하게 하는 DTO라고 말씀해주셨고, CustomOAuth2User도 google로부터 받은 데이터 외에 별도의 사용자 정보를 추가하는 용도라고 말씀해주셨는데, 두 설명이 같은 의미처럼 느껴집니다. 두 클래스가 어떤 차이가 있는 건가요?
미해결
실전! 코틀린과 스프링 부트로 도서관리 애플리케이션 개발하기 (Java 프로젝트 리팩토링)
안녕하세요 강사님 취준생으로써 강의 들으면서 궁금한 점 질문 드립니다. 1.CustomRepository형식 과 Impl 형식이 보통 어떨때 자주 쓰이는 지 궁금해서 질문 드립니다. 2.JPA 에서 작성한 것들을 Querydsl 로 바꿀때가 그럼 ByXxx 에서 조인조건이 두개이상 들어가면 무조건 Querydsl 자바코드로 바꾸어 주는 게 좋을까요?
해결됨
비전공자를 위한 진짜 입문 올인원 개발 부트캠프
그랩님, 강의 잘 듣고 있습니다. 다름이 아니라 궁금한 사항( =에러 해결방법 ) 이 필요해서 글을 남기게 되었습니다. 101강 에서 Axios 에러(400) 가 안드로이드 스튜디오 에뮬레이터에서 발생 하고 이어 아래의 추가 사진2 에서 보시다시피 502 Bad Gateway가 발생 하여 어떻게 해결 할 수 있는지 에 대해 알고 싶어서 질문 드립니다. 일단 101강 처음부터 ~ 4분 52초까지 그랩님께서 작성하신 소스코드를 똑같이 작성 후 결과 를 보려하는데, 농구공 그림 (세부사항:판매자:그랩,가격,상품명등등) 이 나오지 않아 서 이것을 어떻게 하면 그랩님과 같은 결과를 볼 수 있을지에 대해 여쭈어봅니다. 사진 1 첨부 : 판매되는 상품들 밑에 100강만 들었을 시에 농구공 화면이 잘 나왔으나 101강 4분 52초까지 의 내용의 소스코드를 입력 후 결과값 보면 400 에러도 발생하고 농구공도 안나오게 됩니다. 어떻게 해야 하나요? 사진 2 첨부 : ngrok http 8080후 진행 하면, 아래와 같이 502 Bad Gateway라고 뜨는데, 이 에러 의미와 무엇이 잘못된건지 그리고 어떻게 해결 해야 하는지 답변 주시면 좋겠습니다. 그랩님의 답변을 기다립니다.
미해결
개발 역량 + 자격증까지, Java로 PCCP 자격증 준비하기
응시권을 신청하면 올해 무조건 시험 신청을 해야하는건가요? 사용기간이 있는걸까요?
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
감정일기장 최종완성본 링크는 어디에있나요??
해결됨
AI시대의 웹개발 : 비동기 프로그래밍과 데이터 통신 최적화(프롱트 특강)
자바스크립트는 싱글 스레드 언어라고 알고 있습니다. 자바스크립트 자체적으로 실행하지 못하고 Node나 브라우저에서 실행해야 되는데 브라우저에서 실행할 경우 선생님께서 가르쳐주신 콜스택, Callback Queue, WebpAPI 모듈이 EventLoop를 통해 멀티스레드처럼 동작한다고 이해했습니다. 여기서 질문이 있는데요. SetTimeout에서의 콜백이 WEB API에게 던져놓고 시킬 때, 싱글스레드 녀석은 CallStack에서 일한다고 바쁜데 언제 SetTimeout 콜백을 처리하나요? WEB APIs가 콜백을 따로 처리한다는 건 또 다른 스레드가 존재한다는 의미인가요? 그러면 싱글스레드인척하는 멀티스레드인셈인가요?? ㅎㅎ;
해결됨
비개발자 4주만에 수익화 서비스 만들기: AI 바이브코딩 웹 + 앱 ALL IN ONE
[진도] 실용적인 도구 만들기 1: 개인 비용 관리 앱 (Supabase, 로그인 기능) [질문] 강의에서는 supabase 를 사용해서 카카오 로그인을 추가 했으나 현재 lovable 에서는 업데이트가 되어서 ai 로 명령시 supabase 를 추가로 연결 하지 않고 자동 Lovable Cloud 기능을 탑재합니다. 이경우 카카오 기능 추가를 명령하면 아래와 같이 지원이 안된다고 나옵니다. 그럼 supabase 추가로 연결 해야하나요? 카카오 로그인은 Lovable Cloud에서 기본 지원하지 않습니다. 현재 사용 가능한 소셜 로그인은 다음과 같습니다: 지원되는 소셜 로그인: Google ✅ (현재 활성화됨) GitHub Facebook Apple Discord Twitter Slack Spotify 카카오 로그인을 원하시면 커스텀 OAuth 구현이나 카카오 REST API를 직접 연동해야 하는데, 이는 복잡한 작업입니다. 추천 방안: 구글 로그인 사용 (대부분의 한국 사용자가 구글 계정 보유) 이메일/비밀번호 로그인 사용 카카오 로그인은 Lovable Cloud에서 기본 지원하지 않습니다. 현재 사용 가능한 소셜 로그인은 다음과 같습니다: 지원되는 소셜 로그인: Google ✅ (현재 활성화됨) GitHub Facebook Apple Discord Twitter Slack Spotify 카카오 로그인을 원하시면 커스텀 OAuth 구현이나 카카오 REST API를 직접 연동해야 하는데, 이는 복잡한 작업입니다. 추천 방안: 구글 로그인 사용 (대부분의 한국 사용자가 구글 계정 보유) 이메일/비밀번호 로그인 사용
