안녕하세요 네이버 메일 자동화 코드를 실행하면 메일 쓰기 버튼을 계속 찾지 못하고 있어 어떻게 수정하면 될지 문의드립니다. 메일함 이동까지는 정상적으로 되고 있으나 메일 쓰기 버튼만 찾지 못하고 있습니다. 코드는 다음과 같습니다. from selenium.webdriver import ChromeOptions from selenium import webdriver from selenium.webdriver.chrome.service import Service as ChromeService from webdriver_manager.chrome import ChromeDriverManager from selenium.webdriver.common.by import By import time import pyperclip import pyautogui from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC options = ChromeOptions() options.add_experimental_option("detach", True) driver = webdriver.Chrome(service=ChromeService(ChromeDriverManager().install()), options=options) driver.get('https://nid.naver.com/nidlogin.login?mode=form&url=https://www.naver.com/') driver.maximize_window() # 화면 최대화 # 아이디 입력창 id = driver.find_element(By.CSS_SELECTOR, '#id') id.click() pyperclip.copy('eooe5173') pyautogui.hotkey('ctrl', 'v') time.sleep(2) # 비밀번호 입력창 passward = driver.find_element(By.CSS_SELECTOR, '#pw') passward.click() pyperclip.copy('ssw471395~') pyautogui.hotkey('ctrl', 'v') time.sleep(2) # 로그인 버튼 driver.find_element(By.CSS_SELECTOR, '#log\.login').click() time.sleep(5) # 메일함으로 이동 mailbox = driver.find_element(By.CSS_SELECTOR,'#shortcutArea > ul > li:nth-child(1) > a').click() time.sleep(5) # 내게 쓰기 버튼 writeme_button =driver.find_element(By.CSS_SELECTOR, '#root > div > nav > div > div.lnb_header > div.lnb_task > a.item.button_write').click() # 메일 제목 입력창 및 입력 mailname = driver.find_element(By.CSS_SELECTOR, '#subject_title').click() pyperclip.copy('안녕하세요') pyautogui.hotkey('ctrl', 'v') time.sleep(5) # 메일 내용 입력창 및 입력 mailinfo = driver.find_element(By.CSS_SELECTOR, '#body > div > div.workseditor-content').click() pyperclip.copy('네이버 메일 자동화입니다.') pyautogui.hotkey('ctrl', 'v') time.sleep(5) # 메일 저장 mailsave = driver.find_element(By.CSS_SELECTOR, '#content > div.mail_toolbar.type_write > div:nth-child(1) > div > button.button_write_task').click() time.sleep(5) 에러는 동일하게 다음과 같이 노출되고 있습니다. selenium.common.exceptions.NoSuchElementException: Message: no such element: Unable to locate element: {"method":"css selector","selector":"#root > div > nav > div > div.lnb_header > div.lnb_task > a.item.button_write"} (Session info: chrome=123.0.6312.123) Stacktrace: GetHandleVerifier [0x00D14CA3+225091] (No symbol) [0x00C44DF1] (No symbol) [0x00AE9A7A] (No symbol) [0x00B2175B] (No symbol) [0x00B2188B] (No symbol) [0x00B57882] (No symbol) [0x00B3F5A4] (No symbol) [0x00B55CB0] (No symbol) [0x00B3F2F6] (No symbol) [0x00B179B9] (No symbol) [0x00B1879D] sqlite3_dbdata_init [0x01189A43+4064547] sqlite3_dbdata_init [0x0119104A+4094762] sqlite3_dbdata_init [0x0118B948+4072488] sqlite3_dbdata_init [0x00E8C9A9+930953] (No symbol) [0x00C507C4] (No symbol) [0x00C4ACE8] (No symbol) [0x00C4AE11] (No symbol) [0x00C3CA80] BaseThreadInitThunk [0x764EFCC9+25] RtlGetAppContainerNamedObjectPath [0x77DE7C5E+286] RtlGetAppContainerNamedObjectPath [0x77DE7C2E+238]
제로초님 안녕하세요. 강의 활용 방안에 대해서 간단한 질문이 있어서 글 남깁니다. 제가 해당 강의를 듣는 이유는 Next.js에 대한 학습이며 이와 더불어 추가적으로 활용하시는 기술 (웹소켓 등) 을 함께 학습하는 것이며, 최대한 빠르게 개념을 잡고 혼자서 사이드 프로젝트 등을 만들며 익숙해지는 것이 목적입니다. 본래는 강의 초반부에 추천해주신 것처럼 일정 부분 강의를 수강한 후 올려주시는 예시 코드를 바탕으로 직접 코드를 짜며 비교해보는 방식으로 활용해보려 했습니다. 하지만 해당 방식에 다소 불편함이 있어서 (ex. 올려주신 예시 코드에서도 로그인/아웃 기능이 구현되지 않은 상황이라 화면 구현하는데 다소 불편함이 따르는 등) 먼저 강의를 보기만 하는 식으로 완강한 후 배운 내용을 바탕으로 혼자서 구현해보는 방식으로 활용해보려 합니다. 관련하여 혹시 보다 추천하시는 방법이 있으신지 궁금해서 질문글 남기게 되었습니다.
강의 언제나 잘보고 있습니다. 따로 작업하다가 난감한게 있어서 문의드립니다. 예를 들어 ["ABC"] 라는 캐시가 있다는 가정하에 A페이지, B페이지에서 해당 캐시를 사용합니다. 이때 질문이 있습니다. A,B 페이지에서 useQuery로 데이터를 불러올 경우 실수로 A와 B가 다른 queryFn이 정의 되어있을 때, InvalidateQueries를 해도 데이터가 미스매칭될 수 있는 가능성이 존재할까요? prefetchQuery 사용 시, A페이지와 B페이지가 ABC라는 데이터가 공통으로 필요할 경우, A페이지에서 prefetchQuery를 읽어서 B로 가면 A의 ABC를 캐시해서 B에서도 사용 가능한 걸로 알고있는데요. 이럴때 만일 B페이지로 바로 접근이 가능할 경우, B 페이지에서도 prefetchQuery를 적용해야 둘다 SSR이 제대로 적용되는걸까요?
10.3) React.memo와 컴포넌트 렌더링 최적화 위 강의를 보다보니, 뭔가 이상해서 질문드립니다... 여기서 Header컴포넌트에 memo함수로 감싸서 최적화된 컴포넌트를 만드셨다고 했는데, 영상으로만 보면 item 컴포넌트 변경시에 리랜더링이 안되야 하는 Header 컴폰넌트에 highLight가 들어가는데요..(4:46 경..) 아무리 봐도 하이라이트가 들어가는데, 말씀으로는 하이라이트가 더이상 들어가지 않는다고 하는데, 제가 뭘 잘못 이해한걸까요?
안녕하세요 선생님. 이번 강좌에서 숙제로 내주신 부분(div로 radio버튼 만들기) 을 진행하다가 문득 궁금증이 생겼는데요. <input type="radio">가 많을때 useRef을 하나씩 만들어서 일일이 1대1 매칭으로 접근해야 하는건가요? 혹은 ref값을 빈배열로 만든 뒤 배열의 값을 radio 버튼의 value로 채워서 해당 배열의 인덱스 값으로 참조해야하는 걸까요?
프론트 부분에서 ESLint 때문에 계속 에러를 겪고 있는데요,, 해결했다 싶으면 신기하게도 다음번 컴퓨터를 키면 또 에러가 생겨있고 그러는데요, 빨간색 에러는 없앴는데 노란색 경고글도 없애고 싶습니다. 아래 노란색 경고글들도 없앨수 있는 방법이 있을까요... 에러때문에 이것저것 시도하다가 뭔가 버전이 안맞는 걸까요...
fetch 함수를 사용할 때 next 객체 tags에 태그들을 지정해서 넣는 것으로 배웠습니다. 제가 이해하기로는 그 태그들로 분류되어 next가 캐싱하는 걸로 알고 있는데, 브라우저 쪽에서 작동하는 fetch(예를 들어 onclick에 붙어있는 fetch라든지... )와 next 서버 쪽에서 작동하는 fetch(예를 들어 api 디렉토리의 routes.ts에서 동작하는...)의 태그가 같다면 캐시 공유가 되나요? 브라우저는 브라우저 쪽에 서버 쪽 fetch는 서버 쪽에 저장될 것 같은데 어떻게 동작하는지 질문드립니다.
tanstack query와 next.js 를 함께 사용하면서 의문이 들어 질문합니다! 강의의 코드를 보니 같이 prefetch를 해도 유저데이터는 useQueryClient를 사용해서 데이터를 재사용하는듯한데 안에 하위 컴포넌트의 경우 prefetch를하고 useQuery를 사용해서 데이터를 가져오는듯 하더라구요 이 경우도 데이터를 재사용하는건가요? 아니면 새로 가져오는건가요? 그렇다면 똑같이 데이터를 prefetch해도 useQueryClient를 사용해서 가져오는것과 useQuery를 사용해서 가져와야하는 기준이 있을까요? (저의경우 프로젝트 전체를 prefetch후 useQueryClient를해서 데이터를 가져왔더니 데이터를 가져옴과 동시에 fresh가아니라 inactive상태가 되더라구요. ) 좋은강의 감사합니다. 벚꽃같은 제로초 화이팅
"홈탭 만들면서 Context API" 강좌를 듣고 localhost3000/home에 들어가면 localhost3000/[username] 경로로 들어가지다가(화면에 '프로필 페이지'라고 뜨는 것을 보니 이런 것 같습니다! ) 화면이 빈 화면으로 바뀝니다.. 그리고 왼쪽 섹션에 있는 프로필을 클릭하면 아래와 같은 오류가 뜹니다 ㅠ 무슨 문제일까요? 오류 내용 : ⨯ Error: Cannot find module '/Users/ryuhojun/Documents/z-com/.next/server/app/(afterLogin)/[username]/page.js' Require stack: - /Users/ryuhojun/Documents/z-com/node_modules/next/dist/server/require.js - /Users/ryuhojun/Documents/z-com/node_modules/next/dist/server/load-components.js - /Users/ryuhojun/Documents/z-com/node_modules/next/dist/build/utils.js - /Users/ryuhojun/Documents/z-com/node_modules/next/dist/server/dev/hot-middleware.js - /Users/ryuhojun/Documents/z-com/node_modules/next/dist/server/dev/hot-reloader-webpack.js - /Users/ryuhojun/Documents/z-com/node_modules/next/dist/server/lib/router-utils/setup-dev-bundler.js - /Users/ryuhojun/Documents/z-com/node_modules/next/dist/server/lib/router-server.js - /Users/ryuhojun/Documents/z-com/node_modules/next/dist/server/lib/start-server.js
수업에서는 '카운트다운 시작' 버튼 눌러서 Starter 함수가 실행되면 로컬 스토리지가 setInterval 함수로 인해 비워지기 때문에, CounterMaker 함수 내에 if문을 작성하여 해결하고 있습니다. 저는 이 방법 말고 사진처럼 starter 함수 내부에서 setInterval 함수(clearTimer라고 작성한..) 호출 위치를 조정하여 해결하였는데, 이 방법에 문제가 있을지 궁금합니다!
05-05-dynamic-routing-board-mutation 05-05-dynamic-routing-board-mutation-moved 계속해서 대조해보지만 게시글 등록하기를 누르고 moved 페이지로 넘어갈 때 404 오류가 뜹니다. catch에서 잡히지 않는걸로 보아 데이터 전송에서 문제가 있는건 아니지 않을까 싶은데, 아무리 봐도 해결책이 보이지 않아 질문 남깁니다.
안녕하세요 제로초님, 강의 잘듣고잇습니다!!! db시퀄라이즈 관계 설정? 질문좀 드리려고요. 강의듣고 블로그를 만들어보려고 백/프론트 구상하고 있는데요, db table설정?을 어떻게 해야할지 헷갈려서요. 메인 페이지는 전체 post를 카테고리(메뉴)별로 나눠서 보여줍니다. 메뉴[ study / TIL / portfolio ]를 클릭하면 해당 categories로 저장한 게시글을 보여줍니다 (노란화살표) 포스트 작성할 때는 하나의 categories를 선택합니다. 각 게시글은 하나의 카테고리만 가집니다! 헷갈리는 부분은 메뉴탭을 눌러서 study / TIL 로 이동했을 때, 전체 post를 가져오는 게 아니라 해당 categories의 post만 가져오고 싶은데, db를 활용해야 하는건지, 백엔드에서 필터링 과정을 해야 하는건지, 헷갈립니다 이때 categories를 관계형 테이블?로 만들어서 해당 카테고리로 post를 가져올 수 있나요???? 백엔드가 전체 db에서 post를 findAll로 가져와, 카테고리로 필터링해서 프론트로 넘겨줘야 하나요? 서버에서 전체 post를 받아서 프론트에서 필터링해서 각 컴포넌트에서 사용해야 하나요?? 흠. 뭔가 여러 방법이 떠오르긴 하는데 아직 시도해보지는 않았고 ㅎㅎㅎ 효율적인 방법이 뭔지 알고싶어요!! 제로초님이라면 어떤 방법을 사용하시나요?
안녕하세요 ! Next14 버전과 tanstack-qeury를 이용해 프로젝트를 진행하던 도중 궁금한 점이 생겨 질문드립니다. Next의 서버 컴포넌트에서 data를 prefetching 하여 사용하려면 다음과 같은 단계를 밟아야 하는 것으로 알고 있습니다. 1. 서버 컴포넌트에서 queryClient.prefetchQuery를 사용해 데이터를 불러오고 이를 dehydrate하여 HydrationBoundary 내에 state로 넘겨준다. 2. 데이터를 사용하는 컴포넌트에서 useQuery로 동일한 데이터를 불러오면 해당 데이터는 prefetch 된 상태로 넘어와 이를 사용한다. 현재 이를 토대로 아래 예시코드와 같이 작성하여 사용중입니다. 이 때 하위 컴포넌트에서 prefetch한 데이터를 사용하려면 useQuery를 써야하기에, 'use client' 를 사용해야하고, 그렇게 되면 그 하위 컴포넌트도 전부 Client Boundary에 들어오게 되는 것으로 알고있는데, 그럼 "Next를 사용하며 얻을 수 있는 장점이 줄어들지 않나 ?" 라는 의문이 생겼습니다. 제가 사용법을 잘못 알고있다거나 Next의 개념에 대해 부족한걸까요 ? 또, HydrationBoundary로 감싸지 않고 queryClient.getQueryData를 이용해 직접 데이터를 가져와 이를 props로 전달해도 기능은 정상적으로 작동하는데, 이 둘의 차이점이 정확히 무엇인가요 ? // 서버 컴포넌트 import { HydrationBoundary, dehydrate, QueryClient, } from "@tanstack/react-query"; import { QUERY_KEY } from "@/constants"; import { requestGetPushAlarmList } from "@/apis/notification"; import NotificationClient from "./Client"; export default async function Page() { const queryClient = new QueryClient(); await queryClient.prefetchQuery({ queryKey: [QUERY_KEY.PUSH_LIST], queryFn: () => requestGetPushAlarmList({}), }); // const { rows: pushList } = queryClient.getQueryData([ // QUERY_KEY.PUSH_LIST, // ]) as unknown as Rows<PushAlarm>; 예시 2. getQueryData로 데이터에 접근 return ( <HydrationBoundary state={dehydrate(queryClient)}> <NotificationClient /> </HydrationBoundary> // <NotificationList pushList={pushList} /> 예시2. props로 직접 데이터 전달 ); } // 하위 컴포넌트 "use client"; import { useQuery } from "@tanstack/react-query"; import { requestGetPushAlarmList } from "@/apis/notification"; import { QUERY_KEY } from "@/constants"; import NotificationList from "./_components/NotificationList"; import ScreenBox from "@/components/ui/ScreenBox"; import Empty from "@/components/ui/Empty"; export default function NotificationClient() { const { data } = useQuery({ queryKey: [QUERY_KEY.PUSH_LIST], queryFn: () => requestGetPushAlarmList({}), select: (data) => data.rows, }); return ( <> {!data?.length ? ( <ScreenBox.CenterBody> <Empty message="알림이 없습니다." /> </ScreenBox.CenterBody> ) : ( <NotificationList pushList={data} /> )} </> ); }
깃허브에 올려놓은 소스(next-app-router-z /ch3-1)을 다운받은후에 403 에러발생을 확인하기 위해서 아래의 주석을 해제했습니다. src/mocks/handlers.ts http.post('/api/users', async ({ request }) => { console.log('회원가입'); return HttpResponse.text(JSON.stringify('user_exists'), { status: 403, }) }) }), PostMan 에서 http://localhost:9090/api/users?id=js&password=pass&name=js7777 호출을 하면 status 값이 의도한 대로 403 Forbidden 이 출력이 됩니다. 그런데, 브라우저 개발자모드 Network 에서 보면 Status 값이 200 으로 출력됩니다. 서버에서는 분명 403 상태로 보냈고, PostMan에서도 403으로 상태값이 넘어오는데, 왜? 개발자 도구(Network)에서만 상태값이 200으로 출력되는지 모르겠습니다.
