Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

Extensibility for ADF applications

212 Aufrufe

Veröffentlicht am

Walk through technical details on the Alfresco ADF extensibility

Veröffentlicht in: Technologie
  • ➤➤ How Long Does She Want You to Last? Here's the link to the FREE report ▲▲▲ https://tinyurl.com/rockhardxxx
       Antworten 
    Sind Sie sicher, dass Sie …  Ja  Nein
    Ihre Nachricht erscheint hier

Extensibility for ADF applications

  1. 1. Extensibility for ADF Applications Denys Vuika @DenysVuika
  2. 2. Learn. Connect. Collaborate. About me • Applications Platform Developer @ Alfresco • Alfresco Content Application tech lead • Open Source contributor • Blogger and writer Leanpub: https://leanpub.com/developing-with-angular Amazon Kindle: https://www.amazon.com/dp/B07KD9KHQW Amazon Paperback: https://www.amazon.com/dp/1731123426 1618 readers, 476 pages @ DenysVuika
  3. 3. Learn. Connect. Collaborate. Alfresco Content Application Extensibility for ADF Applications
  4. 4. Learn. Connect. Collaborate.
  5. 5. Learn. Connect. Collaborate. Extensibility Features • Custom pages and routes • Document List layouts • Navigation sidebar • Context menu • Sidebar (aka Info Drawer) • Toolbars • Viewer content and toolbars • Content metadata + new endpoints with every release + your own content and extensions
  6. 6. Format
  7. 7. Learn. Connect. Collaborate. Format • JSON files • Files are merged at runtime • Custom order of loading • Extensions can – Rewrite properties – Extend objects and collections – Disable existing features
  8. 8. Learn. Connect. Collaborate. Format: metadata
  9. 9. Learn. Connect. Collaborate. Format: app header
  10. 10. Learn. Connect. Collaborate. Format: actions Actions to redirect to routes
  11. 11. Learn. Connect. Collaborate. Format: demo app.extensions.json / $references • The order of the declaration matters • Last loaded extension can customize previously loaded
  12. 12. Learn. Connect. Collaborate. Format: demo Before After
  13. 13. Components
  14. 14. Learn. Connect. Collaborate. Components • Standard Angular components • 3rd party dependencies • Simple to distribute (NPM, Nexus, etc.) • Easy to register • Extensions can override existing entries
  15. 15. Learn. Connect. Collaborate. Components: viewer Register custom viewer by extension
  16. 16. Learn. Connect. Collaborate. Components: viewer Render custom content for PDF files
  17. 17. Learn. Connect. Collaborate. Components: menu Inject custom component into the context menu
  18. 18. Learn. Connect. Collaborate. Components: menu Your custom component in the context menu • Looks and behaves like menu item • Integrates with Rules • Executes your code on click
  19. 19. Learn. Connect. Collaborate. Demo: create menu • Adding extra menus to “New” button • Multiple levels of nesting • “Enabled” state is based on Rules
  20. 20. Learn. Connect. Collaborate. Demo: create menu New entries at runtime
  21. 21. Routes
  22. 22. Learn. Connect. Collaborate. Routes • Expand the app by adding new routes • New pages • Custom content to show • Application layout and styles • Authentication guards • Register actions to redirect to your content • Register buttons to invoke your actions • Redefine and customize other routes
  23. 23. Learn. Connect. Collaborate. Routes: demo Custom route registration example /my-route-one/*
  24. 24. Learn. Connect. Collaborate. Routes: demo • Renders separate groups • Auto-highlights links • Registers extra URL parts • Renders your pages
  25. 25. Actions
  26. 26. Learn. Connect. Collaborate. Actions • Trigger application features • App is split into reusable actions, i.e.: – Remove node – Invoke “Create Folder” dialog – Preview node – ... and many more • Extensions can invoke or customize every application action exposed • Based on NgRx (inspired by Redux) • You can provide custom handlers • You can replace Action Engine
  27. 27. Learn. Connect. Collaborate. Actions: example Declare a new toolbar entries in your extension
  28. 28. Learn. Connect. Collaborate. Actions: example Get custom toolbar entries rendered at runtime • Supports rules • Menus and sub-menus • Separators • Custom ordering • Replace existing buttons • Invoke app actions
  29. 29. Learn. Connect. Collaborate. Actions: effects Listening and reacting on the action event
  30. 30. Rules
  31. 31. Learn. Connect. Collaborate. Rules • Rules are plain JavaScript functions • Can access runtime context • Can be composed from other rules – NOT, OR, AND – Rule negation via “!” (not) operator • Unlimited level of chaining • You can replace any rule with your own • Extensions can register extra rules
  32. 32. Learn. Connect. Collaborate. Rules: code
  33. 33. Learn. Connect. Collaborate. Rules: context • Resolves rules • Provides access to application state • You can replace with own implementation
  34. 34. Learn. Connect. Collaborate. Rules: registration
  35. 35. Learn. Connect. Collaborate. Rules: markup Declaring a composite rule… and referencing:
  36. 36. Distribution
  37. 37. Learn. Connect. Collaborate. Distribution • Standard Angular Libraries • Published to NPM or custom sources • Single metadata file as part of the library • Single command to install into the app • Installing from local tarball packages See more details on NGI tool: https://bit.ly/2RcKtvw
  38. 38. @alfresco/adf-extensions
  39. 39. Learn. Connect. Collaborate. Core features • Extension loader • Application services to back extensibility • Core evaluators (”every”, “not”, “all”, etc.) • Dynamic components
  40. 40. Learn. Connect. Collaborate. What’s next • More extension points for ADF and ACA • More developer tooling for extensions – Validation and linting – Upgrades and versioning – Distribution • Automatic installation and deployment • Web Components support • Improvements based on community feedback
  41. 41. Learn. Connect. Collaborate. More information Extensibility documentation https://alfresco-content-app.netlify.com/#/extending/
  42. 42. Thank you
  43. 43. Q and A

×