묻고 답해요
131만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[React / VanillaJS] UI 요소 직접 만들기 Part 1
반응형 TextBox 질문입니다.
TextBox2의 경우 제목이 #2. React uncontrolled. canvas 라고 되어 있는데 코드를 보면 단순히 기존 onChange -> onInput으로만 바뀌어 있습니다. 따라서 ref를 사용한 예제로 바뀌면 좋을 것 같습니다.TextBox3 제목에 (자체 제작 방법) 이런 문구도 소괄호로 같이 표시되어 있으면 좋을 것 같습니다.또한 사소하지한 onChange와 onInput에 대한 약간의 차이 같은 설명이 주석이나 자막으로 처리되어 있으면 더욱 좋을 것 같습니다.TextBox5에 스터디를 하신 다른 분이 useImperativeHandle 훅을 사용한 것을 만들어주신 것 같은데 혹시 재남님은 useImperativeHandle을 실제 실무에서 활용하신 사례가 있으신지 궁금합니다.p.s) 매일 오전에 하나씩 보고 있는데 재밌게 보고 있습니다.좋은 강의 감사드립니다~
-
미해결파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트 (장고 4.2 기준)
장고에서 song_detail.html을 찾아가는 이유를 모르겠습니다.
본 강의에서 views.py에 urlpatterns배열을 수업 내용인 song_detail에서 song_ddetail로 바꾸고 실행시켜 보았는데 장고에서는 hottrack/song_detail.html을 찾고 있습니다.urlpatterns에 있는 views.song_detail이 있기때문에 song_detail.html을 찾는게 아닌가용?? 혹시 어떻게 하면 song_ddetail.html과 연결 시킬 수 있을까요?? hottrack / urls.pyfrom django.urls import path, re_path # urlpatterns리스트에 필요한 것. from . import converters # noqa from . import views # view매핑을 위해 임포트. urlpatterns = [ path(route="", view=views.index), path(route="archives/<date:release_date>/", view=views.index), re_path(route=r"^export\.(?P<format>(csv|xlsx))$", view=views.export), path(route="<int:pk>/cover.png", view=views.cover_png), path(route="<int:pk>/", view=views.song_ddetail), ]hottrack/views.pysong_ddetail = DetailView.as_view( # 디테일뷰 구현 model=Song, # 모델인자로 Song지정함. )template song_detail 함수를 song_ddetail로 변경하면 작동이 되지 않는데 이유가 무엇인지 궁금합니다.
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
async와 promise가 결국 같이 쓰일필요가 없다는 뜻인가요?
강의 후반쯤에 "async안에 promise함수를 넣게되면 promise함수 그자체를 반환해서 async는 결국 별다른 기능을 하지않는다" 라고 하셨는데처음 이형태가 async 함수안에 new Promise()를 반환하는것보다 더 이상적인 형태라고 이해해도 될까요??
-
미해결하루만에 배우는 ChatGPT API
CORS 오류
공유해주신 링크 접속 후 파인튜닝 실행시 아래와 같이 CORS 오류가 발생합니다.어떻게 테스트해보면 될까요?
-
미해결코드로 배우는 React with 스프링부트 API서버
repository에 ProductSearch랑 Impl을 작성하셧는데
섹션2 영상에선 TodoSearch랑 TodoSearchImpl 작성한건 어떻게 해야하나요 Todo 삭제하고 이번 수업에 있는 ProductSearch, ProductSearchImpl로 다 바꿔야 하는건가요 ?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
[section07] 포트폴리오 리뷰
안녕하세요 포트폴리오 리뷰 하다보니까 문제가 생겨서 올립니다. 주석 처리가 안된 부분이 코드캠프에서 제공해주신 코드이고, 주석처리한 부분이 제가 직접 짠 코드입니다. 코드캠프에서 제공해주신 코드대로 입력하면 아래와 같은 에러가 발생합니다. 어떻게 해결해야할까요?? grqphql 링크는 https://backendonline.codebootcamp.co.kr/graphql여기 사용했습니다.
-
미해결코드로 배우는 React with 스프링부트 API서버
npm start 하면 발생되는 에러 메시지
(node:8952) [DEP_WEBPACK_DEV_SERVER_ON_AFTER_SETUP_MIDDLEWARE] DeprecationWarning: 'onAfterSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option. (Use `node --trace-deprecation ...` to show where the warning was created) (node:8952) [DEP_WEBPACK_DEV_SERVER_ON_BEFORE_SETUP_MIDDLEWARE] DeprecationWarning: 'onBeforeSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option. 리액트 실행이랑 강의 내용대로 정상적으로 동작 되는데, npm start 를 수행하면 위와 같은 문구가 출력됩니다. 구글에 검색해봤는데 해결 방법과 원인이 다양해서 적합한 해결책을 못찾았습니다. 무시해도 되는 에러일까요? 어떻게 처리하는지 궁금합니다.
-
해결됨[React / VanillaJS] UI 요소 직접 만들기 Part 1
Tooltip의 useStyleInView 훅 질문입니다.
강의에는 positionType이 relative인 경우의 설명만 있어서 시간 여유가 되시면 absolute인 경우의 설명에 대한 보강 영상이 있으면 좋을 것 같습니다~
-
해결됨[React / VanillaJS] UI 요소 직접 만들기 Part 1
이벤트에 대한 타입을 지정할 때 궁금한 점이 있습니다.
보통 window.addEventListener 같은 것을 사용할 때 이벤트 파라미터에 대해서는 Event 타입을 사용하시고, 버튼 같은 클릭 이벤트 리스너의 이벤트 파라미터에 대해서는 SyntheticEvent 타입을 사용하시는 것 같습니다. 보통 클릭이라고 하면 MouseEvent<HTMLButtonElement> 또는 MouseEventHandler로 함수의 타입을 줄 수 있을 것 같은데 SyntheticEvent로 지정하시는 이유가 있으실까요. 대략적으로 SyntheticEvent가 여러 브라우저 등 호환성을 위해 React에서 자체적인 내장 인터페이스로 추상적으로 Vanilla JS의 Event 타입을 확장한 것으로 인지는 하고 있습니다.
-
해결됨파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트 (장고 4.2 기준)
본 강의에서 dj-rest-auth나 django-allauth도 다룰예정인가요?
안녕하세요 강의 잘보고 있습니다. 특히 django template을 이용하여 작업하는 부분에서 도움 많이 되었습니다. django를 학습하면서 궁금한점이 몇 가지 생겨서 여쭤보려고 합니다. 나중에 업로드 되는 DRF 파트에서 dj-rest-auth, django-allauth와 같은 라이브러리를 다루는지 궁금합니다.DRF와 JWT를 이용하여 클라이언트의 react_hook_form + zod와 서버의 django serializer에서 유효성 검사를 진행중입니다. 여기서 서버, 클라이언트 둘 중 한 가지에서만 유효성 검사를 처리하는건 괜찮지만 두 가지 경우에서 유효성 검사를 처리 할때 유효성 검사의 성공 여부와 메세지를 그리는게 생각보다 까다롭더라고요.예를 들어 AUTH_PASSWORD_VALIDATORS 에서 기본 제공되는 유효성 검사를 settings에서 커스텀해서 serializers에 적용하게 된다면 해당 유효성 검사에 사용된 조건들을 추출해낼 수 가 없어서 zod 스키마에는 적용할 수 없었습니다. 따라서 아래 이미지와 같이 직접 전부 커스텀 해서 적용해야 했습니다.클라이언트에서 적절히 걸러내고 아이디 중복체크, 이메일 확인, 최종 유효성 검사 등등 필요한 경우에만 서버에서 유효성 검사를 요하여 트래픽을 줄이려고 하는데 보통 이렇게 처리하는게 맞는건지 궁금합니다.Django Serializers FileNext Typescript zod FileDisplay
-
미해결Next + React Query로 SNS 서비스 만들기
[userName] 같은 이름 설정 문제
[userName]으로 home, compose 이런것들을 사용하면 home이 최우선시 된다고 하셨는데 실제 서비스 환경에서 home이라는 user가 있을 수도 있자나요? 이 경우는 따로 예외처리를 어떻게 하나요? 제 생각은 [userName]으로 바로 접속 못하고 상위 구조가 하나 있으면 해결될거 같은데 추천하시는 방법이 있으신가요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
[React] section5. 에서 질문있습니다.
안녕하세요.학생을 생각해서 너무나 세심하고 친절히 알려주심에 매번 감동받고 감사합니다.섹션5> 05-05-dynamic-routing-board-mutation 에서 에러를 해결 못해서 문의드립니다.route.push 로 페이지 이동을 하는 이 라인에서 자꾸 에러가 발생합니다. (404. not found 에러입니다) 이것저것 다 시도해도 에러가 안 없어지네요 ㅠ코딩은 강의에 나온 대로 그대로 저는 타이핑 한 거 같은데요.어떻게 해야지 정상적으로 dynamic 페이지 이동이 가능할까요?답변 부탁드립니다 ^^
-
미해결Next + React Query로 SNS 서비스 만들기
StrictResponse<any> 질문
[강의 위치]2:43~ [질문]StrictResponse<any> 로 타입을 지정하여 타입 오류를 해결하셨는데 any를 지정하지 않으려면 유저가 존재하지 않을 경우에도 아래와 같이 응답 데이터 구조를 맞춰야 할 것 같은데,일반적으로 found 또는 not found에 대해서 응답 데이터 구조를 맞추는 것이 좋은 방법인가요?const body = { id: "", nickname: "", image: "" }; return HttpResponse.json(body, { status: 404 });
-
미해결Next + React Query로 SNS 서비스 만들기
홈, 유저 프로필 페이지 prefetchQuery 사용 이유
[강의 위치]1:23~ [질문]홈 페이지와 유저 프로필 페이지에서 prefetchQuery를 사용한 이유가 해당 페이지에 왔을 때 미리 데이터를 불러와서 SEO 측면에서 유리함을 가져가기 위해서 썼다고 이해하면 될까요?
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
블로그 글 작성시 이미지 좀 사용하고 싶습니다..
안녕하세요.. 제가 블로그를 쓰는데 강의에서 나오는 이미지 설명이 너무 잘 되있어서 글에 캡처해 넣으려고 하는데 강의링크와 참조내용을 넣으면 가능할까요? 코드는 가져다 쓰지 않습니다..
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
<BrowserRouter> 없이 Link to를 쓰면 에러가 납니다.
🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요 강의 정말 감사히 잘듣고 있습니다!라우트 관련해 질문이 있습니다.영상처럼 작성했을 때 에러가 납니다. 에러내용Cannot destructure property 'basename' of 'react__WEBPACK_IMPORTED_MODULE_0__.useContext(...)' as it is null. TypeError: Cannot destructure property 'basename' of 'react__WEBPACK_IMPORTED_MODULE_0__.useContext(...)' as it is null. at LinkWithRef (http://localhost:3000/static/js/bundle.js:38549:5) at renderWithHooks (http://localhost:3000/static/js/bundle.js:25406:22) at updateForwardRef (http://localhost:3000/static/js/bundle.js:27975:24) at beginWork (http://localhost:3000/static/js/bundle.js:30022:20) at HTMLUnknownElement.callCallback (http://localhost:3000/static/js/bundle.js:15002:18) at Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/bundle.js:15046:20) at invokeGuardedCallback (http://localhost:3000/static/js/bundle.js:15103:35) at beginWork$1 (http://localhost:3000/static/js/bundle.js:34967:11) at performUnitOfWork (http://localhost:3000/static/js/bundle.js:34215:16) at workLoopSync (http://localhost:3000/static/js/bundle.js:34138:9)전 강의 코드를 따라했을 땐 문제가 없습니다. 영상에 캡쳐된 코드 방식대로 하려면 어떻게 해야 하나요? return ( <div className="App"> <DiaryStateContext.Provider value={data}> <DiaryDispatchContext.Provider value={{ onCreate, onUpdate, onDelete, }} > <BrowserRouter> <Routes> <Route path="/" element={<Home />} /> <Route path="/new" element={<New />} /> <Route path="/edit/:id" element={<Edit />} /> <Route path="/diary/:id" element={<Diary />} /> </Routes> <RouterTest /> <div /> </BrowserRouter> </DiaryDispatchContext.Provider> </DiaryStateContext.Provider> </div> );+<RouterTest> 컴포넌트 안에는 Link to 들이 적혀 있습니다. 감사합니다.
-
해결됨[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
</BrowserRouter>없으면 Link to에서 계속 오류가 납니다.
🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]
toastify-css 적용안됨
ReactDOM.createRoot(document.getElementById('root')).render( <BrowserRouter> <Provider store={store}> <PersistGate loading={null} persistor={persistor}> <App /> </PersistGate> </Provider> </BrowserRouter>, )App /에서 실행할 거여서 설정하고, const userSlice = createSlice({ name: "user", initialState, reducers: {}, extraReducers: (builder) => { builder .addCase(registerUser.pending, (state) => { state.isLoading = true }) .addCase(registerUser.fulfilled, (state) => { state.isLoading = false toast.info('회원가입을 성공했습니다.') }) .addCase(registerUser.rejected, (state, action) => { state.isLoading = false state.error = action.payload toast.error(action.payload) }) } })toast.info, toast.error 등 toast 메세지 정확하게 넣었고, import { ToastContainer } from "react-toastify" import "react-toastify/dist/ReactToastify.css" function Layout() { return ( <div className='flex flex-col justify-between h-screen'> <ToastContainer position='bottom-right' theme='light' pauseOnHover autoClose={1500} /> <Navbar/> <main className='w-10/12 max-w-4xl mx-auto mb-auto'> <Outlet/> </main> <Footer/> </div> ) }toastify랑 css를 사용하려고 import했고, const RegisterPage = () => { const { register, handleSubmit, formState: { errors }, reset } = useForm({ mode: 'onChange' }) const dispatch = useDispatch() // const navigate = useNavigate() const onSubmit = ({ email, name, password }) => { const body = { email, name, password, image: `https://via.placeholder.com/600x400?text=no+user+image` } dispatch(registerUser(body)) reset() // navigate('/login') }실행 하니까, db에 데이터는 잘 담기는데, css가 적용이 안됩니다. 그리고, css가 적용되지 않고, 자꾸 login 페이지로 넘어가기만 합니다. 오류를 도저히 못찾겠어요 도와주세요!
-
미해결
javascript 공부없이 바로 react native 배워도 되나요?
html/css, jQuery, Java Script, react까지 3년전에 배웠었어요.현재는 html/css 코드를 보고 읽고 간단한 건 수정할 수 있는 정도의 수준입니다. 개인적인 흥미로 취미로 개발을 배워보고 싶은데 시작하면 앱 개발, 유지/보수 할 수 있는 수준으로는 배우고 싶어요. 과외로 배울 예정인데 2분의 선생님을 소개받았는데 어떤 분의 루트가 더 나을지 판단이 어려워 전문가분들의 의견 구합니다.html/css > Java > react > react native까지 차근히 배우는 선생님React native와 Java Script를 병행으로 배우는 선생님 1번 선생님의 경우, 현직자이신 것 같진 않고 강의를 위주로 하시는 분 같고 2번 선생님은 현직 개발자로 7년차이세요. 2번 선생님의 경우 함수선언을 영어로 치면 숙어라고 생각하고 배울 수 있을 것 같다고 설명해주셨어요. 리엑트 네이티브에서 사용했던 언어들이 java Script에서 조금 변형된 것들이라고 기억하고 있어서 2번 선생님이 더 속성으로 배울 수 있을 것 같긴 한데(기간은 1년정도 생각합니다) 나중에 혼자 앱 개발을 하는 상황을 생각하면 처음부터 꼼꼼히 배우는게 나을까요?
-
미해결React + GPT API로 AI회고록 서비스 개발 (원데이 클래스)
프롬프트 내용은 어디서 볼수있나요?
안녕하세요 강사님 강의 정말 잘 듣고있습니다.다름이 아니라 프롬프트의 내용이 꽤 긴데 혹시 복붙할 수 있는 페이지는 따로 없는지 궁금합니다..! 제가 못찾은것일수도 있어서 조심스럽게 문의드립니다