ReactJS эволюционирует в LSXC

Всем привет

Этот топик пишу любителям ReactJS, Pug, Sass.

Вы наверно полюбили реакт так-же как и я если читаете эти строки и возможность Вы себе задавали тотже вопрос что и я себе —

Что делать с jade / pug синтаксисом?

Ведь синтаксис pug легче в написании и чтении чем html. Стоимость написания код меньше, нет регрессий.

Как концепцию pug объединить с react?

Мы не нашли ответа на этот вопрос и так как являемся разработчиками децентрализирванных систем решили позволить себе такую наглость решить эту проблему

Встречайте LSXc

www.npmjs.com/package/lsxc

Вот пример кода (используются диалекты livescript, sass, pug)

require! {
  \mobx-react : { observer }
  \mobx : { observable }
  \react-dom : { render }
  \react
}

.btn
  color: red
  padding-left: 5px
  &:hover
    color: orange


btn = ({click, text})->
    a.pug.btn(target='blank' on-click=click) #{text} 

input = ({store})->
  handle-enter-click = (event) -> 
    return if event.key-code isnt 13 
    store.todos.push text: event.target.value
    event.target.value = ''
  input.pug(on-key-down=handle-enter-click)  

Main = observer ({store})->
  remove = (todo, _)-->
      index = store.todos.index-of todo
      return if index < 0
      store.todos.splice 1, index
  .pug
    h3.pug Tasks
    for todo in store.todos
      .pug 
        span.pug #{todo.text}
        span.pug
          btn {text: 'Remove', click: remove todo}
    input {store}
    hr.pug 
    

window.onload = ->
  store = observable do
      todos:
        * text: 'Do dishes'
        ...
  render do
    Main.pug(store=store)
    document.body.append-child document.create-element \app

Эта легкая библиотека умеет создавать компоненты react с уже включенным pug + sass прямо в одном файле

Мы теперь пишем наши продукты на этой технологии и не можем налюбоваться. Огромное удовольситвие от каждой строчки и больше никакого бейбла, который кажется скоро превратиться в очередную джаву.

Кстати библиотека набирает популярность
npm-stat.com/...​=2016-07-28&to=2017-07-28

Желающим принять участие в доработке развивающейся технологии просим писать в github.com/askucher/lsxc/issues

Всем скептикам и тем кому технология не нравится сразу пишу — не стоит тратить свое время на написание негативного комментария — лучше пойдите подымите деньги на ICO и поменяйте мир. Мы кстати в этом вопросе можем помочь

Підписуйтеся на Telegram-канал «DOU #tech», щоб не пропустити нові технічні статті