이번에도 역시나 스터디장님께서 떠먹여 주시는 요거트를 맛있게 먹었습니다.
Cursor로 Vibe coding해서 뉴스 크롤링도 가능하군요.
정말로 디 테일하게 모든 설정과 절차, 방법들을 친절하고 자세하게 정리해 주셔서
역시 이번에도 거의 에러 없이 실습은 30분컷으로 완료한 것 같습니다.
사실 30분 중에 20분 정도는 HTML에서 element 선택하는 것에 익숙하지 않아서 버벅거린 것이고
코드 짜는 것과 실행하는 것은 거의 에러 없이 한 것 같네요
방법은 스터디장님 가이드 대로 해서 따로 적을 것은 없는 것 같고,
지난번에 이어서 또 해보니
좀 더 주입식 교육(?) 느낌으로 몸에 체화되는 기분입니다.
그리고 element와 selector가 무엇인지 몰라서 Claude 선생님에게 물어봐서 감을 좀 잡았습니다
Element (요소)
Element는 HTML 문서를 구성하는 실제 구성 요소입니다.
html
<div class="news-item">
<h2>뉴스 제목</h2>
<p>뉴스 내용...</p>
</div>위의 <div>, <h2>, <p> 같은 것들이 모두 element예요. 웹페이지에 실제로 존재하는 "물건"이라고 생각하면 됩니다.
Selector (선택자)
Selector는 특정 element를 찾기 위한 "주소" 또는 "검색 패턴"입니다.
css
/* CSS Selector 예시 */
.news-item /* class가 news-item인 요소 */
#main-title /* id가 main-title인 요소 */
div > p /* div의 직접 자식인 p 요소 */핵심 차이점
ElementSelector실제 존재하는 것 (명사)찾는 방법 (검색어)웹페이지의 실제 구성 요소요소를 선택하기 위한 패턴예: <div class="box">예: .box 또는 div.box비유로 이해하기
Element: 실제 건물
Selector: 건물의 주소 (예: "서울시 강남구 테헤란로 123")
Jaeyoung님이 n8n이나 웹 스크래핑 작업할 때, selector를 사용해서 원하는 element를 찾아내는 거예요. 이미지에서 "Copy selector" 메뉴가 보이는데, 이건 해당 element를 찾을 수 있는 selector 코드를 복사하는 기능입니다!
저는 '환율'에 관심이 있어서 환율로 했습니다.
한국어 텍스 트 편집기의 스크린샷
스터디장님 조언대로 다운로드 폴더 밑에 Cursor 폴더를 만들고
클로드코드의 지원사격하에 만들어 나갔습니다.
GUI와 EXE 파일까지 만들었습니다.
Windows 10의 파일 폴더 스크린샷
크롤링도 성공이고 excel file로 잘 만들어주네요
Microsoft Word 문서의 스크린샷
네이버 말고 미국 주식 관련한 사이트들을 한 번 크롤링 해보는 것으로 다시 도전해보겠습니다.
감사합니다. 🙇 👍 🥰
