최근 한 고객이 더 이상 작동하지 않는 Wordpress 사이트의 "재무 평가" 자바스크립트 앱에 관해 접근했습니다. 문제가 많았고, 결국 가장 쉬운 길은 재건축이었습니다.

이 앱에서 사용자는 기본적인 금융 및 개인 정보를 입력할 수 있으며, 앱은 재정 계획 측면에서 올바른 방향으로 가고 있는지 알려줍니다. 엄청 복잡한 논리는 아니지만 꽤 있는 논리입니다.

저는 주로 프론트엔드 개발자가 아닙니다. 저는 백엔드가 가장 편해요. 하지만 저는 Vue, Angular, React에서 프로젝트를 구현했습니다. 작동하지만 완전히 신뢰하지는 않습니다. 그리고 몇 달, 몇 년이 지나면서 개발 툴체인 자체를 포함하여 종속성이 얼마나 오래되었는지에 대한 불안감이 늘 커집니다.

글림 입력

Gleam은 확장 가능한 유형 안전 시스템을 구축하기 위한 친숙한 언어입니다!
~ Gleam 웹사이트

저는 Gleam이 처음 v1을 출시할 준비가 되었다고 선언한 이후부터 매우 기대하고 있습니다. Go의 기능적 스타일, 불변성, 철저한 패턴 일치, 유형 추론, Go의 단순성 안정성 덕분에 Gleam은 내 모든 장점을 충족시켰습니다.

타입 시스템은 코드가 컴파일되면 작동할 것을 거의 보장합니다. 나는 아직 내 Gleam 코드에서 "죄송합니다. 구현을 완료하는 것을 잊어버렸습니다."라는 버전이 아닌 버그를 발견한 적이 없습니다.

광택을 입력

Gleam은 BEAM(Erlang의 전설적인 전투 테스트 VM)에서 실행되도록 제작되었지만 Javascript 컴파일 타겟도 있습니다. 이는 Node와 브라우저에 쉽게 전달될 수 있음을 의미합니다.

Lustre는 Gleam의 뛰어난 프론트엔드 프레임워크입니다. Gleam 생태계에 대한 Elm의 충실한 포트이며 Elm의 "모델 -> 보기 -> 업데이트" 상태 관리 아키텍처를 특징으로 합니다.

이것은 다른 프런트엔드 프레임워크보다 획기적으로 단순한 개념 모델입니다. 상태 관리를 선택 라이브러리로 제공하는 대신(redux를 살펴보겠습니다) Lustre의 상태 관리 모델은 심장이 뛰는 핵심입니다.

앱 내에서 상태를 수정하기 위해 발생할 수 있는 모든 동사를 설명하고 모델의 업데이트된 버전을 반환하는 유형이 안전한 순수 작업에 해당 동사를 매핑하면 됩니다. 보기 기능(또한 순수)은 해당 단일 모델의 상태에서 직접 흐릅니다.

Lustre는 또한 실패할 수 있는 다양한 I/O 작업이 있어도 완전히 순수한 기능을 사용하여 당신의 앱 코드를 구현할 수 있도록 관리 효과 시스템을 제공합니다.

순수 함수의 멋진 점은 무엇인가요? 동일한 입력이 주어지면 항상 동일한 출력을 제공하도록 보장됩니다. 이를 통해 예측 가능하고, 테스트하기 쉽고, 매우 안정적입니다. 순수한 기능은 깨지지 않습니다. 수학적으로는 할 수 없습니다.

달콤하고 달콤한 상용구

Lustre 앱에는 앱을 설정하고 모든 유형 등을 생성하는 비트 더 많은 상용구가 포함될 수 있습니다. 하지만 ...

"보일러플레이트"라는 용어가 적용되는 이보다 더 적절한 프레임워크는 없었습니다. 이는 강철판에 리벳을 박을 때와 같은 자신감을 줍니다. 일단 설치되면 그 물건은 아무데도 가지 않습니다.

이전의 자바스크립트 경험과 비교했을 때 이것이 얼마나 다른지 표현하기가 어렵습니다. 다른 프레임워크에서 수행했다면 내 앱은 LOC가 더 적었을 수도 있습니다. 하지만 깨지지 않을 것이라고 믿을 수 있을까요? 이해하기 쉬울까요?

최종 제품

시간과 예산에 맞춰 앱을 출시했습니다. 클라이언트는 정말 만족합니다. 그리고 저는 이 프로젝트가 정말 성공적으로 완료되었다는 사실을 알고 편히 잠들었습니다.

그뿐만 아니라 모든 곳의 워드프레스에서 편안하게 생활하고 있습니다. 컴파일된 자산을 로드하기 위한 단축 코드를 만들어 페이지에 표시하면 그게 전부입니다.

JS 번들은 18.1kb이며 축소 및 gzip으로 압축되어 있습니다. 이는 거의 htmx만큼 작습니다. 큰 소리로 울어서!

아직 상대적으로 모호한 언어와 프레임워크를 사용하여 프로젝트를 출시하는 것에 대해 약간의 의구심이 있습니다. 하지만 앱이 중단되지 않고 Gleam 자체를 오후에 배울 수 있다는 점을 알면 그러한 예약은 진정됩니다.

가장 중요한 점 - 솔직히 다른 것을 사용하여 구축했다면 최종 제품, 툴체인의 안정성 또는 향후 업그레이드 능력에 대해 확신할 수 없을 것 같습니다. .

내 심박수

이제 이 글을 쓰게 된 동기가 바로 Lustre 앱을 프로덕션에 사용한다는 느낌입니다.

이 앱이 출시된 지 몇 주가 지났지만 여전히 가끔 다시 방문하고 싶습니다. 고객이 변경을 요청했기 때문이 아닙니다. 코드를 살펴보세요.

이런 말을 하면 거의 당황스러울 정도지만, 제가 사용하는 다른 코드의 대부분은 어느 정도 책임이 있는 것처럼 느껴집니다. 특히 자바스크립트. Typescript이더라도, 테스트가 있더라도 말이죠. 마치 숨겨진 지뢰와 부비트랩이 널려 있는 것 같아 불안합니다.

아마도 스킬 문제일지도 모르겠습니다. 어쩌면 내가 너무 많이 화상을 입었을 수도 있습니다.

Gleam/Lustre 코드를 보면 차분함.

그렇습니다. 그 트윗이요.

마지막으로, 다른 개발자들도 Gleam과 Luster를 사용해 보고 프런트엔드 코드를 고려할 때 Zen과 같은 행복을 누릴 수 있기를 진심으로 바랍니다.

읽어주셔서 감사합니다.