머가필요해

업무로 API 서비스를 만들 때,

최근에는 Python을 이용하는 것이 편하다보니 주로 FastAPI를 이용하곤 한다.

그러다가 2달 전쯤 새로운 웹-프레임워크(Web-Framework) 소식을 듣게 되었다.

- https://news.hada.io/topic?id=16091

새로운 프레임워크임에도 불구하고 의외로(?) 반응이 꽤 괜찮다.

사이트도 산뜻하게 디자인되어 있다.

- https://fastht.ml/

FastHTML 스스로 만든 페이지이겠지?! ㅋㅋㅋ

어!? 나처럼 생각하는 사람이 많아서인지..... 그렇다고 한다!!!

5천개가 넘는 Star와 200건이 넘는 Fork를 자랑하는 프로젝트이다.

- https://github.com/AnswerDotAI/fasthtml

GeekNews에서 괜히 경쟁력이 있다는 말을 한 것이 아니다.

의외로 많은 것들이 제공/지원되고 있다.

- https://gallery.fastht.ml/

1. Installation

설치 과정은 Python 패키지답게 정말 심플하다.

- https://github.com/AnswerDotAI/fasthtml?tab=readme-ov-file#installation

그래서, Python 가상환경 만들고 pip 설치를 진행했는데...

얼라료?!

에러!? 이런!!

패키지를 아예 찾지 못하는 것이 이상해서...

혹시나 하고 Python 버전을 올려봤다.

이런, Python 3.8.x 버전은 지원하지 않는 것으로 보인다.

짧게 살펴봤지만, Document 어디에서도 Python 버전 제약에 대한 설명이 없었는데....

2. Usage

준비가 되었으니 빨리 Hello를 외쳐보자.

실행은 그냥 하면 된다.

실행 결과에서 안내해주는 주소를 참고해서

웹-브라우저로 결과를 확인해보자.

소스코드를 확인해보면 다음과 같다.

그런데, 웹-브라우저에서 "Hello World!" 부분을 클릭해도 아무런 일이 발생하지 않는다.

(내부적으로는 404 에러가 발생하겠지만 ^^)

소스코드에 8-9 라인을 다음과 같이 추가하고 Save를 해보자.

그러면, 다음과 같이 파일이 변경된 것을 감지하고 자동으로 Reloading을 한다!!!

브라보 !!!

웹-브라우저에서 "Hello World!" 부분을 클릭하면

다음과 같이 다른 내용이 출력된다.

호오~ 정말 심플하네!!!

3. Example

여러 예시들을 참고하면 도움이 될 것이다.

- https://github.com/AnswerDotAI/fasthtml-example

다양한 App 예시들을 볼 수 있다.

음... 과연 앞으로도 지속적으로 성장을 할 것인지

관심있게 지켜봐야겠다.

우연히 보게된 노마드 코더(Nomad Coders)의 유튜브.

파이썬 코드만가지고 JS, React, NextJS 인터랙티브 웹앱을 만들어주는 프레임워크가 나타났단다.

최근 정말 많은 주목을 받고 있는 오픈소스 프로젝트인 것은 분명한 것 같다.

https://pynecone.io/

발음이 같은 'pinecone'을 상징하는 솔방울을 로고로 사용하고 있다 ^^

공식 웹사이트도 Pynecone을 사용해서 만들었다고 한다.

왠지 Unix is Not Unix 같은 느낌인데!? 아닌가?! ^^

Pynecone은 파이썬으로 작성한 코드를

React/NextJS로 컴파일을 하는 방식이기에 성능이 뛰어나며 그래서 node를 필요로 하고 있다.

보다 더 나은 성능을 위해 node를 bun으로 교체하는 작업을 하고 있지만

아직 100% 호환성을 보장하지 못하기에 당분간은 node를 계속 필요로 할 것이라고 한다.

서두가 길었다.

이제 직접 한 번 사용해보자.

이하 과정은 다음 링크의 내용을 따라갔다.

- https://pynecone.io/docs/getting-started/installation

0. PoC Environment

  - 이하 과정을 진행한 환경은 Ubuntu 20.04 64bit Desktop 이다.

2. Prerequisites

  - Python 3.7+

  - NodeJS 12.22.0+

  ① Python 여러 버전을 관리할 수 있는 pyenv 기반으로 설치해보자.

    . https://www.whatwant.com/entry/pyenv

    . 설치한 버전은 다음과 같이 했다.

      - v3.8.16

  ② node 설치도 여러 버전을 관리할 수 있는 nvm 기반으로 설치를 진행해보자.

    . https://www.whatwant.com/entry/npm

    . 설치한 버전은 다음과 같이 했다.

      - v18.15.0   (Latest LTS: Hydrogen)

3. Virtual Environment

  - Optional 이라지만, 사실 필수이지 않을까 싶다.

4. Installing

  - 이제 pynecone 설치하면 된다!

5. Create a Project

  - 일단 프로젝트 생성하는 방법부터 알아보자.

6. Run the App

  - 일단 한 번 띄워보자.

  - 브라우저로 확인해보자.

7. Edit

  - 본문을 살짝 살펴보자.

  - 눈꼽만큼 변경해보자.

  - 포트도 변경하고, debug log도 찍어보자.

  - http://localhost:8282/

8. Fast Refresh

  - Pynecone은 실시간으로 변경 사항이 반영된다.

  - 웹브라우저가 띄워져 있는 상황에서, 다른 터미널로 파일을 수정해보자.

  - 파일을 수정한 뒤, 저장을 하면 조금 있다가 브라우저에 자동으로 페이지 내용이 변경된다.

일단 여기까지 살짝 맛만 봤고

시간이 나면 다음 단계로 넘어가보겠다. (시간이 날까?! ^^)