HTML에서 파이썬 코드를 작성할 수 있다고? 😲
#Pyscript #Python #Front-end #HTML/CSS
아나콘다 공식 트위터에서 밝힌 파이스크립트의 소식 ⓒTwitter
지난 5월, PyCon US 2022 컨퍼런스가 진행됐습니다. 이번 PyCon US 2022에서 가장 주목을 받은 주제 중 하나는 바로 '파이스크립트(PyScript) 프로젝트'인데요. 아나콘다(Anaconda)*는 HTML 내부에서 직접 파이썬(Python)을 작성하고, 실행할 수 있는 파이스크립트를 발표했습니다.
HTML에서 파이썬을 실행할 수 있다니! 파이스크립트의 등장으로 많은 개발자들은 놀라지 않을 수가 없었을 것 같은데요. 파이스크립트가 등장한 이유와, 실행 방법 그리고 앞으로 가져올 변화는 무엇일까요? 직접 알파 버전*을 체험해 보며, 파이스크립트에 대해 알아보도록 할게요.
* 아나콘다(Anaconda) ?
아나콘다는 세계에서 가장 인기 있는 데이터 과학 플랫폼으로 데이터 과학 및 머신러닝의 패키지가 포함되어 있는 파이썬 배포판입니다. 수천 개의 오픈 소스 패키지와 라이브러리가 포함되어 있습니다.
* 아직은 알파 버전인 파이스크립트!
파이스크립트는 아직 완전히 개발이 다 이루어지지 않은 상태입니다. 여전히 개발 중이며, 그 과정에서 변경 사항이 많이 생길 수도 있다고 해요. 또, 로딩 시간 지연이나 사용 편의성 문제도 존재하고요. 따라서 파이스크립트를 탐색하고 실행해 보는 건 가능하지만, 실제 활용까지는 아직 권장되지 않고 있어요.
파이썬 코드를 웹 브라우저에서 실행시킬 수 있다?!
파이스크립트 실행 방법과 기대점은 무엇일까요?
파이스크립트를 직접 실행하며 알아보아요. 🔍
세계에서 가장 인기있는 언어
파이썬에게도 있는 단점!
2021년 7월 TIOBE 프로그래밍 언어 순위 ⓒTIOBE
파이썬(Python)은 2021년 가장 인기 있는 프로그래밍 언어 3위로, 지난 몇 년간 가장 '핫'한 언어 중 하나로 떠올랐습니다. 파이썬은 데이터 분석과 시각화 및 머신러닝, 딥러닝의 인공지능 분야에서 쓰일 뿐만 아니라, 장고(Django), 플라스크(Flask)와 같은 파이썬 기반 프레임워크와 함께 백엔드에서도 활용되고 있어요.
다양한 분야에서 사용할 수 있어 많은 사람들이 가장 배우고 싶은 언어 중 하나인 파이썬은 치명적인 단점이 하나 있습니다. 바로 사용자 인터페이스 개발이 어렵다는 것인데요. 예를 들면, 파이썬으로는 앱 구축이 어렵고, 웹과 상호작용하기 위해서도 HTML, CSS, JS를 반환하는 애플리케이션 서버로 실행해야만 가능해야만 합니다. 이러한 단점들은 '세계에서 가장 인기 있는 프로그래밍 언어'인 파이썬의 모순점으로 남겨져 왔어요.
파이썬의 단점을 해결하러 왔다.
파이스크립트의 등장!
아나콘다 CEO Peter Wang: "(파이썬은) 가장 인기 있는 프로그래밍 언어이지만,
사용자 인터페이스로 쉽게 무언가를 만들 수 없다는 사실은 좀 이상하네요, 하지만 흥미롭지 않나요? 😎"
아나콘다 CEO인 Peter Wang 역시 파이썬의 모순에 주목했습니다. 이러한 세계에서 가장 인기 있는 언어 파이썬의 모순점을 해결하고자 등장한 게 바로 파이스크립트입니다. 파이스크립트는 유저가 표준 HTML과 모던 웹 기술을 사용하여 브라우저에서 다양한 파이썬 기반 애플리케이션을 만들 수 있도록 지원하는 프레임워크에요.
기존에 파이썬은 HTML 및 자바스크립트를 반환하는 애플리케이션 서버로 실행해야만 자바스크립트 또는 웹 페이지와 상호작용할 수 있었어요. 하지만 파이스크립트를 활용하면 자바스크립트를 사용하지 않고 파이썬만 활용하여 서버와 통신할 필요가 없는 웹 사이트를 구축할 수 있다는 점에서 매우 간편한데요. 한 마디로, HTML 페이지에서 자바스크립트만큼 쉽게 파이썬 스크립트를 실행할 수 있도록 도와주는 것이죠. 이러한 파이스크립트의 장점은 기존의 파이썬이 가지고 있던 단점을 해결해 줄 수 있을 것으로 기대하고 있어요.
파이스크립트는 기능 또한 다양합니다. 파이스크립트 공식 홈페이지에서 말하는 파이스크립트의 기능은 다음과 같아요.
브라우저 내 파이썬: 서버 구성에 의존하지 않고 콘텐츠, 외부 파일 호스팅 및 애플리케이션 호스팅을 지원합니다.
파이썬 생태계: 파이썬과 과학 분야(numpy, panda, scikit-learn 등)의 인기 있는 많은 패키지 실행이 가능합니다.
파이썬과 자바스크립트: 객체 및 네임스페이스 간의 양방향 통신이 가능합니다.
환경 관리: 사용자가 Visual 응용프로그램 개발을 실행하기 위해 페이지 코드에 포함할 패키지 및 파일을 정의할 수 있습니다. 버튼, 컨테이너, 텍스트 상자 등과 같이 쉽게 사용할 수 있는 큐레이션 된 UI 구성 요소를 사용합니다.
유연한 프레임워크: 파이썬에서 직접 새롭게 실행하고 확장 가능한 구성 요소를 생성하고 공유할 수 있는 유연한 프레임워크입니다.
파이스크립트 알파 버전 체험기
1️⃣ 실행 방법
이제 파이스크립트를 직접 실행해 볼까요? 파이스크립트의 알파 버전 배포는 파이스크립트 공식 홈페이지에서 참고할 수 있어요. 아주 간단한 방법으로 파이스크립트를 연결하고, 실행해 볼 수 있답니다. 그럼 한 번 실행해 볼게요!
파이스크립트는 세 가지 주요 태그가 있어요.
- <py-env>는 파이썬 코드를 실행하는 데 필요한 파이썬 패키지를 정의합니다.
- <py-script>는 웹 페이지 내에서 실행되는 파이썬 코드를 작성하는 곳입니다.
- <py-repl>은 사용자가 입력한 코드를 평가하고 결과를 표시하는 REPL(읽기 평가 인쇄 루프) 구성 요소를 만듭니다.
1. 통합 개발 환경 ON!
통합 개발 환경에 먼저 HTML 파일을 생성을 합니다. (실행을 위해 Repl.it을 이용했어요!)
2. 파이스크립트 연결 코드
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
HTML에 PyScript를 연결하기 위해, 위 코드를 <head>태그에 배치합니다.
3. 브라우저에서 실행
<py-script> 태그는 웹 브라우저에 실행할 파이썬 코드를 작성하는 곳입니다. 웹 브라우저에 'Hello, World!'를 출력하기 위해 <body> 태그 안에 다음과 같이 작성합니다.
<py-script>print('Hello, World')</py-script>
<py-script>는 위처럼 코드를 직접 작성하거나, 작성된 파이썬 파일(.py)을 불러올 수도 있습니다.
<py-script src="./python_file.py"> </py-script>
4. 실행 확인
웹 서버 연결 없이 바로 웹 브라우저에서 실행이 되네요! Hello, World도 잘 출력 되는 걸 확인할 수 있어요.
* 참고: 파이스크립트는 아직 다른 웹 브라우저에서 코드 동작에 약간의 차이가 있을 수 있어 Google Chrome 웹 브라우저에서의 테스트를 권장하고 있습니다.
전체 HTML & pyscript 코드
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
<title>Document</title>
</head>
<body>
<py-script>print('Hello, World!')</py-script>
</body>
</html>
파이스크립트 알파 버전 체험기
2️⃣ 다양한 예제 미리 보기
파이스크립트는 파이썬의 다양한 라이브러리를 브라우저에서 바로 실행할 수 있는 장점이 있어요. 데이터 분석, 시각화 및 머신러닝, 딥러닝 분야에서 많이 사용되는 과학 계산용 라이브러리인 넘파이(NumPy), 판다스(Pandas), 사이킷런(Scikit-learn) 등을 웹으로 확장할 수 있는데요. 파이썬의 장점을 활용한 다른 예제들도 한 번 알아볼까요? (더 다양한 예제는 파이스크립트 예제 페이지에서 참고할 수 있어요.)
1. Folium 지도 데이터 시각화
파이썬 지도 라이브러리인 Folium을 활용하여 미국 실업률을 시각화한 결과를 웹에서 보여줍니다. (웹에서 실행하기☑️)
2. K평균 알고리즘 (KMeans clustering) 시각화
사이킷런(Scikit-learn)내 데이터와 KMeans 알고리즘을 활용한 데이터 분석 결과를 웹에 시각화하여 보여줍니다. (웹에서 실행하기☑️)
99%를 위한 프로그래밍을 꿈꿔요
파이스크립트가 갖는 진짜 목표 📣
python + javascript = pyscript!? ⓒReddit
파이스크립트의 등장과 함께 파이스크립트가 자바스크립트를 대체할 수 있는지의 여부도 큰 화제가 되었는데요. 아쉽게도(?) 그렇진 않을 것으로 예상됩니다. 그럼 궁극적인 파이스크립트의 목적과 기대하는 점은 무엇일까요?
아나콘다 CEO는 파이스크립트가 앞으로 소프트웨어를 배우는 장벽을 낮출 수 있을 것을 기대한다고 말했습니다. 파이썬은 비교적 배우기 쉬운 프로그래밍 언어로 알려지면서 입문용, 교육용으로 가장 많이 접하고 있어요. 하지만 파이썬을 통한 실전 프로그래밍 경험은 어렵다는 단점이 있습니다. 예를 들면, 입문 단계에서 파이썬을 배웠으나, 웹이나 앱 구현 등 구체적인 소프트웨어적 경험을 쌓기에 파이썬은 한계가 있어, 새롭게 다른 프로그래밍 언어를 배워야 하는 것이죠.
하지만 파이스크립트는 파이썬의 그런 단점을 극복할 수 있는 중요한 역할을 합니다. 이제 파이썬 하나로 프로그래밍 입문부터 데이터 분석가, 데이터 개발자, 웹 개발자 등 다양한 소프트웨어적 경험을 체험할 수 있는 것인데요. 비록 현재는 알파 버전이지만, 앞으로 파이스크립트를 통해 소프트웨어 교육의 장벽이 더 낮아지고, 보다 더 재밌고 쉽게 프로그래밍을 배울 수 있기를 기대해봅니다.
💡 더 자세한 내용이 궁금하다면 아래 페이지를 참고하세요!
[주간 인프런]의 새 이름, [인프메이션]!
매달 첫번째 & 세번째 화요일마다 찾아오는 인프런 뉴스레터,
[헬로 인프런]으로 가장 빨리 인프메이션을 받아보세요!
지난 [인프메이션] 이 궁금하다면? (클릭)
헬로 인프런 구독하러 가기 💌
([인프런 소식 및 홍보]를 ON으로 바꿔주세요 😊)
댓글 0
댓글을 작성해보세요.