더러운 오솔길 부검

A dirty trail는 당신을 선택한 모험 게임으로 간단한 기계 구조와 라운드 기반의 전투 시스템을 갖추고 있습니다.
이 문장에서, 나는 그것이 어떻게 형성되고, 발전했는지, 그리고 내가 무엇을 배웠는지 너에게 알려줄 것이다.

이게 어떻게 된 일입니까?

몇 장의 캡처는 내가 너에게 알려줄 수 있는 어떤 것보다 더 해석적일 수 있다.당신도 방문adirtytrail.com해서 한번 해 보세요!
서술하다.
싸우다


이것은 인터넷 게임이다. 당신은 결정을 내릴 것이다. 이런 결정은 이야기의 나머지 부분에 영향을 주고 가능한 결말로 인도할 것이다.
그러나 이것은 이야기 자체가 아니라 그것을 움직이는 엔진이다.

얘는 어떻게 시작했어?

내가 VS 코드를 풀기 시작했을 때, 나의 생각은 매우 달랐다.나의 의도는 절차적인 서술을 창조하는 것이다.
나 자신도 게임 유저이다. 나는 모든 개방된 세계 게임의 흥행을 보았다. 이런 게임에서 당신은 한 장면에 직면하고 있다. 단지, 응, 어떤 진정한 목적도 없는 상황에서 그것을 통과한다.나는 내가 집중할 수 있도록 이야기가 필요하기 때문에 이런 게임을 정말 좋아하지 않는다.
그래서 나는 네가 갈 때 서사의 가능성을 동태적으로 생성하는 것이라고 생각한다.웅대한 포부, 나는 안다!너무 많아, 내 결말을 봐.
이런 도전은 매우 크다. 비록 나는 아직 완전히 포기하지 않았지만, 나는 비교적 짧은 시간 안에 살 수 있는 물건에 만족하기로 결정했다.
이것은 간단한 JS와 자연 언어 처리에 사용되는 일련의 라이브러리에서 시작하여 순수한 Typescript 프로젝트로 대상을 대상으로 고도로 하고 처음부터 구축된 메커니즘을 채택하여 최초의 생각에서 최종 결과로 발전했다.

건축하다

기술적으로 더러운 흔적은 매우 간단하다.
이 엔진은 자신의repository, 그리고another one 웹 앱에 사용됩니다.
엔진은 순타자 스크립트다.그의 행위는 한 장면의 개념을 둘러싸고 있다. 즉, 그것과 관련된 동작의 텍스트, 전투 장면에 대한 적들이다.
장면은 가격을 내리는 방식으로 썼다. 나는 손잡이를 사용하여 텍스트를 만들었기 때문에 서술의 현재 상태에 따라 작가(즉 나!)사물을 나타내는 표시를 포함할 수 있다.이것은 Markdown으로 작성된 장면의 텍스트 부분의 예이다.

The road climbed up, and the higher they got, the colder the air was. The fog came over them, and it started to drizzle.

"This could not get worse," {{playerName}} said under her breath.

"Never say something like that!" the minister protested. "Do you want Him to prove you wrong?" and at this, he pointed at the sky, which was heavy with clouds.

"Those are not appropriate things to say for a minister," Lady Willsbourgh said. She could hardly speak, breathless as she was from carrying so many things.

The two of them kept discussing for a while, but {{playerName}} stopped, redid her blouse, and breathed deep.

Something in the woods caught her attention.

태그 파일의 메타데이터 부분은 장면 정보가 있는 위치입니다. 예를 들어 제목과 가능한 동작입니다.다음 예는 다음과 같습니다.

id: theRoad_theWalk
title: The road
actions:
    She tried to focus on it (_perception_):
        check:
            skill: perception
            success:
                nextSceneId: theRoad_somethingInTheWoods
            failure:
                nextSceneId: theRoad_nothingInTheWoods

핵심 라이브러리는 단원 테스트로 덮어쓰이고, 파일을 표시하는 메타데이터로 장면을 설명하는 템플릿 언어는 typescript-json-schema로 생성된 JSON 모드 파일로 설명됩니다.너는 곧 그것의 사용법을 보게 될 거야!
이제 인터넷 앱 자체가 다음이다.js 응용 프로그램.왜 다음이야?js?이것은 아주 좋은 틀이기 때문에, 나는 그것과 연락을 유지하고 싶지 않다.여기서 핵심 라이브러리는 의존항으로 가져옵니다.
이 웹 앱에서 나는 이야기를 하나 썼다.나는 모든 장면을 두 개의 단독 파일로 나누었다. 하나는 .md 텍스트에 사용되고, 다른 하나는 .yaml 메타데이터에 사용된다.이유가 뭡니까?나는 YAML VS code extension를 사용하여 intellisense를 나의 데이터 모델에 사용하고 VS 코드는 intellisense를 주입 언어, 예를 들어 파일을 표시하는yaml 부분에 사용하지 못하게 한다.이 분야에 대해 더 많은 정보를 알고 싶다면check out this GitHub thread.
이 점을 감안하여, 나는 최종 가격 인하 파일을 구축하는 데 도움을 주는 몇 개의 스크립트를 만들었는데, 이 파일들은 나의 다음 응용 프로그램 /public 폴더를 통해 제공된다.js 응용 프로그램 및 테스트 목적에 사용됩니다.
프로젝트의 이 방면에 대한 테스트가 부족하기 때문이다.나는 단원 테스트를 통해 이 일을 정확하게 완성하는 것이 너무 복잡하거나 유쾌한 생각이 아직 내 머릿속에 나타나지 않았을 수도 있다고 생각한다. 그래서 지금 나는 몇 개의 스크립트와 기본적인 단원 테스트를 해결했다.
단원 테스트는 생성 장면의 완전성을 검증한다.그 중 한 스크립트는 서술한 장면과 문자의 수량, 그리고 끝 장면을 포함하는 보고서를 생성한다. 그러면 내가 무의식중에 유저가 계속할 수 없는 장면을 만들었는지 알 수 있다.마지막 스크립트는 완전한 서술 도표를 만들었는데, 그 형식은 나의 다른 도표를 표시하고 편집하는 항목 grapher.tech 과 호환된다.

