Frontendops: the dark side of Web development

Negli ultimi anni la complessità dello sviluppo front end è cresciuta esponenzialmente rendendo davvero difficile stare al passo con tutte le novità che vengono sviluppate. Mantenere e configurare le automazioni di un progetto è sempre più complicato: troppe scelte a disposizione per chi vi si avvicina per la prima volta, dispersivo e time consuming per gli sviluppatori esperti.
Si vedrà come migliorare le automazioni dei vostri progetti utilizzando varie tecniche, trucchi e strumenti al fine di migliorare la vostra Developer Experience nel mantenere ed evolvere le automazioni dei vostri progetti.

In questo repo (work in progress e non completamente funzionante) si trovano vari spunti su come implementare i concetti espressi nelle slides: https://github.com/cef62/frontend-ops-torino

http://2016.angularconf.it/schedule.html

Transcript

1. FRONTEND OPS
   THE DARK SIDE OF WEB DEVELOPMENT
   

   View Slide

2. @cef62
   
   github.com/cef62
   
   Senior frontend engineer @
   
   Staff member of Verona Frontenders
   
   Italian React & Angular Communities Maintainer
   Matteo Ronchi
   

   View Slide

3. WHY SHOULD YOU
   TAKE CARE 

   OF YOUR PROJECTS?
   

   View Slide

4. Several hours spent everyday working on them
   
   They are your responsibility
   
   You know them and they know you!
   

   View Slide

5. How you keep… 

   …your source code
   

   View Slide

6. How you keep…
   …your projects scaffold
   

   View Slide

7. FOR YOUR SOURCE CODE
   

   View Slide

8. Carefully select what dependencies will be used
   
   Avoid poorly maintained projects
   
   You (should) write tests
   

   View Slide

9. FOR YOUR
   AUTOMATION SCRIPTS
   

   View Slide

10. Use scaffold generator tools
    
    Use boilerplates without really understanding them
    or knowing their dependencies
    
    Add 3rd party modules just because they work
    
    Declare your dependencies using SemVer ranges
    (^3.2.1, ~1.0.1) instead of specifying exact
    versions
    
    Don’t write any test
    

    View Slide

11. IT’S TIME TO TAKE
    CONTROL BACK
    

    View Slide

12. GIVE SOME LOVE
    TO YOUR PROJECTS SCAFFOLD!
    IT WILL BE PAID BACK TENFOLD!
    

    View Slide

13. ABSTRACT
    YOUR
    AUTOMATION
    SCRIPTS
    

    View Slide

14. decouple automation scripts from the underlying
    tools
    
    expose clean APIs, easy to use and understand
    
    write automation scripts as plain node modules
    
    invoke the modules directly or use npm scripts to
    do it
    
    if you feel fancy you could create your own
    command prompt
    

    View Slide

15. Test your commands
    Your web services are
    tested
    
    Your SPA is tested
    
    Why your automation
    scripts are not tested?
    

    View Slide

16. THINK ACROSS SYSTEMS
    

    View Slide

17. Most development teams are distributed across
    the 3 major OS
    
    Use cross-OS tools to avoid unwanted constraints
    for your projects (cross-env, shelljs, dthree/cash)
    
    Point out clearly in your docs when you are using
    different tools for different OS
    

    View Slide

18. Document it!
    Document every command
    available to your project
    
    For small projects a good
    readme file should be
    enough
    
    For bigger projects create
    multiple markdown files and
    use GitBook to compile them
    
    Document regularly and from
    the start of a project life!
    

    View Slide

19. SOMETIMES
    IS GOOD
    TO BE PICKY!
    

    View Slide

20. Try to use 3rd party tools only when they are really useful
    
    If you must have dependencies choose stable and well
    maintained ones
    
    Try to write your automation scripts whenever possible
    
    less problems for unmaintained deps
    
    lower technical debt of your projects
    

    View Slide

21. REGULAR MAINTENANCE
    

    View Slide

22. Your web project is alive, it will always change and
    evolve
    
    Your dependencies are alive too, keep an eye on
    them
    
    A balance between change and stability is
    required
    

    View Slide

23. Check and update often your projects
    dependencies
    
    Do it weekly, it’s great and is really unobtrusive
    
    In a team of 3 developer every one will spend few
    hours per month to maintain your projects
    dependencies updated
    
    Improve your team knowledge of projects
    maintenance
    

    View Slide

24. Summary
    Abstract your automation scripts
    
    Test your automation scripts
    
    Document your automation scripts
    
    Keep your dev-dependencies updated
    

    View Slide

25. Thanks!
    @CEF62
    

    View Slide