・・・아니, 이상한 의미가 아니고.

Elm guide를 어딘지 모르게 보고, 희미하게 소스를 읽을 수 있게 되어, 환경도 생겼으므로, 막상 왠지 써 보자.

웹상에서 움직이는 도트 그림 에디터를 만들고 싶다~라고.
그리고 그래서 그림 그려 LINE의 이모티콘을 만들고 싶다 ~라고. 그런 야망을 가지고 있습니다.

우선, Elm의 혜택에도 얽매이지 않는, 단지 표를 쓰는 곳에서 시작.

진행하는 방법

가이드

h tps : // 글쎄. 에 lm-ㅁ g. jp / r 치테 c 얽힌 / 푹신 s. HTML
안에서 HTML 태그 같은 것을 찾아 본다. 과연, 태그명을 써, 최초의 []안은 태그의 속성, 다음의[]로 태그의 중첩을 나타내고 있을 것이다. (일단 분위기에서 읽기로 했다)

참조

htps : // Pac 게이지. 에 lm-ㅁ g. rg/파c 꺽쇠 s/에 ​​lm/HTML/1.0.0/HTML
봐도 어쩐지 그런 느낌이 든다.
우선 TABLE 태그를 표시하기 위해, 팩 해 온 샘플에 table 라고 써 보았다.

소스 및 실행 결과

view model =
    div []
        [ input [ placeholder "Text to reverse", value model.content, onInput Change ] []
        , div [] [ text (String.reverse model.content) ]
        , table []   ←これを書いてみた
        ]

실행 결과

$ elm make src/textfld.elm 
Detected errors in 1 module.                                         
-- NAMING ERROR ------------------------------------------------ src/textfld.elm

I cannot find a `table` variable:

55|         , table []
              ^^^^^
These names seem close though:

    title
    abs
    alt
    name

Hint: Read <https://elm-lang.org/0.19.0/imports> to see how `import`
declarations work in Elm.

마지막 행에 고마운 힌트가 나와 있다.
이 녀석을 의지하여 import에 table을 추가해 본다.

소스 및 실행 결과

module Main exposing (Model, Msg(..), init, main, update, view)

import Browser
import Html exposing (Attribute, Html, div, input, text, table)

실행 결과

Detected errors in 1 module.                                         
-- TYPE MISMATCH ----------------------------------------------- src/textfld.elm

The 3rd element of this list does not match all the previous elements:

53|         [ input [ placeholder "Text to reverse", value model.content, onInput Change ] []
54|         , div [] [ text (String.reverse model.content) ]
55|>        , table []
56|         ]

This `table` call produces:

    List (Html msg) -> Html msg

But all the previous elements in the list are:

    Html Msg

Hint: Everything in the list needs to be the same type of value. This way you
never run into unexpected values partway through. To mix different types in a
single list, create a "union type" as described in:
<http://guide.elm-lang.org/types/union_types.html>

한 걸음 전진한 것 같다. 오류 메시지가 변경되었습니다.
TYPE MISMATCH(안타 나의 타입이 아니야)
그럴까…

이런 경우 컴파일 다녔다!

        , table [] []

같은 요령으로 tr과 td도 추가해서 표로 했다

        , table [] [ tr [] [ td [] [ text "aa" ] ] ]

어쩐지 이 엔으로부터 요령을 얻고, 모쿠모쿠라고 시도하고는 에러를 토해를 반복한다.

그리고 마침내 ...

할 수 있었어! 기분이~!

그 중 내용이 바뀔지도 모르지만 동작하는 것과 소스 코드
htps : // th th lu-l l-364718. 네 tぃfy. 이 m
htps : // 기주 b. 코 m / 네기 보즈 / xtfld

다음 번에 어려움

테이블을 작성할 때, List.repeat등을 시도했지만 잘 되지 않고, 몇번이나 같은 것을 쓰고 있다. 비참하다.

텍스트 박스나 무언가로부터 숫자를 입력해, 매스의 수를 바꾸거나, 매스의 사이즈를 바꾸거나 하고 싶다.

(2019/3/14 추가)
과제를 조금 지웠습니다.