173만명의 커뮤니티!! 함께 토론해봐요.
해결됨
한 입 크기로 잘라먹는 Next.js
혹시 강의를 처음에는 쭉 보면서 따라하거나 정리하고 다시한번 한입 북스를 스스로 만들어보면서 nextjs흐름을 파악하면서 잘 모르겠거나 막히는 부분 강의 다시 한번 듣고 소스 코드 보고 이렇게 듣는 방식이 젤 괜찮은가요?? 아니면 스타일링이나 단순 리액트 컴포넌트를 구성하는 부분은 혼자서 해보고 강의를 듣는 방식이 더 나을까요?? 감사합니다
미해결
기획자님 이 정도 웹 개발은 배워보면 어떨까요? [이론+실습]
StockList 만들기 중 404 ERR_BAD_REQUEST 에러 발생하여 한참 구글링 해보다가 아래의 방법으로 해결하였습니다. 혹시 같은 에러 있으신 분들 참고하세요 보안 이슈땜에 proxy 설정 필요합니다. 1) npm install http-proxy-middleware --save 2) src 폴더에 setupProxy.js 생성 후 아래 내용 복사 const { createProxyMiddleware } = require("http-proxy-middleware"); module.exports = function (app) { app.use( "/api", createProxyMiddleware({ target: " http://localhost:3000 ", changeOrigin: true, }) ); };
미해결
기획자님 이 정도 웹 개발은 배워보면 어떨까요? [이론+실습]
BMI 계산기 프로그램 완성하기 5:14 ~ APP.vue 파일에서 <router-view></router-view> main.js 파일에서 import { createApp } from 'vue' import App from './App.vue' import router from './router' createApp(App) .use(router) .mount('#app') 작성하면 선생님이 보여주신 거처럼 하단에 HomePage가 나와야 하는데 저는 HomePage 가 나오지 않아요. BMI를 눌러도 BMI 가 나오지 않습니다. BMI를 클릭하면 BMI를 클릭하면 path만 변경되지 다른 반응이 나오지 않습니다. 코드는 제가 직접 적진 않았고 선생님이 작성해준 코드를 그대로 넣었습니다 index main app.vue
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
삭제하기 강의 까지 들었는데 따로 데이터를 삭제하지 않았어도 새로고침을 하면 기본 mockData들만 다시 화면에 나타납니다. 새로 고침을 해도 이전 데이터들이 그대로 나오게 하려면 어떻게 해야 하나요?
미해결
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
const Header = () => { return { <header> <h1>header</h1> </header> }; }; 위의 코드 작성시 속성 할당이 필요합니다. 선언 또는 문이 필요합니다. 식이 필요합니다. 선언 또는 문이 필요합니다. 이 4가지 에러가 표시됩니다.
해결됨
React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드
문의하기에서 접수 완료 후 (현재 기본 로컬~문의완료되었습니다.) 알럿 뜨는거 저번에 배운 게시글 처럼 넣어서 이쁘게 꾸며도 사용상 문제없는거 맞죠? 만약에 참고할만한 알럿 다른 라이브러리나 깃허브 같은건 보통 실무에서 어떻게 참조하나요? 몽고DB랑 AWS_S3로 저희가 이미지 및 데이터를 저장하잖아요, 그럼 실무에서는 그냥 도메인 및 호스팅만 따로 구매해서 넘겨드리고 사용 하시면 된다고 하면서 넘겨드리고, 몽고DB 및 AWS_S3는 제가 한 계정(제 개발계정)에 같이 폴더만 나눠서 관리하는 식으로 많이하나요? 궁금합니다.
해결됨
아바타 커뮤니티앱 만들기 (React Native Expo)
챗지피티와; 강의 다시 보는데도; 해결이 안되어 문의드려요 ㅠㅠ
해결됨
핵심만 골라배우는 JavaScript
document.forms에서 [0]은 뒤에 왜 붙는 건가요???
미해결
Next + React Query로 SNS 서비스 만들기
회원가입 후 로그인 된 상태로 home으로 이동하게 되는데 여기서 useSession정보가 업데이트 되지않아서 Props로 session정보를 넘겨주는 방식으로 사용하셨는데 다르게 처리하는 방법도 있을까요 ? 예를 들면 로그인 모달에서 했던 것 처럼 서버액션을 사용하지 말고 클라이언트 컴포넌트에서 fetch 를 처리한 후 replace(/home) 시키는 방법이요 !
미해결
처음 만난 리액트(React)
Chapter 5 실습을 하고 있습니다. 작성한 코드를 컴파일하면 유저의 이름과 댓글이 한 줄에 출력되고 있는데 코드에서 어디를 잘못 작성한걸까요?? 여러번 강의 영상을 돌려봤는데 못 찾겠네요 ㅠㅜ
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
const onClickLoad = async (event: MouseEvent<HTMLDivElement>) => { const IMP = window.IMP; IMP.init("imp00000000"); //실제로는 강의자료에 있는 식별코드 사용했습니다! IMP.request_pay( { pg: "kakaopay", pay_method: "card", name: "아이리버 무선 마우스 외 1개", amount: 10000, buyer_email: "이메일@gmail.com", buyer_name: "홍길동", buyer_tel: "010-4242-4242", buyer_addr: "서울특별시 강남구 신사동", buyer_postcode: "01181", m_redirect_url: "/", }, function (rsp: any) { if (rsp.success) { alert("결제가 성공했습니다."); console.log(rsp); } else { alert("결제에 실패했습니다."); } }, ); }; 위와 같은 코드로 정상적으로 rsp를 받고, imp_uid 까지 받았습니다. 그런데 graphql api 호출을 했더니 _id 가 null이라는 에러가 계속해서 발생하네요. 챗gpt 도움을 받아보니, 백엔드가 impUid 를 기반으로 결제 정보를 조회하고 DB에 적립하는 로직이 정상적으로 동작하는지 확인해야한다고 하는데, 에러원인이 무엇이고,어떻게 해결해야 하는지 알려주세요! 포트원 가맹점 식별코드는 강의 자료에 있는 식별코드를 사용했습니다!
해결됨
React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드
안녕하세요 선생님 강의 잘들었습니다! 마지막 영어 및 다국어 변환만 들으면 벌써 완강이네요 감사합니다 :) 전체적으로 코드를 보다가 궁금증이 있어서 문의합니다. 코드 정리하면서 기능 하나씩 눌러보니, 1. 회원가입 페이지가 저희 프로젝트에는 없어서 몽고db에 수동으로 등록하면서 진행했잖아요 이부분을 회원가입으로 어떻게 연동하는지 궁금합니다. 2. 실무에서 사용하는 강의라고 하셨는데 이부분은 실무에서 저희 프로젝트처럼 진행하면 어떻게 설명하는지도 궁금합니다. "로그인이 다른곳에되어있습니다" 이렇게 어드민에 뜨게 되면 지금이야 저희가 몽고db에 들어가서 false로 변경하면 들어가지긴하나, 이걸 온라인에 배포한다고 하면 어떻게 실무적으로 처리하나요??
미해결
코드로 배우는 React 19 with 스프링부트 API서버
package com.example.backend.mallapi.dto; import lombok.Builder; import lombok.Data; import java.util.List; import java.util.stream.Collectors; import java.util.stream.IntStream; @Data public class PageResponseDTO<E> { private List<E> dtoList; private List<Integer> pageNumList; private PageRequestDTO pageRequestDTO; private boolean prev, next; private int totalCount, prevPage, nextPage, totalPage, current; @Builder(builderMethodName = "withAll") public PageResponseDTO(List<E> dtoList, PageRequestDTO pageRequestDTO, long totalCount) { this.dtoList = dtoList; this.pageRequestDTO = pageRequestDTO; this.totalCount = (int)totalCount; int end = (int)(Math.ceil( pageRequestDTO.getPage() / 10.0 )) * 10; int start = end - 9; int last = (int)(Math.ceil((totalCount/(double)pageRequestDTO.getSize()))); end = end > last ? last: end; this.prev = start > 1;//1보다 크면 참 밑에 if문 실행. this.next = totalCount > end * pageRequestDTO.getSize(); this.pageNumList = IntStream.rangeClosed(start,end).boxed().collect(Collectors.toList()); // start부터 end까지 연속된 숫자 스트림(IntStream)을 생성 // rangeClosed(a, b): a부터 b까지 포함 // IntStream은 기본형 int 스트림이기 때문에, // 객체형 리스트(List<Integer>)로 변환하기 위해 .boxed()를 사용. // 스트림을 리스트로 변환하는 역할 if(prev) { this.prevPage = start -1; } if(next) { this.nextPage = end + 1; } this.totalPage = this.pageNumList.size(); this.current = pageRequestDTO.getPage(); } } 위에 코드를 옆에처럼 디버깅할려면( https://www.youtube.com/watch?v=OHrLRg150As ) 즉 step over로 사용도 하면서 한 줄 한 줄 씩 어떻게 실행되는 지 보고 싶은데 아래와 같이 에러가 나옵니다. 혹시 스프링부트를 사용하면 디버거 모드가 활성화가 안되나요? 아래 사진을 보시면 38번째 줄에 브레이크 포인트 표시 해놨고 우측 상단에 디버그 모드도 실행되어있는데 중앙에 네모박스처럼 step over 모드가 비활성화 되어있습니다. 한 줄 한줄씩 디버깅을 할려면 어떻게 해야하는지 궁금합니다.
미해결
[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
피그마로 들어갔는데 과제관련한 회원가입을 찾을 수가 없어요. 그리고 섹션을 살펴봤는데요 여긴 섹션3번인데 안보이네요.. 제가 못찾고 있는것 같은데요
해결됨
React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드
코드가 조금 다른 것 같습니다. 2. 문의하기 누르면 어드민으로 문의하기가 넘어가고 어드민으로 들어왔을때 확인 되어야하는거죠? 제가 놓친 것 같아서 깃허브를 찾아서 복사 붙여넣기하니, 아래 처럼 뜹니다. 저희가 이걸 배운적이 있나요? 있다면 어느 부분인지 궁금합니다. import ContactLocale from "../../Locale/Contact.json"; [plugin:vite:import-analysis] Failed to resolve import "../../Locale/Contact.json" from "src/Page/Contact/Contact.jsx". Does the file exist? C:/Users/shin/Desktop/company_website/frontend/src/Page/Contact/Contact.jsx:4:26 19 | import { motion } from "framer-motion"; 20 | import axios from "axios"; 21 | import ContactLocale from "../../Locale/Contact.json"; | ^ 22 | const Contact = () => { 23 | _s();
미해결
한 입 크기로 잘라먹는 Next.js
사내 환경에서 외부 인터넷은 프록시를 통해 접속 가능합니다. 백엔드 서버 구축시 npm install 수행시 prisma engine을 다운로드 받을수 없다는 메시지가 나옵니다. Downloading Prisma engines for Node-API for windows [ ] 0%Error: request to https://binaries.prisma.sh/all_commits/acc0b9dd43eb689cbd20c9470515d719db10d0b0/windows/schema-engine.exe.sha256 failed, reason: 엔진을 수작업으로 다운로드 받아 참조 할수 있는 방법이 없을까요
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
강의 19:07까지 따라하다가 오류가 갑자기 많이 뜨는데 어디에서 잘못된 것인지 모르겠습니다.. . DiaryList.jsx import "./DiaryList.css"; import Button from "./Button"; import DiaryItem from "./DiaryItem"; const DiaryList=({data})=>{ return <div className="DiaryList"> <div className="menu_bar"> <select> <option value={"latest"}>Newest</option> <option value={"oldest"}>Oldest</option> </select> <Button text={"write new diary"} type={"POSITIVE"} /> </div> <div className="list_wrapper"> {data.map((item)=><DiaryItem key={item.id} {...item}/>)} </div> </div>; }; export default DiaryList; DiaryItem.jsx import {getEmotionImage} from "../util/get-emotion-image"; import Button from "./Button"; import "./DiaryItem.css"; const DiaryItem=({id,emotionId,createdDate,content})=>{ return (<div className="DiaryItem"> <div className={`img_section img_section_${emotionId}`}> <img src={getEmotionImage(emotionId)}/> </div> <div className="info_section"> <div className="created_date"> {new Date(createdDate).toLocaleDateString()}; </div> <div className="content">{content}</div> </div> <div className="button_section"> <Button text={"수정하기"} /> </div> </div> ); }; export default DiaryItem; App.jsx import './App.css' import{useReducer,useRef,createContext} from "react"; import {Routes,Route} from "react-router-dom"; import Home from "./pages/Home"; import Diary from "./pages/Diary"; import New from "./pages/New"; import Edit from "./pages/Edit"; import Notfound from "./pages/Notfound"; const mockData=[ { id:1, createdDate:new Date("2025-02-18").getTime(), emotionId:1, content:"1번 일기 내용", }, { id:2, createdDate:new Date("2025-02-17").getTime(), emotionId:2, content:"2번 일기 내용", }, { id:3, createdDate:new Date("2025-01-15").getTime(), emotionId:3, content:"3번 일기 내용", }, ]; function reducer(state,action){ switch(action.type){ case "CREATE": return [action.data,...state]; case "UPDATE": return state.map((item)=> String(item.id)===String(action.data.id) ?action.data : item ); case "DELETE": return state.filter( (item)=>String(item.id)!==String(action.id) ); default: return state; } } export const DiaryStateContext=createContext(); export const DiaryDispatchContext=createContext(); function App() { const [data,dispatch]=useReducer(reducer,mockData); const idRef=useRef(3); //새로운 일기 추가 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", id, }); }; return ( <> <DiaryStateContext.Provider value={data}> <DiaryDispatchContext.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> </DiaryDispatchContext.Provider> </DiaryStateContext.Provider> </> ); } export default App
해결됨
React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드
저희가 수업진행하면서 프론트엔드,백엔드에 많은 npm으로 설치하잖아요. 이런 라이브러리들을 매번 새로운 프로젝트마다설정해야할까요?? 비슷한 작업을 뽑아낸다고할때 기존 지금 폴더를 다시 연 다음에 이미지 및 텍스트 수정할때말고 다시 비슷한 프로젝트 폴더를 만들어서 한다고 하면 반드시 다시 전부 깔아야하는거죠? ㅠㅠ
해결됨
아바타 커뮤니티앱 만들기 (React Native Expo)
질문이 많아 죄송합니다 선생님 ㅠㅠ 아래와 같이 오류메시지가 발생됩니다,,
해결됨
Azure Native로 나만의 GPT 만들기
안녕하세요 , 수강 잘 들었습니다 ㅎㅎ 강의 커리큘럼을 다 수강 완료 해서 Azure function을 활용한 SaaS 방식의 서비스를 쫌더 깊게 이해하는 시간을 가졌구요 제가 지금 기존 강의 내용에 살을 더 붙여 langChain 기반으로 Rag를 적용 시켜서 개발을 완료한 상태 입니다. 근데 여기서 문제가 되는 부분이 로컬에서는 기능을 잘 수행을 하는데 agent 함수를 배포를 하게 되면 에러가 뜨는지 , 기능을 수행하지 못합니다. 서비스 버스에 메시징은 잘 쌓이는데 agent function 에서 그 메시징 리퀘스트도 받질 못하는거 보니 , 런 타임에서 에러가 난거 같은데 해당 함수 Application Insights 대쉬 보드에서 확인하려니 뭐가 뭔지 알수가 없더라구요 ... 서버 로그를 확인 하고 싶은데 혹시 어떤 방법으로 이런 트러블을 해결할수 있을까요 ...