이것이 바로 그래퍼의 생김새다.

기타 기술

스타일링에 있어서 react-bootstrap을 사용한 유일한 이유는 과거의 모든 응용 프로그램이 Bootstrap을 사용했던 아름다운 시절을 그리워하고 최신 버전을 따라잡고 싶어서였다.
회고 중에 나는 내가 한번 시도해야 한다고 생각한다Tailwind.나는 그것에 관한 좋은 이야기를 많이 들었는데, 이 응용 프로그램은 그것에 매우 적합하다고 느낀다.
호스트에 대해 Netlify를 선택했습니다.나는 그들의 서비스가 매우 좋다고 생각한다. 지금까지 나는 어떠한 불평도 하지 않았다.
내가 발견한 유일한 것은 핵심 의존 항목을 업데이트할 때마다 캐시를 정리해야 한다는 것이다.그러나 우선, 그것이 제공한 것과 비교하면 이것은 아무것도 아니다!

봄에

나는 react-spring로 애니메이션을 제작하는데, 나는 그것에 매우 의존한다.나는 이것이 React에서 가장 인기 있는 애니메이션 라이브러리라는 것을 알고 있지만, 그것은 나를 위해 클릭하지 않았기 때문에, 나는 다른 것을 찾으려고 시도했다.그리고 나는react spring이 지금까지 가장 좋았다는 것을 깨달았다. 이것은 나를 매우 괴롭게 했다. 왜냐하면 나는 그것을 사용하는 것을 좋아하지 않기 때문이다!그래, 내가 살게.
현재 나는 v9에 아주 좋은 API가 있다는 것을 발견했기 때문에 갔다. 비록 아직 발표되지 않았지만, 그것으로 전체 응용 프로그램을 구축했다. (나는 안다.)그리고 첫 번째 버전을 배치할 때 구축은 작동할 수 없습니다!
나는 디버깅하는 데 많은 시간을 들였는데, 이것이 an issue with react-spring v9 때문이라는 것을 발견했다.(알아요!)
v8로 돌아가는 것은 너무 고통스러워서 제가 직접 수리하기로 결정했고 결국GitHub 라인에서 이것에 대해 a mix of some of the solutions proposed을 했습니다.못생겼지만, 그것은 나를 가게 했다.

내가 배운 것

총알점 시간!

명확한 생각 없이 시작하고 차근차근 네가 진정으로 할 수 있는 일이 될 때까지 시간이 많이 걸린다.나는 내가 처음부터 더러운 오솔길이 어떻게 될지 알았더라면 이 길에 쓴 시간이 절반도 안 됐을 것이라고 생각한다.

데이터 모델을 만들 때 저는 자연스럽게 대상을 대상으로 하는 것을 생각했지만 기능적인 방법은 핵심 엔진에 이익을 주고 확장성을 가지게 할 것이라고 생각합니다.

테스트는 매우 어렵다. 때때로 내가 중복된 테스트를 쓰고 있다는 것을 발견할 때 나는 한숨을 쉰다.어쨌든, 이것은 나의 여가 시간이다. 나는 우스갯소리 문서를 뒤적거리고 있다!정말 재수 없어!하지만 이것은 충분히 가치가 있다.Typescript를 등식에 추가하면 재구성이 수월해집니다.나는 재구성에만 관심이 있다.

TDD를 하는 것은 나에게 여전히 쓸모가 없다.특히 내가 모를 때내 API가 어떻게 될지 알기 전에 수정을 해야 한다. API를 이해하기 전에 테스트를 작성하는 것은 무의미하다.그래서 저는 100% TDR: 테스트 드라이브의 재구성입니다.

기분이 좋지 않은 것을 남겼을 때 직감을 믿어라.언젠가 얘가 와서 물어뜯을 거야!만약 네가 내일 다시 자세히 고려한다면, 해커 해결 방안으로 문제를 빙빙 돌려도 된다.그렇지 않으면, 그것은 네가 위에서 세운 기초를 무너뜨릴 것이다.

당신의 프로젝트가 커지기 시작할 때 Trello를 사용하여 일을 추적하세요!나는 한동안 그것을 사용하지 않았지만, 일이 엄숙해지면, 미래에 하고 싶은 모든 일을 쓰고, 잊고 싶지 않은 일은 완벽하다는 것을 알게 된다.

로드맵

한동안 나는 더러운 오솔길을 참을 만큼 참았지만, 나는 미래에 계속 뭔가를 추가할 계획이다.

국제화.

무장애성에 계속 힘쓰다.

더 많은 서술.

암흑 모드.

템플릿 시스템을 재구성한다(감각이 틀렸다!).

더 많은 기계 장치를 추가합니다.

감사합니다!

이런 부검 보고서를 통독해 주셔서 감사합니다!만약 당신이 좋아한다면 A dirty trail에게 당신의 생각을 공유할 기회를 주십시오.
감사합니다!