내 프런트엔드 기술이 항해 테스트를 통과하는 데 어떻게 도움이 되었나요?

올해 저는 레저 항해를 위해 항해 강습을 받고 선장 면허를 취득하기로 결정했습니다. 엔지니어링 기술이 허가를 더 쉽게 받는 데 도움이 될 것이라는 사실을 거의 알지 못했습니다. 다이빙하자!

우리나라에서 시험은 두 부분으로 나뉩니다. 해상에서의 "도로"시험과 운전 면허증 시험과 매우 유사한 필기 시험입니다. 26개의 객관식 문제로 구성됩니다. 각 질문에 대해 세 가지 답변 선택이 있으며 하나는 정답입니다.
당국은 친절하게 대량의 샘플 질문을 무료로 다운로드할 수 있도록 제공했습니다. 그러나 모든 데이터는 여러 페이지의 PDF 파일에 펼쳐진 큰 테이블에 표시됩니다. 20~30페이지에 걸쳐 다음과 같이 표시됩니다.



표의 각 줄은 질문을 나타냅니다. 그런 다음 각 열은 답변 선택을 나타내며 각 선택 다음에 또 다른 열이 표시됩니다. 선택이 올바른지 여부에 관계없이 값은 0 또는 1입니다. 운 좋게도 저는 MacOS의 미리보기 앱을 사용하여 모든 데이터를 가져올 수 있었습니다. 저는 단순히 모두 선택 -> 복사 -> 붙여넣기(vim 또는 다른 텍스트 편집기에서)를 선택했고 데이터를 이해할 수 있었습니다.

의미있는 객체의 배열을 생성하는 nodejs 스크립트를 작성하여 그렇게 했습니다. Typescript 유형은 내 모델링을 시연하기 위해 사용할 수 있을 만큼 간단합니다.

type Answer = {
    text: string,
    correct: boolean
}
type Choices = [Answer, Answer, Answer]

type Question = {
    text: string,
    answers: Choices
}

// some sample data
// only for the sake of the example
const answers : Choices = [
  {text: 'fine', correct: false},
  {text: 'awesome', correct: true},
  {text: 'great', correct: false}
];

const question : Question = {text: 'how are you', answers}

Typescript에서는 멋져 보이지만 솔직히 저는 node script을 작성하여 모든 것을 큰 JSON 파일에 덤프하고 작업을 완료했습니다. 저는 적절한 도메인 모델링이 성공적인 시스템의 핵심이라고 믿습니다. 어떤 엔지니어링을 하든 마찬가지입니다.

멋진. 의미 있는 데이터가 있습니다. 이제 프리젠테이션 계층(일명 UI!)을 생성한 다음 UI에 대화형 기능을 추가하여 실제로 시험을 시뮬레이션할 때 피드백을 받을 수 있습니다(일명 프런트엔드!).
ING에서 우리는 웹 구성 요소의 지지자이기 때문에 저는 항상 이 스택을 사이드 프로젝트에 사용해 보고 싶었습니다. 나는 open-wc.org으로 바로 뛰어들어 npm 생성기를 사용했습니다.
모든 것이 예상대로 정확하게 작동했습니다. 내 챕터가 매번 켜짐을 사용하고 있기 때문에 산들바람이었습니다. 하나의. 낮. 그래서 나는 마침내 글을 쓰면서 약간의 마일리지를 얻을 수 있었습니다. 직장에서 챕터 리더로서 저는 혼자서 새로운 기능을 코딩하는 것보다 팀을 위해 더 효과적으로 시간을 보내는 것을 선호합니다. 내 챕터는 어쨌든 더 잘합니다 (#proud).

simulator here을 살펴보실 수 있습니다. seamanship , navigation , maneuver , COLREG , RND - fresh water regulations 의 각 주제에 대한 빠른 배포도 있습니다.
주의: 어쨌든 데이터 소스가 루마니아어이므로 모든 텍스트는 루마니아어로 되어 있습니다. 그러나 당신은 요지를 얻습니다.

나중을 위해 저장한 것(읽기: 절대 안 함)

#shipping 때문에 일부러 건너뛴 것:

단위 테스트

스타일링

크고 부피가 큰 json-s 대신 적절한 API를 생성하여 클라이언트로 전송

웃긴게 여기 스크린샷을 넣으면 광고처럼 보여서 🤭

타협하지 않음

무슨 일이 있어도 건너뛰고 싶지 않은 것:

최소한의 실행 가능한 제품을 만들고 목적을 달성하도록 하십시오.

웹 서버에 배포하고 멋진 항해 클래스 동료들과 공유합니다

.

github에서 오픈 소스로 만듭니다. 그러나 전체 PDF를 다운로드하고 데이터 변환을 직접 실행해야 합니다. 몇 가지 이유로 프로젝트에 포함하고 싶지 않았습니다.

내 데이터가 아니므로 배포할 수 있는 라이선스가 없습니다. 내가 할 수 있는 최선은 그것을 다르게 포장하고 무료 비상업적 웹 앱에 대한 지원으로 사용하는 것입니다.

어쨌든 데이터가 변경될 수 있습니다.

이 다이어리 페이지를 여러분과 공유합니다 🤗. 나는 그것을 건너 뛰고 싶지 않았습니다.

엔지니어링 기술이 전혀 관련 없는 일을 처리하는 데 도움이 된 때는 언제입니까?