묻고 답해요

React-firebase authentication 관련 질문

미해결

firebase authentication 을 사용해서 회원가입을 구현 했습니다. 회원가입 페이지에서 정보를 입력하고 휴대전화에 sms를 보낸 후 인증번호를 입력하면 회원가입이 되는 것 까지 모두 정상적으로 작동합니다. 하지만 회원가입 페이지에서 sms 인증을 보낸 후 대략 1~2분 후 *Timeout at handleError ( http://localhost:3000/static/js/bundle.js:115024:58 ) at http://localhost:3000/static/js/bundle.js:115047:7 이런 오류가 발생합니다. 도통 왜 발생하는지 못찾겠습니다.. 한번만 도와주세요ㅜㅜㅜㅜ 회원가입 페이지 코드 부분 / sms 인증코드 확인 부분 const sendVerificationCode = async () => { if (!validateForm()) return; try { if (!window.recaptchaVerifier || window.recaptchaVerifier.expired) { resetRecaptcha(); } const phoneNumber = `+82${formData.phoneNumber.slice(1)}`; const appVerifier = window.recaptchaVerifier; const confirmationResult = await Promise.race([ signInWithPhoneNumber(auth, phoneNumber, appVerifier), new Promise((_, reject) => setTimeout(() => reject(new Error("Request timeout")), 120000) // 2 minutes ), ]); window.confirmationResult = confirmationResult; alert("Verification code sent!"); } catch (error) { console.error("Error sending verification code:", error); resetRecaptcha(); } }; const verifyCode = async () => { if (!inputValue.trim()) { alert("Please enter the verification code."); return; } try { const result = await Promise.race([ window.confirmationResult.confirm(inputValue), new Promise((_, reject) => setTimeout(() => reject(new Error("Verification timeout")), 180000) // 3 minutes ), ]); alert("Verification successful!"); // Handle user information here... } catch (error) { console.error("Verification error:", error); alert("Verification failed. Please try again."); } };

• react
• firebase
• authentication

선호하는 GUI 개발 방법이 있으신가요

미해결

[Level 1] Qt를 이용한 Python 프로그래밍: 입문편

안녕하세요 GUI 개발 시 Qt designer 혹은 QML로 해야할 것 같은데 강사님은 주로 어떤걸로 GUI 개발을 하시는지 궁금하고, 그 이유도 함께 알려주실 수 있을까요

• python
• gui
• qt
• qml
• pyside6

퀴즈#3에 대해서 이렇게 작성해도 되나요?

미해결

파이썬 무료 강의 (기본편) - 6시간 뒤면 나도 개발자

# Quiz) 사이트별로 비밀번호를 만들어주는 프로그램을 작성하시오 # 예) http://naver.com # 규칙1 : http:// 부분은 제외 => naver.com # 규칙2 : 처음 만나는 점(.) 이후 부분은 제외 => naver # 규칙3 : 남은 글자 중 처음 세자리 + 글자 갯수 + 글자 내 'e' 갯수 + "!"로 구성 # 예) 생성된 비밀번호 : nav51! domain = "http://naver.com" sitename = domain[7:(domain.find("."))] first3 = sitename[:3] length = len(sitename) count_e = sitename.count("e") print(f"생성된 비밀번호 : {first3}{length}{count_e}!")

• python

Failed to load module script 에러가 뜹니다

해결됨

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

오늘 카운터앱 강의를 들으면서 새로운 파일 (section06)을 만들었는데요. 가장 기본 세팅을 하고 화면에 카운터앱 이라는 단어를 렌더링 하려고 npm run dev를 한 후 ctrl shift p 를 눌러 페이지에 들어갔는데 글자가 렌더링 되지 않길래 개발자 도구를 켜 보았더니 Failed to load module script : Expected a JavaScript module script but the server responed with a MIME type of "text/jsx". Strict MIME type checking is enforced for module scripts per HTMl spec. 라는 오류가 뜨네요. 오류 해결을 위해 업데이트도 해보고, 파일을 지웠다 새로 만들어도 보고, 지피티에 물어보거나 인터넷에 검색도 해봤는데 도저히 오류가 고쳐지지 않습니다. 혹시나 해서 이번에 새로 만든 파일 말고 section05 파일을 실행시켜 보았더니 어제는 잘 되던 파일이 오늘은 똑같은 오류가 뜨며 실행이 되지 않더라구요. 무슨 오류일까요 ㅠㅠ 제발 도와주세요 엉엉엉엉엉엉엉엉

• javascript
• react
• node.js

예제코드 자바입니다

미해결

2주만에 통과하는 알고리즘 코딩테스트 (2024년)

복습하면서 자바로도 풀어봤어요 필요하신분들 확인!! https://github.com/hyukjunkim1116/algorithm-master-in-2weeks

• python
• 코딩-테스트
• 알고리즘
• 자바
• java

연장부탁드립니다

미해결

AWS Certified Solutions Architect - Associate 자격증 준비하기

감사합니다

• 네트워크
• aws

네이버쇼핑(닭가슴살) 크롤링

미해결

[신규 개정판] 이것이 진짜 크롤링이다 - 실전편 (인공지능 수익화)

안녕하세요 스타트코딩님! 수업 잘 듣고 있는 학생입니다. 질문이 있어 글 남깁니다. 수업 듣기 전에 혼자 해볼 때 저는 soup를 사용하지 않고 find_element를 사용해서 이렇게 코드를 작성했는데 뭐가 다른 걸까요? from selenium import webdriver from selenium.webdriver.common.by import By from selenium.webdriver.common.keys import Keys import time import pandas as pd driver = webdriver.Chrome() driver.get('https://search.shopping.naver.com/search/all?query=%EB%8B%AD%EA%B0%80%EC%8A%B4%EC%82%B4') # 스크롤 전 높이 last_height = driver.execute_script('return document.body.scrollHeight') while True: # 스크롤 끝까지 내리기 driver.execute_script('window.scrollTo(0, document.body.scrollHeight)') # 대기 시간 줘야됨 !!! time.sleep(1) # 스크롤 후 높이 after_height = driver.execute_script('return document.body.scrollHeight') # 비교 (if, break) if last_height == after_height: break # 스크롤 전 높이 업데이트 last_height = after_height products = driver.find_elements(By.CSS_SELECTOR, '.product_item__MDtDF') data = [] for product in products: name = product.find_element(By.CSS_SELECTOR, '.product_title__Mmw2K').text link = product.find_element(By.CSS_SELECTOR, '.product_title__Mmw2K > a').get_attribute('href') price = product.find_element(By.CSS_SELECTOR, '.price_num__S2p_v').text.split('원')[0].replace(',', '') data.append([name, link, int(price)]) df = pd.DataFrame(data, columns = ['상품명', '상세페이지링크', '가격']) df.to_excel('네이버쇼핑.xlsx')

• python
• 웹-크롤링

혹시 백엔드서버를 종료해도 에러가 뜨지안고 정상가동되면 어떻게해야하나요?

해결됨

한 입 크기로 잘라먹는 Next.js

혹시 백엔드서버를 종료해도 에러가 뜨지안고 정상가동되면 어떻게해야하나요?.. 당황스럽네요 하하 아 캐싱문제네요 강제 새로고침으로 해결했습니다. 감사합니다. 음 아니네요 여전히 이상하네요.. 전 이상하게 Footer에서 먼저 에러가 나네요. force cache가 되어있음에도.. 왜그럴까요?ㅜㅜ

• react
• typescript
• next.js

변수명에 $ 허용하나요?

미해결

프로그래밍 시작하기 : 파이썬 입문 (Inflearn Original)

변수명에 달러표시나 다른 특수문자를 허용하신다고 했는데 _은 오류가 뜨지 않는데 달러표시는 자꾸 오류가 뜨네요 어떤 것이 문제일까요...ㅜㅜ

• python

강의 2.8을 듣고 있는 도중 use client에 대해서

해결됨

한 입 크기로 잘라먹는 Next.js

use client 가 선언되지 않아도 searchable-layout.tsx 에서 useEffect 가 동작 하는 이유는 무엇인가요? 제가 알기론 이런 클라이언트사이드 훅들은 use client를 최상위에 선언해줘야 동작한다고 이해했었습니다..

• react
• typescript
• nextjs

axios post 사용할때 페이지 새로고침 문제

미해결

React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지

Home.jsx 이렇게 하고 import { useEffect, useState } from 'react'; import HomeDataLength from '../components/HomeDataLength.jsx'; import HomeSearch from '../components/HomeSearch.jsx'; import CanvasItemList from '../components/CanvasItemList.jsx'; import SearchBar from '../components/SearchBar.jsx'; import GridFlexBTN from '../components/GridFlexBTN.jsx'; import { deleteHome, createHome, getHome } from '../api/home.js'; import { v4 as uuid } from 'uuid'; import dayjs from 'dayjs'; export default function Home() { const [isGrid, setIsGrid] = useState(true); const [search, setSearch] = useState(''); const [data, setData] = useState([]); const [isLoading, setIsLoading] = useState(false); const [error, setError] = useState(false); useEffect(() => { const api = async () => { setIsLoading(true); setError(false); try { const response = await getHome(''); setData(response.data); } catch (err) { setError(err); } finally { setIsLoading(false); } }; api(); }, []); const [isLoadingCreate, setIsLoadingCreate] = useState(false); const [createError, setCreateError] = useState(false); // 등록버튼 누르면 새로운 데이터 저장 const handleNewCreate = async () => { // setIsLoadingCreate(true); // setCreateError(false); // try { const id = uuid(); const newCreate = { id, date: dayjs().format('YYYY-MM-DD HH:mm:ss'), text: `${id.substring(0, 4)}-테스트`, category: '테스트', }; await createHome(newCreate); console.log(123); // const res = await getHome(); // setData(res.data); // } catch (err) { // setCreateError(err); // console.log(createError, 'createError'); // } finally { // setIsLoadingCreate(false); // } }; const handleText = text => { const searchData = data.filter(d => d.text.toLowerCase().includes(text.toLowerCase()), ); if (searchData.length === 0) { setSearch(null); } else { setSearch(searchData); } }; const handleDelete = async id => { // const newData = data.filter(d => d.id !== id); // setData(newData); await deleteHome(id); }; return ( <> <> <div className="flex flex-col md:flex-row justify-between items-center"> <button className="hover:bg-blue-400 bg-blue-500 text-white rounded-md text-bold p-3" onClick={handleNewCreate} > 등록하기 </button> {isLoadingCreate && <p>등록중</p>} {createError && <p>{createError}</p>} <SearchBar handleText={handleText} /> <GridFlexBTN setIsGrid={setIsGrid} isGrid={isGrid} /> </div> <HomeDataLength data={data} error={error} isLoading={isLoading} /> <HomeSearch search={search} /> {!isLoading && !error && ( <CanvasItemList data={data || []} search={search} isGrid={isGrid} handleDelete={handleDelete} /> )} </> </> ); } home.js 파일은 아래와 같은 상태이면 import { home } from './http'; // 목록 조회 export const getHome = () => { return home.get('/'); }; // 등록 export const createHome = newCreate => { try { console.log('ㅅㅣ작'); } catch (error) { console.log('에러'); } finally { console.log('종료'); } // debugger; return home.post('/', newCreate); }; // 수정 // 삭제 export const deleteHome = id => { return home.post('/', id); }; db는 server-json을 사용하고 있습니다. 그런데 get 요청을 할때는 잘 작동하는데 post로 등록하거나 삭제할때는 db에 정상 등록, 삭제되는데 화면이 새로고침이 되버리는 상태입니다. Home.jsx 화면이 리렌더링이 되도록 하고싶은데 새로고침은 왜 그런지 모르겠습니다. postman으로도 post로 db에 저장했는데 리액트 화면이 자동으로 새로고침 되버립니다. 구글링도 해봤는데 해결이 안되서 문의드립니다. 혹시나 해서 db.json이 변경되면 화면도 변경될까 싶어서 을 db.json --watch로만 해보고 --watch도 없애봤는데 안됩니다. const handleNewCreate = async () => { console.log('시작1'); const id = uuid(); const newCreate = { id, date: dayjs().format('YYYY-MM-DD HH:mm:ss'), text: `${id.substring(0, 4)}-테스트`, category: '테스트', }; const data = await createHome(newCreate); console.log(data, 'data'); console.log('시작2'); debugger; }; debugger를 사용했을때 이렇게 데이터 나오는데 디버거 끄는 순간 바로 화면이 새로고침 되고 있습니다. 그리고 콘솔창도 새창으로 이전 내역이 다 사라지는 상태입니다.

• react
• React-Context
• react-router
• tailwindcss
• react-query

위니브월드 맞게 코드를 짠거같은데 왜 오답일까요?

미해결

위니브월드 탐험대 - 게임으로 배우는 파이썬

mission_start()move() pick() move() pick() move() pick() move() pick() turn_left() turn_left() repeat(2, move) repeat(2, move) turn_left() turn_left() say('hello, world!') mission_end()mission_start() move() pick() move() pick() move() pick() move() pick() turn_left() turn_left() repeat(2, move) repeat(2, move) turn_left() turn_left() say('hello, world!') mission_end() 이렇게 제출하였는데 오답이라네요ㅠㅠ왜그런거죠?

• python

[실습] Service[NLB] 배포 및 확인의 aws-loadbalancer-controller 설치 및 실습 시 트러블슈팅

해결됨

CloudNet@ - Amazon EKS 기본 강의

https://raw.githubusercontent.com/kubernetes-sigs/aws-load-balancer-controller/v2.4.7/docs/install/iam_policy.json 에서 "elasticloadbalancing:DescribeListenerCertificates", 윗줄에 "elasticloadbalancing:DescribeLoadBalancerAttributes" 그러지 않으면 targetgroupbinding 이 만들어지지 않는것 같습니다. 분명 대상 그룹도 만들어졌는데 kubernetes resource 로 만들어져있지 않아서 중간에 오류가 생겼거니 했습니다. kubectl describe svc svc-nlb-ip-type 로 오류 디버깅시 elasticloadbalancing:DescribeLoadBalancerAttributes 가 포함되지 않아 403 에러가 났다고 합니다. 처음 가이드에서는 모두 정상동작했을텐데, 이것이 시간이 지나 AWS 가 버전이 업데이트되며 생긴 변화인것일까요? 혹은 제 환경만 이상한 것일까요?ㅎㅎ; 혹은 추가 가이드가 있는데 제가 놓친것일까요?ㅎㅎ;

• 네트워크
• aws
• kubernetes
• amazon-eks
• eks

수강 기간 연장 문의

미해결

AWS Certified Solutions Architect - Associate 자격증 준비하기

안녕하세요 SAA자격증을 준비하며 강의 내용이 많은 도움이 되었습니다. Score가 부족해 재 응시 준비 중에 남은 수강 기간이 짧아 수강기간 연장 부탁 드립니다. 감사합니다.

• 네트워크
• aws

크롤링 결과 값이 달라요

미해결

[신규 개정판] 이것이 진짜 크롤링이다 - 실전편 (인공지능 수익화)

제가 RISS 크롤링 강의를 듣는데 저는 강사님과 다르게 결과물이 하나밖에 안 뜨는데 왜 그런지 잘 모르겠습니다. 이런식으로 한개 밖에 안 뜨네요. 파이썬에 import requests from bs4 import BeautifulSoup param = { 'isDetailSearch': 'N', 'searchGubun': 'true', 'viewYn': 'OP', 'strQuery': '패션 인공지능', 'order': '/DESC', 'onHanja': 'false', 'strSort': 'RANK', 'iStartCount': 0, 'sflag': 1, 'isFDetailSearch': 'N', 'pageNumber': 1, 'resultKeyword': '패션 인공지능', 'icate': 're_a_kor', 'colName': 're_a_kor', 'pageScale': 10, 'isTab': 'Y', 'query': '패션 인공지능', } response = requests.get(" https://www.riss.kr/search/Search.do ?", params=param) html = response.text soup = BeautifulSoup(html, 'html.parser') articles = soup.select (".srchResultListW > ul > li") # 헤더가 필요한 경우 header = { 'User-Agent' : 'Mozilla/5.0', 'Referer' : ' https://www.riss.kr/search/Search.do?isDetailSearch=N&searchGubun=true&viewYn=OP&queryText=&strQuery=%ED%8C%A8%EC%85%98+%EC%9D%B8%EA%B3%B5%EC%A7%80%EB%8A%A5&exQuery=&exQueryText=&order=%2FDESC&onHanja=false&strSort=RANK&p_year1=&p_year2=&iStartCount=0&orderBy=&mat_type=&mat_subtype=&fulltext_kind=&t_gubun=&learning_type=&ccl_code=&inside_outside=&fric_yn=&db_type=&image_yn=&gubun=&kdc=&ttsUseYn=&l_sub_code=&fsearchMethod=&sflag=1&isFDetailSearch=N&pageNumber=1&resultKeyword=%ED%8C%A8%EC%85%98+%EC%9D%B8%EA%B3%B5%EC%A7%80%EB%8A%A5&fsearchSort=&fsearchOrder=&limiterList=&limiterListText=&facetList=&facetListText=&fsearchDB=&icate=re_a_kor&colName=re_a_kor&pageScale=100&isTab=Y&regnm=&dorg_storage=&language=&language_code=&clickKeyword=&relationKeyword=&query=%ED%8C%A8%EC%85%98+%EC%9D%B8%EA%B3%B5%EC%A7%80%EB%8A%A5 ' } for article in articles: title = article.select _one(".title > a").text link = ' https://www.riss.kr/ ' + article.select _one(".title > a").attrs['href'] # 상세 페이지 요청 response = requests.get(link, headers=header, verify=False) html = response.text soup = BeautifulSoup(html, 'html.parser') press = soup.select _one(".infoDetailL > ul > li:nth-of-type(2) > div").text year = soup.select _one(".infoDetailL > ul > li:nth-of-type(5) > div").text print(title, link, press, year) 이렇게 했는데 왜 저는 결과물이 하나밖에 안나오는지 못찾겠어요..!

• python
• 웹-크롤링

가장 큰 위젯의 너비와 같은 너비를 차지하는 2열 짜리 컬럼

미해결

[Level 1] Qt를 이용한 Python 프로그래밍: 입문편

안녕하세요. 강의를 듣고 pyside로 데스크톱 어플리케이션을 만들고 있는 중에 있습니다. QGridLayout 안에 위젯들을 2열로 배치하였는데요, 이 위젯들이 위젯 아이템들 중 가장 너비가 넓은 것에 맞춰 같은 너비를 차지하면서도 위젯들이 윈도우 전체를 차지하지 않는(=커지거나 작아지지 않는) 방법이 있나요..? 생각보다 어려워서 며칠 째 끙끙대다 결국 질문남겨봅니다.

• python
• gui
• qt
• qml
• pyside6

서버 구동이 안됩니다.

미해결

자바와 스프링 부트로 생애 최초 서버 만들기, 누구나 쉽게 개발부터 배포까지! [서버 개발 올인원 패키지]

1..2일차 영상 보면서... 환경을 만드는데.... 서버 구동이 안됩니다. 초초초보입니다....... A problem occurred configuring root project 'library-app'. > Could not resolve all files for configuration ':classpath'. > Could not resolve org.springframework.boot:spring-boot-gradle-plugin:3.0.1. Required by: project : > org.springframework.boot:org.springframework.boot.gradle.plugin:3.0.1 > No matching variant of org.springframework.boot:spring-boot-gradle-plugin:3.0.1 was found. The consumer was configured to find a runtime of a library compatible with Java 8, packaged as a jar, and its dependencies declared externally, as well as attribute 'org.gradle.plugin.api-version' with value '7.5' but: - Variant 'apiElements' capability org.springframework.boot:spring-boot-gradle-plugin:3.0.1 declares a library, packaged as a jar, and its dependencies declared externally: - Incompatible because this component declares an API of a component compatible with Java 17 and the consumer needed a runtime of a component compatible with Java 8 - Other compatible attribute: - Doesn't say anything about org.gradle.plugin.api-version (required '7.5') - Variant 'javadocElements' capability org.springframework.boot:spring-boot-gradle-plugin:3.0.1 declares a runtime of a component, and its dependencies declared externally: - Incompatible because this component declares documentation and the consumer needed a library - Other compatible attributes: - Doesn't say anything about its target Java version (required compatibility with Java 8) - Doesn't say anything about its elements (required them packaged as a jar) - Doesn't say anything about org.gradle.plugin.api-version (required '7.5') - Variant 'mavenOptionalApiElements' capability org.springframework.boot:spring-boot-gradle-plugin-maven-optional:3.0.1 declares a library, packaged as a jar, and its dependencies declared externally: - Incompatible because this component declares an API of a component compatible with Java 17 and the consumer needed a runtime of a component compatible with Java 8 - Other compatible attribute: - Doesn't say anything about org.gradle.plugin.api-version (required '7.5') - Variant 'mavenOptionalRuntimeElements' capability org.springframework.boot:spring-boot-gradle-plugin-maven-optional:3.0.1 declares a runtime of a library, packaged as a jar, and its dependencies declared externally: - Incompatible because this component declares a component compatible with Java 17 and the consumer needed a component compatible with Java 8 - Other compatible attribute: - Doesn't say anything about org.gradle.plugin.api-version (required '7.5') - Variant 'runtimeElements' capability org.springframework.boot:spring-boot-gradle-plugin:3.0.1 declares a runtime of a library, packaged as a jar, and its dependencies declared externally: - Incompatible because this component declares a component compatible with Java 17 and the consumer needed a component compatible with Java 8 - Other compatible attribute: - Doesn't say anything about org.gradle.plugin.api-version (required '7.5') - Variant 'sourcesElements' capability org.springframework.boot:spring-boot-gradle-plugin:3.0.1 declares a runtime of a component, and its dependencies declared externally: - Incompatible because this component declares documentation and the consumer needed a library - Other compatible attributes: - Doesn't say anything about its target Java version (required compatibility with Java 8) - Doesn't say anything about its elements (required them packaged as a jar) - Doesn't say anything about org.gradle.plugin.api-version (required '7.5')

• java
• spring
• aws
• mysql
• spring-boot
• jpa

문자열 슬라이싱 질문입니다.

미해결

프로그래밍 시작하기 : 파이썬 입문 (Inflearn Original)

str = 'Nice Python' print(str[::-2]) <- 이거의 출력값이 nhy cN인 이유가 궁금합니다. 제 생각으로는 -2 간격이므로 otPei가 나와야할 것 같은데 n으로 시작하는 이유가 궁금합니다.

• python

배포 환경에서 fetch 오류

미해결

한 입 크기로 잘라먹는 Next.js

실제 https로 배포된 API를 fetch를 활용하여 SSR을 구현하고있습니다. 문제는 local에서는 yarn build -> yarn start 하고 테스트를 진행하면 fetch가 정상적으로 작동합니다. 하지만 AWS Amplify를 활용하여 Next JS를 배포하고 배포한 사이트에서 fetch(pending 이후에 catch로 빠짐)가 작동하지않습니다. API에 문제가 있나해서 다른 API를 CSR로 테스트를 해보면 정상적으로 200이 됩니다. 원인이 뭘까요?

• react
• typescript
• next.js

static 페이지vs 다이나믹 페이지

해결됨

한 입 크기로 잘라먹는 Next.js

폴라우트 페이지 2를 보면서 / 인덱스페이지가 강사님은 static 페이지가 아닌 다이나믹 페이지로 빌드가 되는 부분에서 강사님은 fetch에 force-cache를 적용시키면서 이제 다이나믹된 페이지를 static 페이지로 바꾸셨느데 일단 저는 force-cache 옵션을 적용을 안해도 static 페이지이더라구요 강사님과 저랑 다른 점은 api호출하는 함수 부분을 따로 api 폴더에 빼둔거 말고는 다른 점은 없습니다 . 이렇게 따로 빼놓은 뒤 그냥 promis.all로 데이터 패칭을 해서 그대로 화면에 보여줬습니다 (이것저것 시험하느라 Allbook ,RandomBook 컴포넌트를 따로 빼지는 않은 상태입니다. ) export default async function Home() { const [allBooks, randomBooks] = await Promise.all([ fetchBooks(), fetchRandomBook(), ]); 저는 force-cache 를 적용안햇는데도 왜 다이나믹 페이지가 안되고 static 페이지가 되는걸까요 ...

• react
• typescript
• next.js