O slideshow foi denunciado.
Utilizamos seu perfil e dados de atividades no LinkedIn para personalizar e exibir anúncios mais relevantes. Altere suas preferências de anúncios quando desejar.

Developing SLDS Apps with React.js

1.628 visualizações

Publicada em

Introduction and case study of Salesforce Lightning Design System app which is built on React.js

Publicada em: Software
  • Entre para ver os comentários

Developing SLDS Apps with React.js

  1. 1. Developing SLDS Apps with React.js (from the case of Mashmatrix Sheet)
  2. 2. Salesforce Lightning Design System (SLDS)
  3. 3. Key Point of SLDS • Only HTML/CSS • No JavaScript (exception: SVG4Everybody) • c.f. Bootstrap => jQuery Dependency
  4. 4. Dynamic Behavior in SLDS • Dropdown menu (using :hover CSS pseudo-class) • Stateful Button • Otherwise - Do it by your own JavaScript code !
  5. 5. Markup isYour Own Responsibility
  6. 6. React.js
  7. 7. Pack into Component
  8. 8. react-lightning-design-system http://stomita.github.io/react-lightning-design-system/ https://github.com/stomita/react-lightning-design-system/
  9. 9. Case Study : Mashmatrix Sheet
  10. 10. Architecture of Mashmatrix Sheet Action CreatorStore View State callrender Reselect Action Redux Action(async) • Lightning: @AuraEnabled + enqueueAction • Visualforce: @RemoteAction +VFRemoting • Local: API + JSForce
  11. 11. Thanks.

×