3달 전 · 박태영 님의 질문
iOS NEpacketTunnelProvider https 패킷 감지
안녕하세요! iOS NEPacketTunnelProvider 프로젝트를 진행하며 어려움이 있어 여쭈어봅니다. 터널링을 이용해 vpn 프록시 서버를 로컬로 두고, 해당 터널에 지나가는 네트워크 패킷을 캡쳐해보고 있습니다. https 요청의 경우 암호화가 되어 있다보니 full path(ex. https://google.com/login) 경로를 알아낼 수 없는 것으로 알고 있습니다. 그래서 SNI를 추출하여 도메인(ex. https://google.com) 정도만 출력해보고 싶은데 관련 경험이 있거나 Network Extension을 잘 아시는 분 계신가요?? 도와주신다면 커피 기프티콘으로라도 보답드리겠습니다! 감사합니다.
개발자
#swift
#network-extension
#nepackettunnelprovider
#vpn
답변 0
댓글 0
조회 15
5달 전 · 양기주 님의 질문
github 연동 오류 질문입니다
파이참 사용중입니다 깃헙 아이디 연동하고 리포지토리 만들고 파일 공유하기 하면 남들은 파일 체크 해제하는 창 나오고 선택해서 깃헙에 올리는데 저는 그냥 완료됬다고 뜨고 가보면 .idea 밖에 안올라가네요 아무리 검색해도 안나와서 질문드립니다 ..
개발자
#github
답변 0
댓글 0
조회 15
6달 전 · 김낙현 님의 질문
background mode Location 질문 입니다.
안녕하세요. 선배님들 질문이 있습니다. ios Background modes에 location를 이용해서 앱을 죽이지 않고 계속 백그라운드에서 프로세서를 처리 하게 처리를 하였습니다. 하지만 최근에 확인해 보니 간헐적으로 백그라운드에서 처리가 안되는 문제를 확인 하였습니다. 테스트를 하는중인데 showsBackgroundLocationIndicator를 선언하면 location이 스캔이 계속 돌아가는거 같습니다. 혹시 자세히 아시는분 있으시면 코멘트 부탁 드립니다. 좋은 하루 되시기 바랍니다.^^ var locationManager: CLLocationManager = .init() override init() { super.init() setup() } func setup() { locationManager.delegate = self locationManager.pausesLocationUpdatesAutomatically = false locationManager.allowsBackgroundLocationUpdates = true locationManager.desiredAccuracy = kCLLocationAccuracyThreeKilometers locationManager.distanceFilter = 99999 } // end of setup func backgroundTaskStart() { isRuning = true locationManager.startUpdatingLocation() locationManager.startMonitoringSignificantLocationChanges() } // end of backgroundTaskStart
개발자
#ios
답변 0
댓글 0
조회 24
6달 전 · 유호준 님의 질문
NavigationContainer 중첩 오류
안녕하세요, RN(Expo)로 React Navigation을 적용하다 오류가 해결되지 않아서 질문드립니다. expo를 통해 다음과 같이 index.js에 React Navigation을 적용했습니다. import { store } from "@/redux/store"; import MainScreen from "./screens/MainScreen"; import { Provider } from "react-redux"; import { NavigationContainer } from "@react-navigation/native"; import { createNativeStackNavigator } from "@react-navigation/native-stack"; import LoginScreen from "./screens/LoginScreen"; export default function HomeScreen() { const Stack = createNativeStackNavigator(); return ( <Provider store={store}> <NavigationContainer> <Stack.Navigator> <Stack.Screen name="Main" component={MainScreen} /> <Stack.Screen name="Login" component={LoginScreen} />{" "} </Stack.Navigator> </NavigationContainer> </Provider> ); } 그러나 다음과 같은 오류가 뜨며 빈화면만 보이더라구요ㅠ Error: Looks like you have nested a 'NavigationContainer' inside another. Normally you need only one container at the root of the app, so this was probably an error. If this was intentional, pass 'independent={true}' explicitly. Note that this will make the child navigators disconnected from the parent and you won't be able to navigate between them. 찾아보니 NavigationContainer가 중첩되었다는 것 같은데, 저는 계속해서 그대로 강의를 따라가고 있었고, 따로 NavigationContainer를 적용한 파일이 존재하지 않습니다 ㅠ 다음 속성을 추가해도 오류가 해결되지 않습니다 ㅠ 아마 어디선가 부모에서 NavigationContainer가 적용된 것 같은데 찾을 수가 없네요 ㅠㅠ independent={true} 조금 더 찾아보니 expo-router랑 충돌이 난 거일 수도 있다는데 정확하게 모르겠네요 ㅠ
개발자
#react-native
#react-navigation
#expo
#navigationcontainer
답변 0
댓글 0
조회 82
6달 전 · 디버거 님의 질문
백엔드 스프링 개발자 IDE 어느것 사용하시나요?
저는 인텔리제이보다 vscode에 너무 익숙해져서..못넘어가겠음.. 저처럼 vscode 쓰는 분이 계실까요..?
투표
개발자
#ide
#백엔드개발
#sprimg
#spring-boot
답변 0
댓글 0
추천해요 1
조회 718
7달 전 · 포크코딩 님의 새로운 답변
nextjs 서버컴포넌트 질문있습니다 !
안녕하세요 nextjs 14 app router 공부 중 질문이있어 이렇게 글 남깁니다.... 1. ”use client“ 클라이언트 컴포넌트가 자식으로 서버컴포넌트를 가져오면 그 아래의 모든 컴포넌트는 서버컴포넌트로 동작이 아닌 클라이언트 컴포넌트가 되는건지 궁금합니다.. 2. 그렇다면 layout단에서 use client를 사용한 provider가 있다면 children으로 받은 모든 페이지들은 클라이언트 컴포넌트가 되는건지 궁금합니다... 3. 서버컴포넌트랑 SSR이 다른 개념이라는데 너무 헷갈립니다.. 혹시 다른점이 뭔지 알 수 있을까요? 궁금한 점들을 나열하다보니 두서가 없어진거같아서 죄송합니다.. 좋은 히루 보내세요 :) !!!!
개발자
#react
#next.js
#component
답변 1
댓글 0
조회 32
7달 전 · 장성호 님의 새로운 답변
개발 프로그램 질문이요!
이제 팀프로젝트 들어가서 sts3 쓰다가 설정할게 너무 많아서 spring boot 사용하려하는데 실무에서는 IDE 이클립스랑 sts3,boot 중에 뭘 제일 많이 사용하나요? 전에 다운받았던 프로그램들 지우고싶은데 이걸 두고 계속 사용하며 공부해야하는지 궁금해요
개발자
#java
답변 1
댓글 0
조회 31
7달 전 · 김동휘 님의 새로운 답변
웹 개발자 IDE 추천
웹개발자가 되기 위해 공부하고있습니다 학교를 다니며 eclipse나 sts는 학습한경험이있지만 intellij는 경험이 없어서요 또 요즘엔 intellij를 많이 사용한다고 들었습니다 어떤것을 선택해야 할까요? Eclipse vs intellij 어떤걸 선호하시는지 그리고 여러분들은 어떤걸 사용하고 계신가요?
개발자
#idea
#ide
답변 3
댓글 1
조회 209
8달 전 · 바보 님의 질문
Nextjs, 비용차이 많이 날까요?
안녕하세요 그냥 제 주변인이나 학우 대상으로 플젝 조그만하게 만드는 사람입니다 새 프로젝트를 nextjs로 가다보니 단순 호기심이에요 지금까지 프로젝트는 csr 방식으로 제작해 배포했고 비용은 0원나왔어요(트래픽이 많이 발생한 것도 아니고ㅋㄷ) 이번 플젝은 nextjs approuter을 사용하지만(ssr) client component만을 사용할 것이고 server side에서 Fetching하지 않을 계획이에요 실제 트래픽이 유의미하게 발생해야하고, 배포 플랫폼(버셀, aws)에 따라 다르지만 여러분들의 사례를 대충 알려주신다면 제 궁금증이 해소될 것입니다
개발자
#react
#next.js
답변 0
댓글 0
보충이 필요해요 3
조회 120
8달 전 · 프레드윰 님의 새로운 댓글
next socket.io 연결, 제가 어떤 부분을 놓치고 있을까요?
https://github.com/hyubbb/socket-test-app 안녕하세요. 간단하게 채팅방을 만들어서 유저의 입장/퇴장, 채팅 기능을 구현해볼려고 하는데요. 통신이 됬다 안됬다 하더라구요? 그래서 계속 새로고침을 누르거나 해야하는 현상이 있습니다. 서버와의 연결은 계속 되어있다고 하는데 , socket.on 이나 socket.emit 이 동작을 안하는데 정말 이해가 안됩니다. 콘솔을 찍어봤을땐, next가 캐싱처리를 해서 실시간으로 응답하는게 문제가 발생한게 아닐까 생각했는데, 정확하게 갈피를 잡지 못하겠습니다. 3일을 헤매고 있는데요. 제가 어떤 부분을 놓치고 있는지 알려주시면 너무 감사하겠습니다. 코드가 길어서 github에 업로드 하였습니다. 클릭 라우트 처리 components/chat/chat-list socket.emit 발생장소 components/chat/chat-room 소켓 프로바이더 components/providers/socket-provider socket서버사이드 설정 pages/api/socket/io.ts
개발자
#socket.io
#next.js
답변 1
댓글 2
조회 42
8달 전 · 익명 님의 질문
리액트네이티브 웹뷰에서 카카오 로그인 관련 질문드려요
안녕하세요. 웹 개발자여서 리액트 네이티브 cli로 웹뷰만 했을 뿐 아무것도 모릅니다.ㅜㅜ 원인: 웹뷰에서 카카오 로그인을 붙였습니다. 하지만 안드로이드에서 카카오 로그인이 되지 않습니다. 이유를 찾아보니 카카오 개발자 문서에 https://developers.kakao.com/docs/latest/ko/javascript/hybrid 안드로이드는 따로 뭘 해줘야 한다고 합니다. 'JavaScript SDK가 카카오톡 실행을 위한 Intent URI를 생성해 호출합니다. 웹뷰에서는 WebViewClient#shouldOverrideUrlLoading 메서드를 오버라이딩(Override)하여 Intent를 파싱(Parsing)하고, 해당 Activity를 실행해야 합니다.' 하지만 저것을 어디에 오바라이딩 해야하는건지 전혀 모르겠습니다. 도와주세요
개발자
#react-native
답변 0
댓글 0
조회 205
9달 전 · Top 10 Best Rated 님의 질문
Top 10 Best Rated - Lists of the Best Products, Services and Reviews
Top 10 Best Rated is a comparison platform that brings you useful top 10 lists worldwide covering a wide variety of products and services that can help you save time and money. Visit now https://top10bestrated.com
개발자
#top-10
#best
#rated
답변 0
댓글 0
보충이 필요해요 2
조회 14
9달 전 · 신진철 님의 새로운 댓글
우분투에서 pip install 시, 다음과 같은 오류가 발생합니다.
안녕하십니까 선배님들. 현재 AWS EC2에서 안드로이드 어플리케이션 용으로 백엔드 서버를 구축하는 도중, 다음과 같은 오류를 맞이했습니다. 현재 사용하는 ubuntu는 24.04 LTS 버전입니다. 도무지 해결 방안을 찾지 못해서 이렇게 조언을 구하고 싶습니다. 감사합니다. pip install git error: externally-managed-environment × This environment is externally managed ╰─> To install Python packages system-wide, try apt install python3-xyz, where xyz is the package you are trying to install. If you wish to install a non-Debian-packaged Python package, create a virtual environment using python3 -m venv path/to/venv. Then use path/to/venv/bin/python and path/to/venv/bin/pip. Make sure you have python3-full installed. If you wish to install a non-Debian packaged Python application, it may be easiest to use pipx install xyz, which will manage a virtual environment for you. Make sure you have pipx installed. See /usr/share/doc/python3.12/README.venv for more information. note: If you believe this is a mistake, please contact your Python installation or OS distribution provider. You can override this, at the risk of breaking your Python installation or OS, by passing --break-system-packages. hint: See PEP 668 for the detailed specification.
개발자
#서버
#ec2
#ubuntu
답변 2
댓글 2
추천해요 1
조회 740
10달 전 · 정창록 님의 질문
Next.js 에서 fluent-ffmpeg 사용 시 에러 해결 가능할까요?
Next.js 에서 puppeteer를 사용해서 특정 url에 접속하여 애니메이션을 png로 100장 정도 캡처하여 생성하고, fluent-ffmpeg를 사용해서 해당 png 이미지들을 mp4 영상으로 만들려고 하는데요. yarn add puppeteer fluent-ffmpeg @ffmpeg-installer/ffmpeg yarn add --dev @types/fluent-ffmpeg 위와 같이 라이브러리들을 설치했구요. 아래 page.tsx 파일에서 코드를 구현했는데요. dev로 실행해서 해당 페이지에 접속을 하면 아래와 같은 에러가 발생하는데요. 해결이 가능할까요?? 다른 라이브러리를 써야할지 구현한 코드가 문제가 있는지 모르겠네요. 도움 부탁드립니다!! # 에러 코드 # 1 of 1 error Next.js (14.2.3) Server Error Error: Cannot find module '/Users/.../animation-capture/node_modules/@ffmpeg-installer/darwin-arm64/package.json' This error happened while generating the page. Any console logs will be displayed in the terminal window. Call Stack webpackEmptyContext file:///Users/.../animation-capture/.next/server/app/capture/page.js (22:10) eval node_modules/@ffmpeg-installer/ffmpeg/index.js (40:27) (rsc)/./node_modules/@ffmpeg-installer/ffmpeg/index.js file:///Users/.../animation-capture/.next/server/vendor-chunks/@ffmpeg-installer.js (20:1) Next.js eval /./src/app/capture/page.tsx (rsc)/./src/app/capture/page.tsx file:///Users/.../animation-capture/.next/server/app/capture/page.js (286:1) Next.js # 코드 구현부 # import { NextApiRequest, NextApiResponse } from 'next'; import puppeteer from 'puppeteer'; import fs from 'fs'; import path from 'path'; import ffmpeg from 'fluent-ffmpeg'; import ffmpegInstaller from '@ffmpeg-installer/ffmpeg'; ffmpeg.setFfmpegPath(ffmpegInstaller.path); .... 중략.... const outputFilePath = path.resolve("./screenshots/video.mp4"); ffmpeg() .addInput(`${folderPath}/screenshot-%d.png`) .inputFPS(10) .output(outputFilePath) .on("end", () => { res.status(200).send(`Video created successfully at ${outputFilePath}`); }) .on("error", (err) => { console.error("Error generating video:", err); res.status(500).send("Failed to generate video"); }) .run(); } catch (error) { console.error("Error capturing screenshots:", error); res.status(500).send("Failed to capture screenshots"); }
개발자
#next.js
#fluent-ffmpeg
#mp4
답변 0
댓글 0
조회 85
10달 전 · 소지우 님의 답변 업데이트
Next.js 질문
아직 next의 개념을 잘 몰라서.. 혼란스러움에 질문드립니다..ㅠㅠ 전역상태에서 state를 꺼내서 사용하거나 react-query, pagination같은것들은 모두 csr로 변경해서 코드를 짜야하던데 그러다보니 page가 거의 use client로 도배되었는데요… 그럼 SSR의 장점들을 모두 잃어버리는건가요…? getStaticProps나 getServerSideProps들을 사용해서 이러한 문제들을 해결할 수 있다는데, 이것들로 해결해야하는걸까요..? 🥲
개발자
#프론트엔드
#프론트
#next
답변 1
댓글 0
조회 63
10달 전 · 포크코딩 님의 새로운 답변
next.js에서 히스토리 탭 기능 구현
next.js를 사용해서 브라우저에 탭 기능을 사이트 내에서 구현해야 하는 상황입니다. 탭 기능에 추가로 페이지 내부에서 다른 페이지로 가는 링크를 클릭하면 탭 목록에 추가되어야 하고 기존에 있던 탭에 보이던 페이지는 상태가 유지되어야 합니다. 지금 구현한 방법은 미리 모든 페이지의 페이지 컴포넌트를 하나의 파일에 넣어두고 링크를 클릭하면 store에 해당 페이지의 데이터를 넣어주고 Layout 컴포넌트에서 router.path를 비교해서 show/hide을 결정해주고 있는데 뭔가 다른 방식이 없을까요?
개발자
#next.js
답변 1
댓글 0
조회 135
10달 전 · 프레드윰 님의 새로운 답변
안녕하세요 html,css질문입니다 제발 도와주세요
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>중경삼림</title> <script src="//code.jquery.com/jquery-3.3.1.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mb.YTPlayer/3.3.1/jquery.mb.YTPlayer.min.js"></script> <script> jQuery( function() { jQuery( '#background' ).YTPlayer(); } ); </script> <link rel="stylesheet" href="style.css"> </head> <body> <div class="jb-box"> <div id="background" class="player" data-property="{ videoURL:'https://www.youtube.com/watch?v=ncT1R2hMpaQ', mute: true, showControls: false, useOnMobile: true, quality: 'highres', containment: 'self', loop: true, autoPlay: true, stopMovieOnBlur: false, startAt: 9.5, opacity: 1 }"></div> </div> <br><br><br> <div id="director"> <br><br><br><br> <h1>왕가위</h1> </div> </body> </html> 이건 html이고, body{ margin: 0; } .jb-box { position: relative; } #background { z-index: -1; } 이건 외부 css파일입니다. 문제는 저 스크립트가 다른 컴퓨터에서 실행했을 때 영상이 재생되지 않는다는 것입니다. '이 동영상은 볼 수 없습니다'로 뜹니다...혹시 저 스크립트에 문제가 있는 것 일까요..?? 도와주시면 정말 감사하겠습니다...
개발자
#html-css-js
#웹디자인
#css
#html
#script
답변 2
댓글 0
조회 81
10달 전 · 털먹는토끼 님의 댓글 업데이트
리액트 쿼리 에러 핸들링 이슈
react query를 활용한 에러 핸들링이 안돼서 질문 올립니다... //mainpage.tsx const { data, refetch, isFetching } = FetchData(url); const handleSearch = () => { refetch(); } <QueryErrorResetBoundary> {({ reset }) => ( <ErrorBoundary onReset={reset} FallbackComponent={FallbackUI}> {resultVisible ? ( <Result searchData={searchData} isFetching={isFetching} /> ) : ( <EmptyResult /> )} </ErrorBoundary> )} </QueryErrorResetBoundary> react-error-boundary 라이브러리를 이용해 ErrorBoundary 컴포넌트를 가져왔습니다. ErrorBoundary 하위 컴포넌트 내에서 에러가 발생하면 FallbackComponent의 FallbackUI 컴포넌트가 렌더링 되도록 했습니다. //FallbackUI 컴포넌트 //에러가 발생히면 이 컴포넌트가 렌더링되어야합니다. const FallbackUI = ({ error, resetErrorBoundary }) => { return ( <div> <span>{error.message}...</span> <button onclick={resetErrorBoundary} /> 돌아가기 버튼 </div> ); }; export default FallbackUI; FallbackUI 에서 QueryErrorResetBoundary 에서 제공하는 resetErrorBoundary를 받아와 에러 발생 후 '돌아가기 버튼'을 클릭하면 쿼리오류를 처리하고 리셋해주도록 구현했습니다. //url을 파라미터값으로 받아와 api호출하는 함수 //위에 있는 mainpage.tsx 에서 사용하는 함수입니다. const FetchData = (url: string) => { const { error, data, refetch, isFetching } = useQuery({ queryKey: ["repoData"], queryFn: async () => { const res = await axios.get(url); console.log(res.data); return res.data; }, refetchOnWindowFocus: false, enabled: false, }); return { error, data, refetch, isFetching }; }; 리액트 쿼리를 이용해 api를 호출하는 함수입니다. //main.tsx const queryClient = new QueryClient({ defaultOptions: { queries: { retry: 0, throwOnError: true, }, }, }); ReactDOM.createRoot(document.getElementById("root")!).render( <React.StrictMode> <QueryClientProvider client={queryClient}> <BrowserRouter> <GlobalStyles /> <Provider store={store}> <App /> </Provider> </BrowserRouter> </QueryClientProvider> </React.StrictMode> ); 마지막으로 전역으로 에러 관리를 하도록 세팅해놨습니다. 그리고 QueryClient에 throwOnError 속성이 있어야 에러를 ErrorBoundary로 전달할 수 있다해서 추가해줬습니다. 이렇게 세팅해놨는데 에러발생하면 그냥 하얀색 화면만 나오고 fallbackUI가 나오지 않습니다... 원인이 뭘까요...ㅠㅠㅠ 혹시 몰라서 콘솔 에러코드도 올립니다.. 추가로 궁금한 점 1. useQuery 에서 반환하는 객체중 error 객체는 어떤 존재인지 궁금합니다. 2. useQuery 속성과 QueryClient 속성 모두 throwOnError : true 를 가지고 있던데 어떤 차이점인지 궁금합니다. 답변주시면 정말 감사하겠습니다!!!
개발자
#react
#react-query
#error-handler
#error-boundary
답변 1
댓글 1
조회 193
10달 전 · 김태우 님의 새로운 답변
Nextjs Application error를 핸들링 할 수 있나요?
Nextjs로 개발중인데 Application error: a client-side exception has occurred가 간헐적으로 발생하고 있습니다. 위 에러가 뜰 경우에는 예외 처리를 해주려고 하는데 언제 어떻게 뜰 지 모르기 때문에 핸들링이 안되고 그대로 에러가 노출되고 있습니다 핸들링을 할 수 있는 방법이 있다면 공유 해주시면 감사하겠습니다!
개발자
#next.js
#프론트엔드
답변 2
댓글 0
조회 335
10달 전 · 용용 님의 답변 업데이트
next js 14 react query
next js 14에서 react query를 사용해보고 있는데 QueryClient를 세팅하고 useMutation를 사용했는데 "No QueryClient set, use QueryClientProvider to set one"라고 오류가 떠서 어떻게 하면 고칠수 있는지 궁금합니다 query-provider.tsx 부분입니다
개발자
#next.js
#react-query
답변 1
댓글 0
조회 168
일 년 전 · 최성수 님의 새로운 댓글
넥스트js에서 사용자 인증 페이지 구분
사용자 인증은 jwt토큰으로 하고 있습니다 현재는 serversideprops 또는 클라이언트 사이드에서 토큰을 가져와서 로그인 페이지로 보내고 있는데요 어느정도 모듈화가 필요한 것 같은데 마땅한 방법이 떠오르지 않아 질문 드립니다 제가 생각한 방법은 사용자 인증이 필요한 pathname을 array로 정리해 app.js에서 구분하려 하는데 더 좋은 방법이나 현재 사용하고 계신 방법이 있다면 공유 부탁드립니다
개발자
#nest.js
#프론트
답변 1
댓글 1
추천해요 1
조회 96
10달 전 · 양승완 님의 새로운 댓글
sns기능을 구현중에 있습니다.
swift 로 sns 기능을 구현 중에 있습니다. 메모리 관리를 위해 테이블 뷰로 피드 창을 구현하였는데 Pagination을 위하여 테이블뷰 셀 안에 스크롤뷰를 구현에 그 안에 frame에 맞춰 Imageview를 넣어주었습니다. 이 상황에서 무한 스크롤 , 새로고침 기능 시 셀 재사용으로 인하여 이전 셀의 이미지가 살짝 보였다가 현재의 이밎로 보이거나 override된 셀의 prepare reuseable 함수에서의 초기화를 함에도 깜빡이는 현상이 지속됩니다. 혹시 좋은 의견 있으신가 여쭤봅니다!
개발자
#rxswift
#swift
#xcode
#ios
답변 1
댓글 1
조회 131
일 년 전 · 유길종 님의 답변 업데이트
react-hook-form 복잡한 form에서 궁금점이 있습니다 !
안녕하세요 현재 진행하는 프로젝트에서 form을 recoil로 관리하고있습니다. 이유는 form과 화면구성이 너무 복잡한 형태라 props drilling도 심하고 (부모에서 자식까지 5~7 depth) 관리해야하는 데이터가 많아 store에서 관리하고있습니다. react-hook-form이 복잡한 form에서 효율을 낸다고 해서 마이그레이션 해볼까 생각중인데 궁금점이 있어 작성합니다 ! 1. 이렇게 전역적으로 관리를 해야하는 복잡한 form에서도 좋은 효율을 내고 전역 상태관리 라이브러리보다 좋은 방향일까요?! (FormProvider 를 사용) 2. form에서는 input 필드만이 아닌, tab클릭, 드랍다운 클릭, 체크박스 클릭, 이미지 업로드, 라디오 클릭 등등 이러한 경우가 많은데 react-hook-form 을 사용해도 좋은 방향인가요?! 어떨때 react-hook-form을 사용하면 좋은지 궁금합니다 !
개발자
#react
답변 1
댓글 0
조회 122
7달 전 · 권순원 님의 새로운 답변
useSuspenseQuery의 SSR 요청
안녕하세요, Next.js (v13-14), react-query (v5), page router 환경일 때, useSuspenseQuery와 Suspense를 사용했는데 찾아보니 useSuspenseQuery는 컴포넌트 렌더링 시점에 데이터를 로딩하도록 설계가 되어 있어서 Next.js에서 getStaticProps or getServerSideProps 함수를 사용하지 않아도 서버에서 api 요청이 보내지는게 맞을까요? 제가 테스트해보니 위의 가정 했던 것 처럼 동작하는것을 확인을 했지만 문서에서는 그런 내용을 찾을 수가 없어서 질문을 올려봅니다. 감사합니다!
개발자
#next.js
#suspense
#react
#react-query
#fronted
답변 1
댓글 0
추천해요 1
조회 271
일 년 전 · 쎄오 님의 질문 업데이트
하이브리드앱(네이티브+웹뷰)에서 GA4 사용 시 질문
안녕하세요. 현재 스타트업에서 프론트엔드 개발자로 일하고 있는 GA4 어린이 입니다. 하이브리드 환경 (네이티브 + 웹뷰) 에서 GA4 구현 시, 중복 카운팅을 막기 위해, 아래 ga4 가이드대로 구현하라고 하는 글이 많은데요... [GA4 공식 가이드] https://developers.google.com/analytics/devguides/collection/ga4/webview?hl=ko&technology=ios [구글링한 여러 페이지 중 한개 공유드리면... ] https://dachata.com/question/?uid=1484&mod=document&pageid=1 구현하기 어려워 보이지는 않는데, 이 페이지가 최신 목차에는 보이지도 않고, 샘플로 제공되는 git repository 도 archive 되어서, 이 방향으로 가는게 맞는건지에 대한 의문이 생겼습니다... 혹시 현업에서, 위와 같은 상황에서 GA4 를 연동하시는 분이 있다면 (혹은 방법을 아는 분이 계시다면) 어떤 식으로 진행하고 계신지... 경험과 지혜를 나눠주시면 많은 도움이 될 것 같습니다!! 미리 감사드립니다. 🫡
개발자
#ga4
#웹뷰
#webview
#하이브리드앱
#google-analytics
답변 0
댓글 0
추천해요 1
조회 300
일 년 전 · 이수빈 님의 질문
next.js에서 interceptor 어떻게 사용하고 계신가요?
안녕하세요 page router 형식으로 프로젝트 진행 중 궁금한게 있어 게시글 남깁니다. 현재 프로젝트에서는 두가지 AJAX 요청이 존재하는데요. 한가지는 클라이언트 사이드에서의 요청(좋아요 누르기 기능 등)과 서버 사이드 렌더링을 위한 getserversideprops에서의 요청입니다. 문제는 인증 방식으로 엑세스토큰을 사용중인데 axios interceptor을 사용하려고 보니 하나의 interceptor로 두가지 요청을 커버하기가 어렵겠더라구요. 혹시 비슷한 경험이 있으신분들 어떻게 사용하셨는지 공유해주시면 감사하겠습니다.
개발자
#react
#next.js
답변 0
댓글 0
보충이 필요해요 1
조회 92
일 년 전 · 프레드윰 님의 답변 업데이트
맥북사양 관련 질문입니다
현재 m1 맥북에어 (메모리8GB 용량256GB) 을 사용중인데 백엔드 사이드프로젝트를 진행하면서 도커같은걸 사용하다보니 IDE도 멈추고 타자도 버벅여서 이대로는 안되겠다 싶어 기변을 해보려고 합니다. 2018 ~ 2019 맥북프로 램32 1테라 (80~90) m1 맥북프로 램16~32 512~1테라 (130~200) 아직 취준생이다보니 2018 맥북프로 CTO제품을 구매하려고 하는데 벤치점수나 연식등을 생각하다보니 고민이 됩니다. 어떤 제품이 좋을까요? 조언 부탁드리겠습니다.
개발자
#맥북
답변 1
댓글 0
조회 329
7달 전 · 이경도 님의 답변 업데이트
Jpa 커스텀 리포지토리 다중 상속 문제
커스텀 리포지토리 사용중 문제가 발생하여 질문 드립니다. @Repository public interface UserRepository extends JpaRepository<User, Long>, CustomRepository { Optional<User> findByUserId(String userId); } public interface CustomRepository { Long search(User user); } public class ACustomRepositoryImpl implements CustomRepository { @Override public Long search(User user) { return 1L; } } 이런식으로 코드를 작성하고 실행 시키면 아래와 같은 에러 메시지가 나옵니다. 그런데 ACustomRepositoryImpl 구현체 이름을 CustomRepositoryImpl 이렇게 바꾸면 정상적으로 실행됩니다. 명명규칙이 그저 개발자들 간의 약속 인줄 알았는데 규칙을 무조건 지켜야 하는 건지 궁금하여 질문 드렸습니다. Caused by: org.springframework.data.mapping.PropertyReferenceException: No property 'search' found for type 'User' at org.springframework.data.mapping.PropertyPath.<init>(PropertyPath.java:90) ~[spring-data-commons-3.2.2.jar:3.2.2] at org.springframework.data.mapping.PropertyPath.create(PropertyPath.java:443) ~[spring-data-commons-3.2.2.jar:3.2.2] at org.springframework.data.mapping.PropertyPath.create(PropertyPath.java:419) ~[spring-data-commons-3.2.2.jar:3.2.2] at org.springframework.data.mapping.PropertyPath.lambda$from$0(PropertyPath.java:372) ~[spring-data-commons-3.2.2.jar:3.2.2] at java.base/java.util.concurrent.ConcurrentMap.computeIfAbsent(ConcurrentMap.java:330) ~[na:na] at org.springframework.data.mapping.PropertyPath.from(PropertyPath.java:354) ~[spring-data-commons-3.2.2.jar:3.2.2] at org.springframework.data.mapping.PropertyPath.from(PropertyPath.java:332) ~[spring-data-commons-3.2.2.jar:3.2.2] at org.springframework.data.repository.query.parser.Part.<init>(Part.java:81) ~[spring-data-commons-3.2.2.jar:3.2.2] at org.springframework.data.repository.query.parser.PartTree$OrPart.lambda$new$0(PartTree.java:259) ~[spring-data-commons-3.2.2.jar:3.2.2] at java.base/java.util.stream.ReferencePipeline$3$1.accept(ReferencePipeline.java:197) ~[na:na] at java.base/java.util.stream.ReferencePipeline$2$1.accept(ReferencePipeline.java:179) ~[na:na] at java.base/java.util.Spliterators$ArraySpliterator.forEachRemaining(Spliterators.java:992) ~[na:na] at java.base/java.util.stream.AbstractPipeline.copyInto(AbstractPipeline.java:509) ~[na:na] at java.base/java.util.stream.AbstractPipeline.wrapAndCopyInto(AbstractPipeline.java:499) ~[na:na] at java.base/java.util.stream.ReduceOps$ReduceOp.evaluateSequential(ReduceOps.java:921) ~[na:na] at java.base/java.util.stream.AbstractPipeline.evaluate(AbstractPipeline.java:234) ~[na:na] at java.base/java.util.stream.ReferencePipeline.collect(ReferencePipeline.java:682) ~[na:na] at org.springframework.data.repository.query.parser.PartTree$OrPart.<init>(PartTree.java:260) ~[spring-data-commons-3.2.2.jar:3.2.2] at org.springframework.data.repository.query.parser.PartTree$Predicate.lambda$new$0(PartTree.java:389) ~[spring-data-commons-3.2.2.jar:3.2.2] at java.base/java.util.stream.ReferencePipeline$3$1.accept(ReferencePipeline.java:197) ~[na:na] at java.base/java.util.stream.ReferencePipeline$2$1.accept(ReferencePipeline.java:179) ~[na:na] at java.base/java.util.Spliterators$ArraySpliterator.forEachRemaining(Spliterators.java:992) ~[na:na] at java.base/java.util.stream.AbstractPipeline.copyInto(AbstractPipeline.java:509) ~[na:na] at java.base/java.util.stream.AbstractPipeline.wrapAndCopyInto(AbstractPipeline.java:499) ~[na:na] at java.base/java.util.stream.ReduceOps$ReduceOp.evaluateSequential(ReduceOps.java:921) ~[na:na] at java.base/java.util.stream.AbstractPipeline.evaluate(AbstractPipeline.java:234) ~[na:na] at java.base/java.util.stream.ReferencePipeline.collect(ReferencePipeline.java:682) ~[na:na] at org.springframework.data.repository.query.parser.PartTree$Predicate.<init>(PartTree.java:390) ~[spring-data-commons-3.2.2.jar:3.2.2] at org.springframework.data.repository.query.parser.PartTree.<init>(PartTree.java:100) ~[spring-data-commons-3.2.2.jar:3.2.2] at org.springframework.data.jpa.repository.query.PartTreeJpaQuery.<init>(PartTreeJpaQuery.java:100) ~[spring-data-jpa-3.2.2.jar:3.2.2] ... 79 common frames omitted
개발자
#spring-boot
#java
#interface
#jpa
답변 2
댓글 0
조회 161
일 년 전 · 최윤재 님의 새로운 댓글
react에서 에러 status에 따라 에러 모달을 가져오는 법
안녕하세요. 지금 api를 호출 후에 api에서 에러가 났을 때, 해당 에러의 status를 저장하여 해당 status에 맞는 에러 모달을 띄워주려고 하고 있습니다. ``` catch (error: unknown) { if (error instanceof AxiosError) { handleErrorModal(error.response?.status); } return null; } ``` 이렇게 fetchData에서 에러가 발생했을 때, handleErrorModal로 에러 status를 전달하고 있습니다. ``` const [errorType, setErrorType] = useRecoilState(errorDataState); const handleErrorModal = (errorStatus: string | number | null) => { setErrorType(errorStatus); }; ``` 그리고 handleErrorModal 함수는 이와 같이 작성을 해놓은 상태이고요. 근데, setState가 비동기로 작동해서인지 errorStatus가 저장이 되지 않아서 계속 초기값인 null을 띄워줍니다. 그리고, 계속 ``` Warning: Can't perform a React state update on a component that hasn't mounted yet. This indicates that you have a side-effect in your render function that asynchronously later calls tries to update the component. Move this work to useEffect instead. ``` 이 오류를 띄우네요. 이 문제를 해결하기 위해서는 useEffect를 쓰는 방법외에는 다른 방법이 없는걸까요?
개발자
#react
#react-query
답변 1
댓글 1
조회 99
일 년 전 · 김우현 님의 질문
Next.js RSC Network response관련해서 질문이 있습니다.
Next.js App router를 사용하고 있습니다. 간단한 검색기능을 구현하는 프로젝트를 진행 중인데 패칭 과정은 아래와 같습니다. 1. 자식 Client 컴포넌트에서 url의 searchParams(router.replace)를 변경하면, 2. 부모 Server Component는 변경된 Search Params를 바탕으로 라우트 핸들러에서 서버에 요청을 하고 필요한 데이터를 Server Component로 받아옵니다 . (부모 RSC는 캐싱을 하지 않게 구현되어있습니다.) 3. 받아온 데이터를 가공 후 자식 Client 컴포넌트에 내려주면, 4. props를 받은 자식 Client 컴포넌트에서 보여주는 방식으로 진행하고 있습니다. 위 과정에서 에러가 발생하는 것은 아니고 정상적으로 잘 동작하고 있습니다. 다만 브라우저 devtool의 Network 탭을 확인하는데 의문점이 있어서 질문을 드립니다. RSC에서 요청을 하면 _rsc 페이로드로 데이터를 받아오는 걸로 알고 있습니다. 분명 _rsc로 요청이 가고 정상적으로 네트워크탭의 preview에 RSC 페이로드가 찍히는가하면 정상적으로 요청이가고 페이지를 확인했을 땐 정상적으로 패칭과 렌더링까지 완료되었는데, 네트워크에서 preview에는 "no data found for resource with given identifier"로 나옵니다. 결론은 패칭과 렌더링은 정상적으로 동작하지만 네트워크탭의 preview와 response가 나올 때도 있고 안 나올 때도 있어서, 명확한 기준이 있는지 궁금해서 질문을 올립니다.
개발자
#next.js
#network
#devtool
답변 0
댓글 0
추천해요 2
조회 275