나만의 코드 공방

코드로 놀고, 언어로 성장하는 공방.

목록

'전체 글' 740건

코드로 놀고, 언어로 성장하는 공방.

  • 1년치 금 시세 크롤링하기
    바이브 코딩/Cursor AI · 댓글
    01 먼저 개발자 도구를 열어 데이터를 살펴봅니다. 크롬 브라우저에서 F12를 누르거나 마우스 오른쪽 클릭을 한 다음 [검사]를 누르면 개발자 도구가 열립니다. 여기 위쪽에 있는 [Elements] 또는 [요소]라는 탭을 찾아 눌러봅니다. 한국금거래소 홈페이지https://www.soongumnara.co.kr/price/gold 순금나라금매입, 골드바/실버바 판매, 금시세(금값시세), 은시세 정보 제공, 다이아몬드 매입, 전국 대리점 안내!www.soongumnara.co.kr 그러면 요소에 나 , 와 같이 꺽쇠 괄호로 감싸진 데이터가 보일 것입니다. 이렇게 꺽쇠 괄호로 가둔 형태의 무언가를 HTML 태그라고 합니다. 보통 웹 사이트는 이런 태그 안이나 태그 서버에 데이터를 입력해 구성합니다. 02 [..
  • <c:redirect> 태그를 이용한 실습
    프로그래밍 언어/자바 웹 · 댓글
    태그는 지정된 JSP 페이지로 리다이렉트할 때 사용합니다. response.sendRedirect() 기능과 동일하며 태그로 리다이렉트할 때 매개변수를 전달할 수 있습니다. 사용 형식은 다음과 같습니다. [ ] 여기서 url은 리다이렉트 될 URL이 저장될 변수를 지정합니다. 1. 태그를 이용해 회원 정보 출력 창으로 리다이렉트합니다. 리다이렉트하면서 회원 정보를 매개변수로 전달합니다. 2. http:localhost:8080/pro14/test03/redirectTest.jsp로 요청하면 test01/member1.jsp로 리다이렉트됩니다. 그러면서 매개변수로 전달한 회원 정보를 출력합니다.
  • 종목별 시가총액 데이터 수집하기 - 데이터 정제하기
    프로그래밍 언어/Python · 댓글
    웹 환경에서 수집한 데이터는 정제가 필요합니다. 이런 작업에는 pandas 패키지를 사용하는 것이 적합합니다. 앞서 수집한 데이터는 header와 body가 키고, 각 키에 리스트 타입의 값이 짝지어진 딕셔너리 타입입니다. 딕셔너리를 pandas 패키지의 데이터프레임으로 변환하고 데이터프레임에서 불필요한 행과 열, 공백 문자를 삭제하겠습니다. 비주얼 스튜디오 코드에서 새로운 파일을 만들고, 파일 명을 'step_1_4.py'로 자정합니다. 다음 코드를 입력한 뒤 대화형 창에서 실행합니다. 앞서 수집한 데이터가 CSV 파일로 저장됩니다.import jsonfrom pathlib import Pathimport pandas as pdfrom step_1_1 import OUT_DIR # 이전에 작성한 모듈을..
  • 실시간 경매 시스템 - 서버센트 이벤트 사용하기(2)
    프로그래밍 언어/NODE JS · 댓글
    서버센트 이벤트는 한 가지 단점이 있습니다. IE나 엣지 브라우저에서 사용할 수 없다는 것입니다. EventSource라는 객체를 지원하지 않기 때문인데, 다행히 EventSource를 사용자가 직접 구현할 수 있습니다. IE나 엣지 브라우저를 위해 클라이언트 코드에 EventSource 폴리필(polyfill)을 넣었습니다. views/main.html{% extends 'layout.html' %} {% block content %} 경매 진행 목록 상품명 이미지 시작 가격 종료 시간 입장 {% for good in goods %} {{good.name}} {{good.p..
  • <c:url> 태그를 이용한 실습
    프로그래밍 언어/자바 웹 · 댓글
    테스트는 JSP 페이지에서 URL 정보를 저장하는 역할을 하며, 사용 형식은 다음과 같습니다. [] .. 여기서 var은 생성된 URL이 저장될 변수를, value는 생성한 URL을, scope는 scope 속성의 값을 지정합니다. 1. ulTest.jsp를 다음과 같이 작성합니다. 태그를 이용해 다른 페이지로 이동하면서 데이터를 전달합니다. 따라서 이동할 페이지로 전달할 데이터가 많을 경우에 사용하면 편리합니다. 회원정보출력 --%> 회원정보출력 2. http://localhost:8080/pro14/test03/urlTest.jsp로 요청한 후 회원정보출력을 클릭합니다. 3. 매개변수로 전달된 회원 정보를 출력합니다. (member1.jsp에서 ${속성}을 ${para..
  • 메모 앱에 회원가입, 로그인, 로그아웃, 메모 저장 기능 더하기
    바이브 코딩/Cursor AI · 댓글
    v0에 접속하여 로그인하고 다음과 같이 요청해서 간단히 메모 앱을 만듭니다. 밝은 분위기의 메모 앱 화면을 만들어줘. 만든 메모 앱 화면 오른쪽 위의 · · · 버튼에 있는 [Download ZIP] 버튼을 눌러 다운로드 한 후 my-awesome-memoapp 폴더를 만든 후 폴더에 압축을 풉니다. 이제 커서가 작업할 수 있도록 my-awesome-memoapp 폴더를 엽니다.작업할 프로젝트 폴더가 가장 맨 위에 있는 상태에서 새 채팅창을 열고 다음과 같이 요청합니다. 현재 프로젝트에 데이터베이스를 추가하고 회원가입, 로그인, 로그아웃을 구현해줘. 커서는 아마 프리즈마라는 도구를 설치하여 데이터베이스와 프로젝트를 연결하는 설정을 하겠다고 할 겁니다. [Run]을 눌러 실행합니다. 프리즈마는 데이..

바이브 코딩/Cursor AI

1년치 금 시세 크롤링하기

01 먼저 개발자 도구를 열어 데이터를 살펴봅니다. 크롬 브라우저에서 F12를 누르거나 마우스 오른쪽 클릭을 한 다음 [검사]를 누르면 개발자 도구가 열립니다. 여기 위쪽에 있는 [Elements] 또는 [요소]라는 탭을 찾아 눌러봅니다. 한국금거래소 홈페이지https://www.soongumnara.co.kr/price/gold 순금나라금매입, 골드바/실버바 판매, 금시세(금값시세), 은시세 정보 제공, 다이아몬드 매입, 전국 대리점 안내!www.soongumnara.co.kr 그러면 요소에 나 , 와 같이 꺽쇠 괄호로 감싸진 데이터가 보일 것입니다. 이렇게 꺽쇠 괄호로 가둔 형태의 무언가를 HTML 태그라고 합니다. 보통 웹 사이트는 이런 태그 안이나 태그 서버에 데이터를 입력해 구성합니다. 02 [..

프로그래밍 언어/자바 웹

<c:redirect> 태그를 이용한 실습

태그는 지정된 JSP 페이지로 리다이렉트할 때 사용합니다. response.sendRedirect() 기능과 동일하며 태그로 리다이렉트할 때 매개변수를 전달할 수 있습니다. 사용 형식은 다음과 같습니다. [ ] 여기서 url은 리다이렉트 될 URL이 저장될 변수를 지정합니다. 1. 태그를 이용해 회원 정보 출력 창으로 리다이렉트합니다. 리다이렉트하면서 회원 정보를 매개변수로 전달합니다. 2. http:localhost:8080/pro14/test03/redirectTest.jsp로 요청하면 test01/member1.jsp로 리다이렉트됩니다. 그러면서 매개변수로 전달한 회원 정보를 출력합니다.

프로그래밍 언어/Python

종목별 시가총액 데이터 수집하기 - 데이터 정제하기

웹 환경에서 수집한 데이터는 정제가 필요합니다. 이런 작업에는 pandas 패키지를 사용하는 것이 적합합니다. 앞서 수집한 데이터는 header와 body가 키고, 각 키에 리스트 타입의 값이 짝지어진 딕셔너리 타입입니다. 딕셔너리를 pandas 패키지의 데이터프레임으로 변환하고 데이터프레임에서 불필요한 행과 열, 공백 문자를 삭제하겠습니다. 비주얼 스튜디오 코드에서 새로운 파일을 만들고, 파일 명을 'step_1_4.py'로 자정합니다. 다음 코드를 입력한 뒤 대화형 창에서 실행합니다. 앞서 수집한 데이터가 CSV 파일로 저장됩니다.import jsonfrom pathlib import Pathimport pandas as pdfrom step_1_1 import OUT_DIR # 이전에 작성한 모듈을..

프로그래밍 언어/NODE JS

실시간 경매 시스템 - 서버센트 이벤트 사용하기(2)

서버센트 이벤트는 한 가지 단점이 있습니다. IE나 엣지 브라우저에서 사용할 수 없다는 것입니다. EventSource라는 객체를 지원하지 않기 때문인데, 다행히 EventSource를 사용자가 직접 구현할 수 있습니다. IE나 엣지 브라우저를 위해 클라이언트 코드에 EventSource 폴리필(polyfill)을 넣었습니다. views/main.html{% extends 'layout.html' %} {% block content %} 경매 진행 목록 상품명 이미지 시작 가격 종료 시간 입장 {% for good in goods %} {{good.name}} {{good.p..

프로그래밍 언어/자바 웹

<c:url> 태그를 이용한 실습

테스트는 JSP 페이지에서 URL 정보를 저장하는 역할을 하며, 사용 형식은 다음과 같습니다. [] .. 여기서 var은 생성된 URL이 저장될 변수를, value는 생성한 URL을, scope는 scope 속성의 값을 지정합니다. 1. ulTest.jsp를 다음과 같이 작성합니다. 태그를 이용해 다른 페이지로 이동하면서 데이터를 전달합니다. 따라서 이동할 페이지로 전달할 데이터가 많을 경우에 사용하면 편리합니다. 회원정보출력 --%> 회원정보출력 2. http://localhost:8080/pro14/test03/urlTest.jsp로 요청한 후 회원정보출력을 클릭합니다. 3. 매개변수로 전달된 회원 정보를 출력합니다. (member1.jsp에서 ${속성}을 ${para..

바이브 코딩/Cursor AI

메모 앱에 회원가입, 로그인, 로그아웃, 메모 저장 기능 더하기

v0에 접속하여 로그인하고 다음과 같이 요청해서 간단히 메모 앱을 만듭니다. 밝은 분위기의 메모 앱 화면을 만들어줘. 만든 메모 앱 화면 오른쪽 위의 · · · 버튼에 있는 [Download ZIP] 버튼을 눌러 다운로드 한 후 my-awesome-memoapp 폴더를 만든 후 폴더에 압축을 풉니다. 이제 커서가 작업할 수 있도록 my-awesome-memoapp 폴더를 엽니다.작업할 프로젝트 폴더가 가장 맨 위에 있는 상태에서 새 채팅창을 열고 다음과 같이 요청합니다. 현재 프로젝트에 데이터베이스를 추가하고 회원가입, 로그인, 로그아웃을 구현해줘. 커서는 아마 프리즈마라는 도구를 설치하여 데이터베이스와 프로젝트를 연결하는 설정을 하겠다고 할 겁니다. [Run]을 눌러 실행합니다. 프리즈마는 데이..

티스토리툴바