본문 바로가기
반응형

Web Application7

localhost(로컬호스트)를 http(웹서비스)로 변환하는 방법(feat. ngrok) 안녕하세요. Python & FastAPI를 이용하여 자동매매 프로그램을 개발하고 있는 인천고래입니다. 정식 웹 서비스를 제공하기 전에 로컬에서 테스트를 많이 하는데실제 서버에 베타 버전을 올리기 이전에 로컬에서라도 외부 접근이 가능하게 만드는 서비스가 있어서 소개차 글을 작성합니다.  ngrok은 로컬에서 실행 중인 웹 서버를 외부 인터넷에서 접근할 수 있는 공개 URL로 노출시키는 터널링 서비스를 제공합니다. 이를 통해 로컬 환경에서 개발 중인 애플리케이션을 손쉽게 외부 사용자 또는 클라이언트에게 보여줄 수 있어서 웹훅 테스트, API 개발, 데모 등을 위해 매우 유용합니다. ngrok 주요 기능 HTTP/HTTPS 터널링: 로컬 웹 서버를 안전한 HTTP 및 HTTPS URL로 노출시킵니다.TCP .. 2024. 6. 23.
data-* : HTML5에서 도입된 사용자 정의 데이터 속성 안녕하세요. 인천고래입니다. HTML 작업을 하다 보면 하나의 페이지에 수많은 화면이 표현되다 보니 자연스럽게 HTML코드 및 스타일 & 자바스크립트까지 포함되어 코드량이 자연스럽게 늘어나서 차후에 수정할 일이 생겨서 찾으려 하면 시간이 오래 걸리는 비효율적인 상황들이 발생됩니다. 이런 경우에는 외부 파일로 만들어 놓고 필요할 때에만 불러오는 형식으로 만들어두면 수정할 사항이 발생될 경우 외부 파일 내의 코드만 살펴보면 일이 쉽게 풀리기도 합니다. 이렇게 모듈화(Modularization) 또는 컴포넌트 기반 개발(Component-Based Development) 을 하게 되면 코드의 재사용성을 높이고, 유지 관리를 용이하게 하며, 대규모 애플리케이션의 개발 및 관리를 효과적으로 할 수 있도록 돕습니다.. 2024. 5. 12.
웹 스크래핑을 통한 비동기 프로그래밍 필요성의 이해 안녕하세요. 인천고래입니다. 이번 글에서는 비동기와 동기식 함수를 만들고 호출하는 방법에 대해 알아보는 시간을 가져보도록 하겠습니다. 프로그래밍을 하다 보면 간단한 데이터를 가져오거나 연산을 하는 경우도 발생이 되고 대용량 데이터를 DB에서 가져오기도 합니다. 그리고 웹 상에서 필요한 데이터를 추출하기도 하죠. 컴퓨터가 고사양이 되다보니 데이터를 연산하는 속도가 빨라지다 보니 결과도 빠르게 나오게 되는데 외부에서 필요한 데이터를 추출하는 과정을 거치는 작업은 네트워크를 거치다 보니 당연히 결과를 얻는데 시간 지연이 발생되게 됩니다. 위의 과정을 아래와 같이 기능별로 항목을 구분하여 함수화 하고 동기식 처리 형태로 코드를 구현해 보도록 하겠습니다. 기능 항목 연산작업 웹 스크래핑 동기식 프로그래밍 파이썬 .. 2024. 4. 5.
데이터 종류에 따른 Flask 서버 & 클라이언트측 코드 이번 글에서는 Flask 서버로부터 데이터를 받아와서 클라이언트에서 처리하는 예시들을 하나의 HTML 코드로 감싸서 보여드리겠습니다. 각각 HTML, JSON, XML 데이터를 처리하는 방법에 대한 설명도 함께 제공하도록 하겠습니다. 목차 1. 플라스크 서버 측 코드 1-1. Flask에서 클라이언트로 HTML 태그 반환 1-2. Flask에서 클라이언트로 JSON 반환 1-3. Flask에서 클라이언트로 XML 반환 1-4. Flask에서 클라이언트로 HTML Template 반환 2. 클라이언트 측 자바스크립트 & HTML 코드 2-1. HTML 데이터 처리 (클라이언트측 HTML) 2-2. JSON 데이터 처리 (클라이언트측 HTML) 2-3. XML 데이터 처리 (클라이언트측 HTML) 웹 페이지.. 2024. 2. 18.
클라이언트 요청에 응답하는 Flask 서버 코드 이전 글에서는 Flask 서버에 데이터를 요청하기 위한 클라이언트측 자바스크립트(Ajax) 코드에 대해 알아보았습니다. 이번 글에서는 Falsk 서버는 클라이언트 측에서 보낸 AJAX 요청에 따라 필요한 데이터를 처리하고 응답을 반환하도록 되어 있는데 AJAX 요청을 처리하기 위한 Flask 서버 측 예시 코드를 예시와 함께 설명을 드리도록 하겠습니다. 1. 페이지 로딩 시 데이터를 요청하는 경우의 Flask 코드 클라이언트는 서버의 특정 엔드포인트(/some-endpoint)로 GET 요청을 보내고. 서버는 이 요청을 받고 필요한 데이터를 조회한 후 JSON 형태로 클라이언트에 응답하는 구조로 이루어집니다. # 파이썬 코드로 이루어진 플라스크 선언부 from flask import Flask, json.. 2024. 2. 18.
AJAX를 사용하여 서버(Flask)에 데이터를 요청하는 두 가지 방법 클라이언트에서는 데이터를 표시하기 위해 일반적인 2가지 방식을 제공합니다. 사용자가 URL로 접속하여 일반적으로 페이지가 로딩이 될 때 특별한 행동을 하지 않아도 페이지가 로드되는 것처럼 접속할 때 서버로 요청을 보내는 방식과 사용자의 행동에 의해 서버로 특정 데이터를 요청하는 경우입니다. 오늘은 클라이언트에서 Flask 서버로 데이터를 요청하는 방법 2가지에 대해 아래의 예시 코드와 함께 설명을 드리도록 하겠습니다. Flask에서 응답하는 경우에 대해서는 다음 글에 설명을 드리도록 하겠습니다. 이전의 글을 확인하시려면 아래의 글을 확인해주세요. Flask + JavaScript 데이터 전송 방향에 따른 구분(파이썬을 이용한 웹 서비스 만들기) 혹시 파이썬으로 만들어 놓은 어플리케이션을 웹 어플리케이션으.. 2024. 2. 18.
Flask + JavaScript 데이터 전송 방향에 따른 구분(파이썬을 이용한 웹 서비스 만들기) 혹시 파이썬으로 만들어 놓은 어플리케이션을 웹 어플리케이션으로 바꿀 계획이 있으신가요? 탁월한 선택을 하셨습니다. 특히나 파이썬을 이용해서 자동매매를 하기 위해 OpenAPI로 연계한 상태에서도 웹 애플리케이션으로 서비스를 할 수도 있습니다. 우선은 웹 애플리케이션에서 서버와 클라이언트 간에 데이터를 주고받는 방법에 대해 알고 계실 필요가 있습니다. 이번 글에서는 Server-Sent Events(SSE)와 AJAX를 중심으로, 각각의 특징과 작동 방식을 비교하여 설명드리겠습니다. 데이터 전송 방향에 따른 호출 방식 구분 SSE : Flask 서버에서 클라이언트로 단방향 데이터를 보내는 경우 AJAX : 클라이언트에서 Flask 서버로 요청을 하고 Flask 서버에서 클라이언트로 응답을 하는 경우 Ser.. 2024. 2. 18.
반응형