기본 콘텐츠로 건너뛰기

간단한 mithril router 예제.

http://meteorpad.com/pad/fH4tQSizz8vskj3N5/mithril_router

일단 링크.

Meteor.startup ->

  Home =
    controller: ->
      onunload: ->
        console.log "unloading home component"
    view: -> [
      m "div", "home"
      m "a[href=/dashboard]", config: m.route, "to Dashboard"
    ]

  Dashboard =
    controller: ->
    view: -> [
      m "div", "dashboard"
      m "h1",
        m "a[href=/]", config: m.route, "to home"
    ]

  m.route.mode = "pathname"
  m.route document.body, "/",
    "/": Home
    "/dashboard": Dashboard


  1. router 진입시 필요한 것들은 controller 에서 사용하면 되는데
    unload시 처리는 onunload 을 return 값의 key로 사용하면 된다.
  2. view에서 a 링크 처리시엔 { config: m.route } 를 사용하면 history API를 사용하여 이동한다.
  3. m.route.mode 에서 URL 처리 규칙을 정할 수 있다. 기존 방식은 "pathname"을 "http://domain/#/dashboard" 처럼 hashbang을 사용하는 경우는 "hash"
    "http://domain/?/dashboard" 처럼 queryString을 사용하는 경우는 "search" 를 사용한다.
완전 좋네. 그냥 이 라우터에 Blaze.renderWithData (http://docs.meteor.com/#/full/blaze_renderwithdata)같은 걸 써버리고도 싶다.

어떻게 할 수 있을까 궁리를 해보자.
http://mithril.js.org/mithril.html#the-config-attribute

이걸 사용해 시도해보았다. Home 의 view 반환값 첫번째에 아래와 같이 구현하였다.


m "div#login", config: (element, isInitiated)->
  Blaze.render Template.loginButtons, element

element를 받아서 Template.loginButtons를 element 아래에 render하도록.
멋지게 작동한다. 더 좋은 방법이 있으면 댓글이나 메일로 알려달라.
나는 이것도 충분히 멋지다고 생각한다.

최종 코드는 아래와 같다. accounts-ui 와 accounts-password 등 계정 관련 패키지들이 있다는 가정하에 작성하였다.

Meteor.startup ->  
  Home =
    controller: ->
      onunload: ->
        console.log "unloading home component"
    view: -> [
      m "div#login", config: (element, isInitiated)->
        Blaze.render Template.loginButtons, element
      m "div", "home"
      m "a[href=/dashboard]", config: m.route, "to Dashboard"
    ]
  
  Dashboard =
    controller: ->
    view: ->
      m "div", "dashboard"
  
  m.route.mode = "pathname"
  m.route document.body, "/",
    "/": Home
    "/dashboard": Dashboard


댓글

이 블로그의 인기 게시물

세상 간단한 https(+secured websocket): Caddy

nginx, apache2 같은 걸로 매번 certbot 연동을 통해 https 하는게 지겨워서 알아보니 Caddy라는게 있더라. 설치법은 강하게 크기 위해 알아서 해본다. # cat /etc/caddy/Caddyfile your.shitty.site:8123 {   proxy / localhost:9123 {     websocket     transparent   } } 이건 외부에서 8123으로 들어오는 걸 내부적으로 9123로 맞춰서 https 맞춰주는 reverse proxy. 만일 port를 생략하면 # cat /etc/caddy/Caddyfile your.shitty.site {   proxy / localhost:9123 {     websocket     transparent   } } 기본포트인 443으로 되어 https://your.shitty.site 로 접속이 된다. 요새 말썽이던 cloudflare 버리고 netlify domain이랑 caddy를 쓰니까 앓던 이가 빠진 느낌. 이 조합은 당분간 계속 써야겠다 싶다.

저지연 오디오 생성 LLVC 사용기

https://github.com/KoeAI/LLVC 써봄 CUDA 11.8 버전 쓰고 있어 pip install torch torchvision torchaudio --index-url https://download.pytorch.org/whl/cu118 VC 없어서 설치 https://wikidocs.net/168848 참조 FAIRSEQ 관련 오류 https://github.com/facebookresearch/fairseq/issues/2908 pip install editdistance  설치 No CUDA runtime is found, using CUDA_HOME='C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v11.8' 오류 멀쩡하게 있는데 안됨. pip install torch==2.1.0+cu118 torchvision==0.16.0+cu118 torchaudio==2.1.0+cu118 --extra-index-url https://download.pytorch.org/whl/cu118 다시 설치 set DISTUTILS_USE_SDK=1 이게 문젠가 설정하고 재도전 Using cached ruamel.yaml.clib-0.2.8-cp311-cp311-win_amd64.whl (118 kB) Building wheels for collected packages: fairseq   Building wheel for fairseq (pyproject.toml) ... error   error: subprocess-exited-with-error   × Building wheel for fairseq (pyproject.toml) did not run successfully.   │ exit code: 1   ╰─> [1829 lines of output]       No CUDA runtime is found, usi...