Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Continuous Integration with Trunk-based and Feature toggle

Continuous Integration with Trunk-based and Feature toggle

Continuous Integration with Trunk-based and Feature toggle

Azizi Yazit

July 11, 2022
Tweet

More Decks by Azizi Yazit

Other Decks in Research

Transcript

  1. Continuous
    Integration with
    Trunk-based &
    Feature Toggle
    @aziziyazit
    DEV OPS
    Code
    Plan
    Test
    Release
    O
    perate
    Monitor

    View full-size slide

  2. Continuous Integration (CI)
    Continuous
    delivery
    Continuous
    integration
    integrate
    integrate
    integrate
    1x
    2x
    4x automated
    build
    DEV OPS
    Code
    Plan
    Test
    Release
    O
    perate
    Monitor
    1 day

    View full-size slide

  3. Trunk-based Development (TBD)
    Continuous
    delivery
    Continuous
    integration
    merge
    merge
    merge
    1 PR
    2 PR’s
    4 PR’s trunk
    1 day
    short-lived branches

    View full-size slide

  4. Trunk-Based Development (TBD)
    Trunk-Based Development is a key enabler
    of Continuous Integration
    DEV OPS
    Code
    Plan
    Test
    Release
    O
    perate
    Monitor

    View full-size slide

  5. Trunk-based strategies
    Branch by Abstraction
    Use branch-by-abstraction to make
    complex or larger scale changes to
    to your application incrementally
    while keeping the system working.

    View full-size slide

  6. Trunk-based strategies
    Branch by Abstraction
    TypographyComponent
    TextfieldComponent
    ButtonComponent
    LinkComponent

    View full-size slide

  7. Trunk-based strategies
    Branch by Abstraction
    button branch
    trunk
    register
    page branch
    textfield branch
    component, test & storybook
    component, test & storybook
    PR
    new branch
    new branch
    new branch
    PR
    pull from
    mainline
    pull from
    mainline
    PR

    View full-size slide

  8. Trunk-based strategies
    Branch by Abstraction
    button branch
    trunk
    register
    page branch
    textfield branch
    PR
    new branch
    new branch
    new branch
    PR
    pull from
    mainline
    pull from
    mainline
    PR
    component, test & storybook
    component, test & storybook
    component as abstraction

    View full-size slide

  9. button branch
    trunk
    register
    page branch
    textfield branch
    component, test & storybook
    component, test & storybook
    PR
    PR
    pull from
    mainline
    pull from
    mainline
    PR
    new branch
    new branch
    Trunk-based strategies
    Branch by Abstraction
    new branch
    Short-lived branches

    View full-size slide

  10. button branch
    trunk
    register
    page branch
    textfield branch
    component, test & storybook
    component, test & storybook
    new branch
    new branch
    new branch
    PR
    Trunk-based strategies
    Branch by Abstraction
    PR
    PR
    pull from
    mainline
    pull from
    mainline
    Concurrent development
    Small commit - continuous code review

    View full-size slide

  11. Trunk-based strategies
    Feature Toggle
    Feature Toggles are a powerful
    technique, allowing teams to
    modify system behavior without
    changing code.
    martinfowler.com

    View full-size slide

  12. Trunk-based strategies
    Feature Toggle using Angular
    APP_
    INITIALIZER
    APP STATE
    images taken from flaticon.com
    Feature Flag
    Directive
    App
    true
    false
    true
    true

    View full-size slide

  13. Trunk-based strategies
    Feature Toggle using Angular
    {
    “featureA”: true,
    “featureB”: false,
    “featureC”: true,
    “featureD”: false,
    }
    Feature Flags




    this will be shown
    this will be hide
    https://dev.to/ngconf/feature-flags-in-angular-3ic7

    View full-size slide

  14. {
    “featureA”: true,
    “featureB”: false,
    “featureC”: true,
    “featureD”: false,
    }
    Feature Flags


    this will be hide
    https://dev.to/ngconf/feature-flags-in-angular-3ic7
    Trunk-based strategies
    Feature Toggle using Angular


    this will be shown


    this will be shown
    “featureA”: true

    View full-size slide

  15. Trunk-based strategies
    Feature Toggle
    trunk
    releases
    feature A branch
    MVP 1.0
    flag off
    MVP 1.1
    flag on flag
    removed
    MVP 2.0
    feature A
    feature A
    feature B branch
    pull from
    mainline

    View full-size slide

  16. trunk
    releases
    feature A branch
    MVP 1.0
    flag on flag
    removed
    MVP 2.0
    feature A
    feature B branch
    commit to trunk at least
    once every 24 hours
    codebase is always releasable
    on demand and helps to make
    Continuous Delivery a reality
    Trunk-based strategies
    Feature Toggle
    flag off
    MVP 1.1
    feature A
    pull from
    mainline

    View full-size slide

  17. Summary
    Continuous integration complementing Agile and
    Trunk-based is the key enabler for Continuous
    integration. They are supporting each other to
    accomplish the goal to speed up the time to ship the
    product to customers as early as possible.
    Team should adapt techniques like branch-by-
    abstraction and feature toggles in day to day
    development to allow smooth and safe code
    integration.

    View full-size slide