[{"data":1,"prerenderedAt":1919},["ShallowReactive",2],{"/blog/gitlab-at-vue-conf":3,"navigation-en-us":1136,"banner-en-us":1562,"footer-en-us":1572,"blog-post-authors-en-us-Filipa Lacerda":1817,"blog-related-posts-en-us-gitlab-at-vue-conf":1831,"blog-promotions-en-us":1855,"next-steps-en-us":1909},{"id":4,"title":5,"authors":6,"body":8,"category":1100,"date":1101,"description":1102,"extension":1103,"externalUrl":1104,"faq":1104,"featured":1105,"heroImage":1106,"meta":1107,"navigation":151,"path":1124,"seo":1125,"slug":1129,"stem":1130,"tags":1131,"template":1134,"updatedDate":1104,"__hash__":1135},"blogPosts/en-us/blog/gitlab-at-vue-conf.md","GitLab was at VueConf 2017!",[7],"Filipa Lacerda",{"type":9,"value":10,"toc":1096},"minimark",[11,40,55,58,92,101,106,109,112,127,135,207,210,381,388,483,666,669,672,987,990,993,1005,1008,1028,1032,1067,1073,1092],[12,13,14,15,21,22,27,28,33,34,39],"p",{},"Last week I attended ",[16,17,20],"a",{"href":18,"rel":19},"https://conf.vuejs.org/",[],"VueConf 2017"," explaining how we, at GitLab, changed from ",[16,23,26],{"href":24,"rel":25},"http://coffeescript.org/",[],"CoffeeScript"," to ",[16,29,32],{"href":30,"rel":31},"http://www.ecma-international.org/ecma-262/6.0/",[],"EcmaScript 6"," and how we included ",[16,35,38],{"href":36,"rel":37},"https://vuejs.org/",[],"Vue.js"," in our stack.",[12,41,42,43,48,49,54],{},"VueConf took place in the beautiful city of ",[16,44,47],{"href":45,"rel":46},"https://en.wikipedia.org/wiki/Wroc%C5%82aw",[],"Wrocław"," in Poland. Props to ",[16,50,53],{"href":51,"rel":52},"https://www.monterail.com/",[],"Monterail"," for putting together such a well-organized conference.",[12,56,57],{},"I had the pleasure of meeting all the speakers and organizers and the Vue community is inspiring. Everyone is kind and willing to share their knowledge. Having Evan You personally introduce everyone says a lot about the spirit of this community.",[12,59,60,61,64,65,64,70,64,75,64,80,85,86,91],{},"This conference would not have been possible without the help of the sponsors and organizers, thank you ",[16,62,53],{"href":51,"rel":63},[],", ",[16,66,69],{"href":67,"rel":68},"https://codeship.com/",[],"Codeship",[16,71,74],{"href":72,"rel":73},"https://monaca.io/",[],"Monaca",[16,76,79],{"href":77,"rel":78},"https://www.nativescript.org/",[],"Native Script",[16,81,84],{"href":82,"rel":83},"https://twitter.com/youyuxi",[],"Evan You"," and ",[16,87,90],{"href":88,"rel":89},"https://twitter.com/damiandulisz",[],"Damian Dulisz"," for organizing such a great conference!",[12,93,94,95,100],{},"In the ",[16,96,99],{"href":97,"rel":98},"https://filipa.gitlab.io/vue_conf_2017/vue_gitlab_2017.pdf",[],"slides for my talk",", I guide you through our journey from CoffeeScript to ES6 and from jQuery to Vue.js.",[102,103,105],"h2",{"id":104},"how-we-use-vue-at-gitlab","How we use Vue at GitLab",[12,107,108],{},"As stated in previous blog posts, we will not rewrite all our code in Vue.js. Instead, we will create several small Vue applications, which is similar to many small Single Page Applications.",[12,110,111],{},"In order to help us with state management, we chose a simple architecture and data flow to build our Vue Applications. We have a main Vue component, a service that allows us to get data and a store that saves the data we receive from the service:",[12,113,114,120],{},[115,116],"img",{"alt":117,"src":118,"title":119},"architecture-1","https://res.cloudinary.com/about-gitlab-com/image/upload/v1782398332/blog/Content%20Images/gitlab-at-vue-conf/graph_arc_1.png","Vue Application Architecture",[121,122,123],"em",{},[124,125,126],"small",{},"Vue Application Architecture and Data Flow.",[12,128,129,130,134],{},"We start by adding an element to the DOM in the haml file, and point to a JavaScript file. We take advantage of ",[131,132,133],"code",{},"data-attributes"," to transfer data we only have access in Rails through our Vue application.",[136,137,142],"pre",{"className":138,"code":139,"language":140,"meta":141,"style":141},"language-html shiki shiki-themes github-light","\n  #pipelines-list-vue{ data: {\n    endpoint: namespace_project_pipelines_path(@project),\n    \"help-page-path\" => help_page_path(@project),\n    \"all-path\" =>  project_pipelines_path(@project),\n    \"pending-path\" => project_pipelines_path(@projec),\n    \"ci-lint-path\" => ci_lint_path } }\n\n  = webpack_bundle_tag('common_vue')\n  = webpack_bundle_tag('pipelines')\n\n","html","",[131,143,144,153,160,166,172,178,184,190,195,201],{"__ignoreMap":141},[145,146,149],"span",{"class":147,"line":148},"line",1,[145,150,152],{"emptyLinePlaceholder":151},true,"\n",[145,154,156],{"class":147,"line":155},2,[145,157,159],{"class":158},"sgsFI","  #pipelines-list-vue{ data: {\n",[145,161,163],{"class":147,"line":162},3,[145,164,165],{"class":158},"    endpoint: namespace_project_pipelines_path(@project),\n",[145,167,169],{"class":147,"line":168},4,[145,170,171],{"class":158},"    \"help-page-path\" => help_page_path(@project),\n",[145,173,175],{"class":147,"line":174},5,[145,176,177],{"class":158},"    \"all-path\" =>  project_pipelines_path(@project),\n",[145,179,181],{"class":147,"line":180},6,[145,182,183],{"class":158},"    \"pending-path\" => project_pipelines_path(@projec),\n",[145,185,187],{"class":147,"line":186},7,[145,188,189],{"class":158},"    \"ci-lint-path\" => ci_lint_path } }\n",[145,191,193],{"class":147,"line":192},8,[145,194,152],{"emptyLinePlaceholder":151},[145,196,198],{"class":147,"line":197},9,[145,199,200],{"class":158},"  = webpack_bundle_tag('common_vue')\n",[145,202,204],{"class":147,"line":203},10,[145,205,206],{"class":158},"  = webpack_bundle_tag('pipelines')\n",[12,208,209],{},"The next step is to create a bundle file where we are going to mount our application. We can say this is the index file of our application.",[136,211,215],{"className":212,"code":213,"language":214,"meta":141,"style":141},"language-javascript shiki shiki-themes github-light","\n  import Vue from 'vue';\n  import pipelinesComponent from './pipelines.vue';\n\n  document.addEventListener('DOMContentLoaded', () => {\n    return new Vue({\n      el: '#pipelines-list-vue',\n\n      components: {\n        pipelinesComponent,\n      },\n\n      render(createElement) {\n        return createElement('pipelines-component');\n      },\n    });\n  });\n\n","javascript",[131,216,217,221,240,254,258,282,296,307,311,316,321,327,332,347,364,369,375],{"__ignoreMap":141},[145,218,219],{"class":147,"line":148},[145,220,152],{"emptyLinePlaceholder":151},[145,222,223,227,230,233,237],{"class":147,"line":155},[145,224,226],{"class":225},"sD7c4","  import",[145,228,229],{"class":158}," Vue ",[145,231,232],{"class":225},"from",[145,234,236],{"class":235},"sYBdl"," 'vue'",[145,238,239],{"class":158},";\n",[145,241,242,244,247,249,252],{"class":147,"line":162},[145,243,226],{"class":225},[145,245,246],{"class":158}," pipelinesComponent ",[145,248,232],{"class":225},[145,250,251],{"class":235}," './pipelines.vue'",[145,253,239],{"class":158},[145,255,256],{"class":147,"line":168},[145,257,152],{"emptyLinePlaceholder":151},[145,259,260,263,267,270,273,276,279],{"class":147,"line":174},[145,261,262],{"class":158},"  document.",[145,264,266],{"class":265},"s7eDp","addEventListener",[145,268,269],{"class":158},"(",[145,271,272],{"class":235},"'DOMContentLoaded'",[145,274,275],{"class":158},", () ",[145,277,278],{"class":225},"=>",[145,280,281],{"class":158}," {\n",[145,283,284,287,290,293],{"class":147,"line":180},[145,285,286],{"class":225},"    return",[145,288,289],{"class":225}," new",[145,291,292],{"class":265}," Vue",[145,294,295],{"class":158},"({\n",[145,297,298,301,304],{"class":147,"line":186},[145,299,300],{"class":158},"      el: ",[145,302,303],{"class":235},"'#pipelines-list-vue'",[145,305,306],{"class":158},",\n",[145,308,309],{"class":147,"line":192},[145,310,152],{"emptyLinePlaceholder":151},[145,312,313],{"class":147,"line":197},[145,314,315],{"class":158},"      components: {\n",[145,317,318],{"class":147,"line":203},[145,319,320],{"class":158},"        pipelinesComponent,\n",[145,322,324],{"class":147,"line":323},11,[145,325,326],{"class":158},"      },\n",[145,328,330],{"class":147,"line":329},12,[145,331,152],{"emptyLinePlaceholder":151},[145,333,335,338,340,344],{"class":147,"line":334},13,[145,336,337],{"class":265},"      render",[145,339,269],{"class":158},[145,341,343],{"class":342},"sqxcx","createElement",[145,345,346],{"class":158},") {\n",[145,348,350,353,356,358,361],{"class":147,"line":349},14,[145,351,352],{"class":225},"        return",[145,354,355],{"class":265}," createElement",[145,357,269],{"class":158},[145,359,360],{"class":235},"'pipelines-component'",[145,362,363],{"class":158},");\n",[145,365,367],{"class":147,"line":366},15,[145,368,326],{"class":158},[145,370,372],{"class":147,"line":371},16,[145,373,374],{"class":158},"    });\n",[145,376,378],{"class":147,"line":377},17,[145,379,380],{"class":158},"  });\n",[12,382,383,384,387],{},"We then need to create our store and our service, they are both simple classes. To communicate with our API we use ",[131,385,386],{},"vue-resource"," to help us.",[136,389,391],{"className":212,"code":390,"language":214,"meta":141,"style":141},"\n  // store.js\n  export default class PipelinesStore {\n    constructor() {\n      this.state.pipelines = [];\n    }\n    storePipelines(pipelines = []) {\n      this.state.pipelines = pipelines;\n    }\n  }\n\n",[131,392,393,397,403,419,427,442,447,463,474,478],{"__ignoreMap":141},[145,394,395],{"class":147,"line":148},[145,396,152],{"emptyLinePlaceholder":151},[145,398,399],{"class":147,"line":155},[145,400,402],{"class":401},"sAwPA","  // store.js\n",[145,404,405,408,411,414,417],{"class":147,"line":162},[145,406,407],{"class":225},"  export",[145,409,410],{"class":225}," default",[145,412,413],{"class":225}," class",[145,415,416],{"class":265}," PipelinesStore",[145,418,281],{"class":158},[145,420,421,424],{"class":147,"line":168},[145,422,423],{"class":225},"    constructor",[145,425,426],{"class":158},"() {\n",[145,428,429,433,436,439],{"class":147,"line":174},[145,430,432],{"class":431},"sYu0t","      this",[145,434,435],{"class":158},".state.pipelines ",[145,437,438],{"class":225},"=",[145,440,441],{"class":158}," [];\n",[145,443,444],{"class":147,"line":180},[145,445,446],{"class":158},"    }\n",[145,448,449,452,454,457,460],{"class":147,"line":186},[145,450,451],{"class":265},"    storePipelines",[145,453,269],{"class":158},[145,455,456],{"class":342},"pipelines",[145,458,459],{"class":225}," =",[145,461,462],{"class":158}," []) {\n",[145,464,465,467,469,471],{"class":147,"line":192},[145,466,432],{"class":431},[145,468,435],{"class":158},[145,470,438],{"class":225},[145,472,473],{"class":158}," pipelines;\n",[145,475,476],{"class":147,"line":197},[145,477,446],{"class":158},[145,479,480],{"class":147,"line":203},[145,481,482],{"class":158},"  }\n",[136,484,486],{"className":212,"code":485,"language":214,"meta":141,"style":141},"\n  // service.js\n  import Vue from 'vue';\n  import VueResource from 'vue-resource';\n\n  Vue.use(VueResource);\n\n  export default class PipelinesService {\n    constructor(endpoint) {\n      this.pipelines = Vue.resource(endpoint);\n    }\n    getPipelines(data = {}) {\n      return this.pipelines.get(data);\n    }\n    postAction(endpoint) {\n      return Vue.http.post(`${endpoint}.json`);\n    }\n  }\n\n",[131,487,488,492,497,509,523,527,538,542,555,566,584,588,603,620,624,635,657,661],{"__ignoreMap":141},[145,489,490],{"class":147,"line":148},[145,491,152],{"emptyLinePlaceholder":151},[145,493,494],{"class":147,"line":155},[145,495,496],{"class":401},"  // service.js\n",[145,498,499,501,503,505,507],{"class":147,"line":162},[145,500,226],{"class":225},[145,502,229],{"class":158},[145,504,232],{"class":225},[145,506,236],{"class":235},[145,508,239],{"class":158},[145,510,511,513,516,518,521],{"class":147,"line":168},[145,512,226],{"class":225},[145,514,515],{"class":158}," VueResource ",[145,517,232],{"class":225},[145,519,520],{"class":235}," 'vue-resource'",[145,522,239],{"class":158},[145,524,525],{"class":147,"line":174},[145,526,152],{"emptyLinePlaceholder":151},[145,528,529,532,535],{"class":147,"line":180},[145,530,531],{"class":158},"  Vue.",[145,533,534],{"class":265},"use",[145,536,537],{"class":158},"(VueResource);\n",[145,539,540],{"class":147,"line":186},[145,541,152],{"emptyLinePlaceholder":151},[145,543,544,546,548,550,553],{"class":147,"line":192},[145,545,407],{"class":225},[145,547,410],{"class":225},[145,549,413],{"class":225},[145,551,552],{"class":265}," PipelinesService",[145,554,281],{"class":158},[145,556,557,559,561,564],{"class":147,"line":197},[145,558,423],{"class":225},[145,560,269],{"class":158},[145,562,563],{"class":342},"endpoint",[145,565,346],{"class":158},[145,567,568,570,573,575,578,581],{"class":147,"line":203},[145,569,432],{"class":431},[145,571,572],{"class":158},".pipelines ",[145,574,438],{"class":225},[145,576,577],{"class":158}," Vue.",[145,579,580],{"class":265},"resource",[145,582,583],{"class":158},"(endpoint);\n",[145,585,586],{"class":147,"line":323},[145,587,446],{"class":158},[145,589,590,593,595,598,600],{"class":147,"line":329},[145,591,592],{"class":265},"    getPipelines",[145,594,269],{"class":158},[145,596,597],{"class":342},"data",[145,599,459],{"class":225},[145,601,602],{"class":158}," {}) {\n",[145,604,605,608,611,614,617],{"class":147,"line":334},[145,606,607],{"class":225},"      return",[145,609,610],{"class":431}," this",[145,612,613],{"class":158},".pipelines.",[145,615,616],{"class":265},"get",[145,618,619],{"class":158},"(data);\n",[145,621,622],{"class":147,"line":349},[145,623,446],{"class":158},[145,625,626,629,631,633],{"class":147,"line":366},[145,627,628],{"class":265},"    postAction",[145,630,269],{"class":158},[145,632,563],{"class":342},[145,634,346],{"class":158},[145,636,637,639,642,645,647,650,652,655],{"class":147,"line":371},[145,638,607],{"class":225},[145,640,641],{"class":158}," Vue.http.",[145,643,644],{"class":265},"post",[145,646,269],{"class":158},[145,648,649],{"class":235},"`${",[145,651,563],{"class":158},[145,653,654],{"class":235},"}.json`",[145,656,363],{"class":158},[145,658,659],{"class":147,"line":377},[145,660,446],{"class":158},[145,662,664],{"class":147,"line":663},18,[145,665,482],{"class":158},[12,667,668],{},"The next step is to create our main component where we bind everything together. As soon as the component is created we make a call to the service, and if everything goes well, we tell the store to use the received data. If we get an error we simply show a warning to the user.",[12,670,671],{},"Usually we have several smaller components that are used in the main one, that allows us not only to reuse them but also to have readable files.",[136,673,677],{"className":674,"code":675,"language":676,"meta":141,"style":141},"language-vue shiki shiki-themes github-light","\u003Cscript>\n  import Service from 'service';\n  import Store from 'store';\n\n  export default {\n    data() {\n      const dataset = document.querySelector('#pipelines-list-vue').dataset;\n      const store = new Store();\n      const service = new Service(endpoint);\n\n      return {\n        store,\n        service,\n      };\n    },\n    created() {\n      this.service.getPipelines()\n        .then((response) => response.json())\n        .then((pipelines) => this.store.storePipelines(pipelines))\n        .catch((error) => this.handleError(error));\n    },\n  };\n\u003C/script>\n\n\u003Ctemplate>\n  \u003Ctable>..\u003C/table>\n\u003C/template>\n","vue",[131,678,679,691,705,719,723,731,738,761,778,794,798,804,809,814,819,824,831,844,872,898,926,931,937,947,952,962,978],{"__ignoreMap":141},[145,680,681,684,688],{"class":147,"line":148},[145,682,683],{"class":158},"\u003C",[145,685,687],{"class":686},"shJU0","script",[145,689,690],{"class":158},">\n",[145,692,693,695,698,700,703],{"class":147,"line":155},[145,694,226],{"class":225},[145,696,697],{"class":158}," Service ",[145,699,232],{"class":225},[145,701,702],{"class":235}," 'service'",[145,704,239],{"class":158},[145,706,707,709,712,714,717],{"class":147,"line":162},[145,708,226],{"class":225},[145,710,711],{"class":158}," Store ",[145,713,232],{"class":225},[145,715,716],{"class":235}," 'store'",[145,718,239],{"class":158},[145,720,721],{"class":147,"line":168},[145,722,152],{"emptyLinePlaceholder":151},[145,724,725,727,729],{"class":147,"line":174},[145,726,407],{"class":225},[145,728,410],{"class":225},[145,730,281],{"class":158},[145,732,733,736],{"class":147,"line":180},[145,734,735],{"class":265},"    data",[145,737,426],{"class":158},[145,739,740,743,746,748,751,754,756,758],{"class":147,"line":186},[145,741,742],{"class":225},"      const",[145,744,745],{"class":431}," dataset",[145,747,459],{"class":225},[145,749,750],{"class":158}," document.",[145,752,753],{"class":265},"querySelector",[145,755,269],{"class":158},[145,757,303],{"class":235},[145,759,760],{"class":158},").dataset;\n",[145,762,763,765,768,770,772,775],{"class":147,"line":192},[145,764,742],{"class":225},[145,766,767],{"class":431}," store",[145,769,459],{"class":225},[145,771,289],{"class":225},[145,773,774],{"class":265}," Store",[145,776,777],{"class":158},"();\n",[145,779,780,782,785,787,789,792],{"class":147,"line":197},[145,781,742],{"class":225},[145,783,784],{"class":431}," service",[145,786,459],{"class":225},[145,788,289],{"class":225},[145,790,791],{"class":265}," Service",[145,793,583],{"class":158},[145,795,796],{"class":147,"line":203},[145,797,152],{"emptyLinePlaceholder":151},[145,799,800,802],{"class":147,"line":323},[145,801,607],{"class":225},[145,803,281],{"class":158},[145,805,806],{"class":147,"line":329},[145,807,808],{"class":158},"        store,\n",[145,810,811],{"class":147,"line":334},[145,812,813],{"class":158},"        service,\n",[145,815,816],{"class":147,"line":349},[145,817,818],{"class":158},"      };\n",[145,820,821],{"class":147,"line":366},[145,822,823],{"class":158},"    },\n",[145,825,826,829],{"class":147,"line":371},[145,827,828],{"class":265},"    created",[145,830,426],{"class":158},[145,832,833,835,838,841],{"class":147,"line":377},[145,834,432],{"class":431},[145,836,837],{"class":158},".service.",[145,839,840],{"class":265},"getPipelines",[145,842,843],{"class":158},"()\n",[145,845,846,849,852,855,858,861,863,866,869],{"class":147,"line":663},[145,847,848],{"class":158},"        .",[145,850,851],{"class":265},"then",[145,853,854],{"class":158},"((",[145,856,857],{"class":342},"response",[145,859,860],{"class":158},") ",[145,862,278],{"class":225},[145,864,865],{"class":158}," response.",[145,867,868],{"class":265},"json",[145,870,871],{"class":158},"())\n",[145,873,875,877,879,881,883,885,887,889,892,895],{"class":147,"line":874},19,[145,876,848],{"class":158},[145,878,851],{"class":265},[145,880,854],{"class":158},[145,882,456],{"class":342},[145,884,860],{"class":158},[145,886,278],{"class":225},[145,888,610],{"class":431},[145,890,891],{"class":158},".store.",[145,893,894],{"class":265},"storePipelines",[145,896,897],{"class":158},"(pipelines))\n",[145,899,901,903,906,908,911,913,915,917,920,923],{"class":147,"line":900},20,[145,902,848],{"class":158},[145,904,905],{"class":265},"catch",[145,907,854],{"class":158},[145,909,910],{"class":342},"error",[145,912,860],{"class":158},[145,914,278],{"class":225},[145,916,610],{"class":431},[145,918,919],{"class":158},".",[145,921,922],{"class":265},"handleError",[145,924,925],{"class":158},"(error));\n",[145,927,929],{"class":147,"line":928},21,[145,930,823],{"class":158},[145,932,934],{"class":147,"line":933},22,[145,935,936],{"class":158},"  };\n",[145,938,940,943,945],{"class":147,"line":939},23,[145,941,942],{"class":158},"\u003C/",[145,944,687],{"class":686},[145,946,690],{"class":158},[145,948,950],{"class":147,"line":949},24,[145,951,152],{"emptyLinePlaceholder":151},[145,953,955,957,960],{"class":147,"line":954},25,[145,956,683],{"class":158},[145,958,959],{"class":686},"template",[145,961,690],{"class":158},[145,963,965,968,971,974,976],{"class":147,"line":964},26,[145,966,967],{"class":158},"  \u003C",[145,969,970],{"class":686},"table",[145,972,973],{"class":158},">..\u003C/",[145,975,970],{"class":686},[145,977,690],{"class":158},[145,979,981,983,985],{"class":147,"line":980},27,[145,982,942],{"class":158},[145,984,959],{"class":686},[145,986,690],{"class":158},[12,988,989],{},"In some places we have more complex cases where we can’t rewrite it all in Vue, and we’ll have to use html and jQuery as well.",[12,991,992],{},"For example, in the Pipelines' details page, only the header and the graph are built in Vue.js since are the only ones with real time data.\nIf we built this page with the architecture explained above, we would need to fetch data from the same endpoint twice, and we need to poll the same endpoint twice, which is not a good idea. To avoid duplicate network calls we created a mediator to act as our main component.",[12,994,995,1000],{},[115,996],{"alt":997,"src":998,"title":999},"architecture-2","https://res.cloudinary.com/about-gitlab-com/image/upload/v1782398332/blog/Content%20Images/gitlab-at-vue-conf/graph_arc_2.png","Vue Application Architecture with a Mediator",[121,1001,1002],{},[124,1003,1004],{},"A Mediator allows us to reuse the same state between Vue Applications.",[12,1006,1007],{},"The mediator not only allows us to avoid duplicate network calls, it also allows us to share state between the two Vue Applications and reduce repeated code. It also has the major advantage that can be easily transformed into a Vue main component if needed.",[12,1009,1010,1011,1016,1017,1022,1023,919],{},"You can read more about our architecture ",[16,1012,1015],{"href":1013,"rel":1014},"https://docs.gitlab.com/development/fe_guide/vue/#vue-architecture",[],"here",". We have documentation explaining ",[16,1018,1021],{"href":1019,"rel":1020},"https://docs.gitlab.com/development/fe_guide/vue/#when-to-use-vue-js",[],"when to use vue at GitLab"," and how to do it. We also have a small ",[16,1024,1027],{"href":1025,"rel":1026},"https://docs.gitlab.com/development/fe_guide/style/javascript/#vuejs",[],"style guide for our vue code",[102,1029,1031],{"id":1030},"future-plans-for-vue-at-gitlab","Future plans for Vue at GitLab",[1033,1034,1035,1039,1046,1053,1060],"ol",{},[1036,1037,1038],"li",{},"The next step is to make sure all our Vue code looks the same and is organized well.",[1036,1040,1041,1042,919],{},"Other thing we need to do is to have all components in .vue files. You can see the issue ",[16,1043,1015],{"href":1044,"rel":1045},"https://gitlab.com/gitlab-org/gitlab-ce/issues/34371",[],[1036,1047,1048,1049,919],{},"We also need to create reusable components. With all new Vue.js code being added at the same time we ended up with a lot of repeated code in Vue, which we have identified and are currently transforming into reusable components. You can see the issue ",[16,1050,1015],{"href":1051,"rel":1052},"https://gitlab.com/gitlab-org/gitlab-ce/issues/30286",[],[1036,1054,1055,1056,919],{},"We need a linter. Vue is currently the only part of our frontend code that does not have a linter yet, although we have a style guide for Vue.js in our documentation. You can see the issue ",[16,1057,1015],{"href":1058,"rel":1059},"https://gitlab.com/gitlab-org/gitlab-ce/issues/34312",[],[1036,1061,1062,1063,919],{},"We are currently experimenting adding Vuex to our stack to see if it can help us in more complex areas of our code. The merge request is ",[16,1064,1015],{"href":1065,"rel":1066},"https://gitlab.com/gitlab-org/gitlab-ce/merge_requests/12069",[],[12,1068,1069,1070],{},"Hope to see you at the next VueConf! ",[121,1071,1072],{},"Na zdrowie!",[12,1074,1075,1080,1081,1086,1087],{},[16,1076,1079],{"href":1077,"rel":1078},"https://pixabay.com/en/wroc%C5%82aw-lower-silesia-architecture-1663406/",[],"Cover image"," by ",[16,1082,1085],{"href":1083,"rel":1084},"https://pixabay.com/en/users/przemokrzak-2778444/",[],"Przemysław Krzak"," is licensed under ",[16,1088,1091],{"href":1089,"rel":1090},"https://creativecommons.org/publicdomain/zero/1.0/",[],"CC0 1.0",[1093,1094,1095],"style",{},"html pre.shiki code .sgsFI, html code.shiki .sgsFI{--shiki-default:#24292E}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html pre.shiki code .sD7c4, html code.shiki .sD7c4{--shiki-default:#D73A49}html pre.shiki code .sYBdl, html code.shiki .sYBdl{--shiki-default:#032F62}html pre.shiki code .s7eDp, html code.shiki .s7eDp{--shiki-default:#6F42C1}html pre.shiki code .sqxcx, html code.shiki .sqxcx{--shiki-default:#E36209}html pre.shiki code .sAwPA, html code.shiki .sAwPA{--shiki-default:#6A737D}html pre.shiki code .sYu0t, html code.shiki .sYu0t{--shiki-default:#005CC5}html pre.shiki code .shJU0, html code.shiki .shJU0{--shiki-default:#22863A}",{"title":141,"searchDepth":155,"depth":155,"links":1097},[1098,1099],{"id":104,"depth":155,"text":105},{"id":1030,"depth":155,"text":1031},"company","2017-06-29","GitLab was at VueConf 2017 sharing how we use Vue.js.","md",null,false,"https://res.cloudinary.com/about-gitlab-com/image/upload/v1749682980/Blog/Hero%20Images/cover_image.jpg",{"excerpt":1108},{"type":9,"value":1109},[1110],[12,1111,14,1112,21,1115,27,1118,33,1121,39],{},[16,1113,20],{"href":18,"rel":1114},[],[16,1116,26],{"href":24,"rel":1117},[],[16,1119,32],{"href":30,"rel":1120},[],[16,1122,38],{"href":36,"rel":1123},[],"/en-us/blog/gitlab-at-vue-conf",{"title":5,"description":1102,"ogTitle":5,"ogDescription":1102,"noIndex":1105,"ogImage":1106,"ogUrl":1126,"ogSiteName":1127,"ogType":1128,"canonicalUrls":1126},"https://about.gitlab.com/blog/gitlab-at-vue-conf","https://about.gitlab.com","article","gitlab-at-vue-conf","en-us/blog/gitlab-at-vue-conf",[1132,1133],"frontend","events","BlogPost","w6v7RbvXL-CpfDcz0fTBi2lKN21bPT9iwdi_dvK93LU",{"logo":1137,"freeTrial":1142,"sales":1147,"login":1152,"items":1157,"search":1482,"minimal":1513,"duo":1532,"switchNav":1541,"pricingDeployment":1552},{"config":1138},{"href":1139,"dataGaName":1140,"dataGaLocation":1141},"/","gitlab logo","header",{"text":1143,"config":1144},"Get free trial",{"href":1145,"dataGaName":1146,"dataGaLocation":1141},"https://gitlab.com/-/trial_registrations/new?glm_source=about.gitlab.com&glm_content=default-saas-trial/","free trial",{"text":1148,"config":1149},"Request a demo",{"href":1150,"dataGaName":1151,"dataGaLocation":1141},"/sales/?contact-topic=request-demo","sales",{"text":1153,"config":1154},"Sign in",{"href":1155,"dataGaName":1156,"dataGaLocation":1141},"https://gitlab.com/users/sign_in/","sign in",[1158,1187,1287,1292,1405,1460],{"text":1159,"config":1160,"menu":1162},"Platform",{"dataNavLevelOne":1161},"platform",{"type":1163,"columns":1164},"cards",[1165,1171,1179],{"title":1159,"description":1166,"link":1167},"The intelligent orchestration platform for DevSecOps",{"text":1168,"config":1169},"Explore our Platform",{"href":1170,"dataGaName":1161,"dataGaLocation":1141},"/platform/",{"title":1172,"description":1173,"link":1174},"GitLab Duo Agent Platform","Agentic AI for the entire software lifecycle",{"text":1175,"config":1176},"Meet GitLab Duo",{"href":1177,"dataGaName":1178,"dataGaLocation":1141},"/gitlab-duo-agent-platform/","gitlab duo agent platform",{"title":1180,"description":1181,"link":1182},"Why GitLab","See the top reasons enterprises choose GitLab",{"text":1183,"config":1184},"Learn more",{"href":1185,"dataGaName":1186,"dataGaLocation":1141},"/why-gitlab/","why gitlab",{"text":1188,"left":151,"config":1189,"menu":1191},"Product",{"dataNavLevelOne":1190},"solutions",{"type":1192,"link":1193,"columns":1197,"feature":1266},"lists",{"text":1194,"config":1195},"View all Solutions",{"href":1196,"dataGaName":1190,"dataGaLocation":1141},"/solutions/",[1198,1222,1245],{"title":1199,"description":1200,"link":1201,"items":1206},"Automation","CI/CD and automation to accelerate deployment",{"config":1202},{"icon":1203,"href":1204,"dataGaName":1205,"dataGaLocation":1141},"AutomatedCodeAlt","/solutions/delivery-automation/","automated software delivery",[1207,1211,1214,1218],{"text":1208,"config":1209},"CI/CD",{"href":1210,"dataGaLocation":1141,"dataGaName":1208},"/solutions/continuous-integration/",{"text":1172,"config":1212},{"href":1177,"dataGaLocation":1141,"dataGaName":1213},"gitlab duo agent platform - product menu",{"text":1215,"config":1216},"Source Code Management",{"href":1217,"dataGaLocation":1141,"dataGaName":1215},"/solutions/source-code-management/",{"text":1219,"config":1220},"Automated Software Delivery",{"href":1204,"dataGaLocation":1141,"dataGaName":1221},"Automated software delivery",{"title":1223,"description":1224,"link":1225,"items":1230},"Security","Deliver code faster without compromising security",{"config":1226},{"href":1227,"dataGaName":1228,"dataGaLocation":1141,"icon":1229},"/solutions/application-security-testing/","security and compliance","ShieldCheckLight",[1231,1235,1240],{"text":1232,"config":1233},"Application Security Testing",{"href":1227,"dataGaName":1234,"dataGaLocation":1141},"Application security testing",{"text":1236,"config":1237},"Software Supply Chain Security",{"href":1238,"dataGaLocation":1141,"dataGaName":1239},"/solutions/supply-chain/","Software supply chain security",{"text":1241,"config":1242},"Software Compliance",{"href":1243,"dataGaName":1244,"dataGaLocation":1141},"/solutions/software-compliance/","software compliance",{"title":1246,"link":1247,"items":1252},"Measurement",{"config":1248},{"icon":1249,"href":1250,"dataGaName":1251,"dataGaLocation":1141},"DigitalTransformation","/solutions/visibility-measurement/","visibility and measurement",[1253,1257,1261],{"text":1254,"config":1255},"Visibility & Measurement",{"href":1250,"dataGaLocation":1141,"dataGaName":1256},"Visibility and Measurement",{"text":1258,"config":1259},"Value Stream Management",{"href":1260,"dataGaLocation":1141,"dataGaName":1258},"/solutions/value-stream-management/",{"text":1262,"config":1263},"Analytics & Insights",{"href":1264,"dataGaLocation":1141,"dataGaName":1265},"/solutions/analytics-and-insights/","Analytics and insights",{"title":1267,"type":1192,"items":1268},"GitLab for",[1269,1275,1281],{"text":1270,"config":1271},"Enterprise",{"icon":1272,"href":1273,"dataGaLocation":1141,"dataGaName":1274},"Building","/enterprise/","enterprise",{"text":1276,"config":1277},"Small Business",{"icon":1278,"href":1279,"dataGaLocation":1141,"dataGaName":1280},"Work","/small-business/","small business",{"text":1282,"config":1283},"Public Sector",{"icon":1284,"href":1285,"dataGaLocation":1141,"dataGaName":1286},"Organization","/solutions/public-sector/","public sector",{"text":1288,"config":1289},"Pricing",{"href":1290,"dataGaName":1291,"dataGaLocation":1141,"dataNavLevelOne":1291},"/pricing/","pricing",{"text":1293,"config":1294,"menu":1296},"Resources",{"dataNavLevelOne":1295},"resources",{"type":1192,"link":1297,"columns":1301,"feature":1394},{"text":1298,"config":1299},"View all resources",{"href":1300,"dataGaName":1295,"dataGaLocation":1141},"/resources/",[1302,1335,1362],{"title":1303,"items":1304},"Getting started",[1305,1310,1315,1320,1325,1330],{"text":1306,"config":1307},"Install",{"href":1308,"dataGaName":1309,"dataGaLocation":1141},"/install/","install",{"text":1311,"config":1312},"Quick start guides",{"href":1313,"dataGaName":1314,"dataGaLocation":1141},"/get-started/","quick setup checklists",{"text":1316,"config":1317},"Learn",{"href":1318,"dataGaLocation":1141,"dataGaName":1319},"https://university.gitlab.com/","learn",{"text":1321,"config":1322},"Product documentation",{"href":1323,"dataGaName":1324,"dataGaLocation":1141},"https://docs.gitlab.com/","product documentation",{"text":1326,"config":1327},"Best practice videos",{"href":1328,"dataGaName":1329,"dataGaLocation":1141},"/getting-started-videos/","best practice videos",{"text":1331,"config":1332},"Integrations",{"href":1333,"dataGaName":1334,"dataGaLocation":1141},"/integrations/","integrations",{"title":1336,"items":1337},"Discover",[1338,1343,1348,1353,1357],{"text":1339,"config":1340},"Customer success stories",{"href":1341,"dataGaName":1342,"dataGaLocation":1141},"/customers/","customer success stories",{"text":1344,"config":1345},"Blog",{"href":1346,"dataGaName":1347,"dataGaLocation":1141},"/blog/","blog",{"text":1349,"config":1350},"Demo Hub",{"href":1351,"dataGaName":1352,"dataGaLocation":1141},"/demo-hub/","demo hub",{"text":1354,"config":1355},"The Source",{"href":1356,"dataGaName":1347,"dataGaLocation":1141},"/the-source/",{"text":1358,"config":1359},"Remote",{"href":1360,"dataGaName":1361,"dataGaLocation":1141},"https://handbook.gitlab.com/handbook/company/culture/all-remote/","remote",{"title":1363,"items":1364},"Connect",[1365,1370,1375,1380,1385,1389],{"text":1366,"config":1367},"GitLab Services",{"href":1368,"dataGaName":1369,"dataGaLocation":1141},"/services/","services",{"text":1371,"config":1372},"Contribute",{"href":1373,"dataGaName":1374,"dataGaLocation":1141},"https://contributors.gitlab.com","contribute",{"text":1376,"config":1377},"Community",{"href":1378,"dataGaName":1379,"dataGaLocation":1141},"/community/","community",{"text":1381,"config":1382},"Forum",{"href":1383,"dataGaName":1384,"dataGaLocation":1141},"https://forum.gitlab.com/","forum",{"text":1386,"config":1387},"Events",{"href":1388,"dataGaName":1133,"dataGaLocation":1141},"/events/",{"text":1390,"config":1391},"Partners",{"href":1392,"dataGaName":1393,"dataGaLocation":1141},"/partners/","partners",{"config":1395,"title":1398,"text":1399,"link":1400},{"background":1396,"textColor":1397},"url('https://res.cloudinary.com/about-gitlab-com/image/upload/v1777322348/qpq8yrgn8knii57omj0c.png')","#000","What’s new in GitLab","Stay updated with our latest features and improvements.",{"text":1401,"config":1402},"Read the latest",{"href":1403,"dataGaName":1404,"dataGaLocation":1141},"/whats-new/","whats new",{"text":1406,"config":1407,"menu":1408},"Company",{"dataNavLevelOne":1100},{"type":1192,"columns":1409},[1410],{"items":1411},[1412,1417,1423,1425,1430,1435,1440,1445,1450,1455],{"text":1413,"config":1414},"About",{"href":1415,"dataGaName":1416,"dataGaLocation":1141},"/company/","about",{"text":1418,"config":1419,"footerGa":1422},"Jobs",{"href":1420,"dataGaName":1421,"dataGaLocation":1141},"/jobs/","jobs",{"dataGaName":1421},{"text":1386,"config":1424},{"href":1388,"dataGaName":1133,"dataGaLocation":1141},{"text":1426,"config":1427},"Leadership",{"href":1428,"dataGaName":1429,"dataGaLocation":1141},"/company/team/e-group/","leadership",{"text":1431,"config":1432},"Handbook",{"href":1433,"dataGaName":1434,"dataGaLocation":1141},"https://handbook.gitlab.com/","handbook",{"text":1436,"config":1437},"Investor relations",{"href":1438,"dataGaName":1439,"dataGaLocation":1141},"https://ir.gitlab.com/overview/default.aspx","investor relations",{"text":1441,"config":1442},"Trust Center",{"href":1443,"dataGaName":1444,"dataGaLocation":1141},"/security/","trust center",{"text":1446,"config":1447},"AI Transparency Center",{"href":1448,"dataGaName":1449,"dataGaLocation":1141},"/ai-transparency-center/","ai transparency center",{"text":1451,"config":1452},"Newsletter",{"href":1453,"dataGaName":1454,"dataGaLocation":1141},"/company/contact/#contact-forms","newsletter",{"text":1456,"config":1457},"Press",{"href":1458,"dataGaName":1459,"dataGaLocation":1141},"/press/","press",{"text":1461,"config":1462,"menu":1463},"Contact us",{"dataNavLevelOne":1100},{"type":1192,"columns":1464},[1465],{"items":1466},[1467,1472,1477],{"text":1468,"config":1469},"Talk to sales",{"href":1470,"dataGaName":1471,"dataGaLocation":1141},"/sales/","talk to sales",{"text":1473,"config":1474},"Support portal",{"href":1475,"dataGaName":1476,"dataGaLocation":1141},"https://support.gitlab.com/hc/en-us","support portal",{"text":1478,"config":1479},"Customer portal",{"href":1480,"dataGaName":1481,"dataGaLocation":1141},"https://customers.gitlab.com/customers/sign_in/","customer portal",{"close":1483,"login":1484,"suggestions":1491},"Close",{"text":1485,"link":1486},"To search repositories and projects, login to",{"text":1487,"config":1488},"gitlab.com",{"href":1155,"dataGaName":1489,"dataGaLocation":1490},"search login","search",{"text":1492,"default":1493},"Suggestions",[1494,1496,1500,1502,1506,1510],{"text":1172,"config":1495},{"href":1177,"dataGaName":1172,"dataGaLocation":1490},{"text":1497,"config":1498},"Code Suggestions (AI)",{"href":1499,"dataGaName":1497,"dataGaLocation":1490},"/solutions/code-suggestions/",{"text":1208,"config":1501},{"href":1210,"dataGaName":1208,"dataGaLocation":1490},{"text":1503,"config":1504},"GitLab on AWS",{"href":1505,"dataGaName":1503,"dataGaLocation":1490},"/partners/technology-partners/aws/",{"text":1507,"config":1508},"GitLab on Google Cloud",{"href":1509,"dataGaName":1507,"dataGaLocation":1490},"/partners/technology-partners/google-cloud-platform/",{"text":1511,"config":1512},"Why GitLab?",{"href":1185,"dataGaName":1511,"dataGaLocation":1490},{"freeTrial":1514,"mobileIcon":1519,"desktopIcon":1524,"secondaryButton":1527},{"text":1515,"config":1516},"Start free trial",{"href":1517,"dataGaName":1146,"dataGaLocation":1518},"https://gitlab.com/-/trials/new/","nav",{"altText":1520,"config":1521},"Gitlab Icon",{"src":1522,"dataGaName":1523,"dataGaLocation":1518},"https://res.cloudinary.com/about-gitlab-com/image/upload/v1758203874/jypbw1jx72aexsoohd7x.svg","gitlab icon",{"altText":1520,"config":1525},{"src":1526,"dataGaName":1523,"dataGaLocation":1518},"https://res.cloudinary.com/about-gitlab-com/image/upload/v1758203875/gs4c8p8opsgvflgkswz9.svg",{"text":1528,"config":1529},"Get Started",{"href":1530,"dataGaName":1531,"dataGaLocation":1518},"https://gitlab.com/-/trial_registrations/new?glm_source=about.gitlab.com/get-started/","get started",{"freeTrial":1533,"mobileIcon":1537,"desktopIcon":1539},{"text":1534,"config":1535},"Learn more about GitLab Duo",{"href":1177,"dataGaName":1536,"dataGaLocation":1518},"gitlab duo",{"altText":1520,"config":1538},{"src":1522,"dataGaName":1523,"dataGaLocation":1518},{"altText":1520,"config":1540},{"src":1526,"dataGaName":1523,"dataGaLocation":1518},{"button":1542,"mobileIcon":1547,"desktopIcon":1549},{"text":1543,"config":1544},"/switch",{"href":1545,"dataGaName":1546,"dataGaLocation":1518},"#contact","switch",{"altText":1520,"config":1548},{"src":1522,"dataGaName":1523,"dataGaLocation":1518},{"altText":1520,"config":1550},{"src":1551,"dataGaName":1523,"dataGaLocation":1518},"https://res.cloudinary.com/about-gitlab-com/image/upload/v1773335277/ohhpiuoxoldryzrnhfrh.png",{"freeTrial":1553,"mobileIcon":1558,"desktopIcon":1560},{"text":1554,"config":1555},"Back to pricing",{"href":1290,"dataGaName":1556,"dataGaLocation":1518,"icon":1557},"back to pricing","GoBack",{"altText":1520,"config":1559},{"src":1522,"dataGaName":1523,"dataGaLocation":1518},{"altText":1520,"config":1561},{"src":1526,"dataGaName":1523,"dataGaLocation":1518},{"title":1563,"titleMobile":1564,"button":1565,"config":1570},"Duo Agent Platform delivers 400% ROI, per new Forrester Consulting study.","400% ROI: Forrester TEI for GitLab Duo",{"text":1183,"config":1566},{"href":1567,"dataGaName":1568,"dataGaLocation":1569},"https://about.gitlab.com/blog/gitlab-duo-agent-platform-delivers-400-percent-roi/","forrester-tei-dap-banner","global-banner",{"layout":1571,"disabled":1105},"release",{"data":1573},{"text":1574,"source":1575,"edit":1581,"contribute":1586,"config":1591,"items":1596,"minimal":1806},"Git is a trademark of Software Freedom Conservancy and our use of 'GitLab' is under license",{"text":1576,"config":1577},"View page source",{"href":1578,"dataGaName":1579,"dataGaLocation":1580},"https://gitlab.com/gitlab-com/marketing/digital-experience/about-gitlab-com/","page source","footer",{"text":1582,"config":1583},"Edit this page",{"href":1584,"dataGaName":1585,"dataGaLocation":1580},"https://gitlab.com/gitlab-com/marketing/digital-experience/about-gitlab-com/-/blob/main/content/","web ide",{"text":1587,"config":1588},"Please contribute",{"href":1589,"dataGaName":1590,"dataGaLocation":1580},"https://gitlab.com/gitlab-com/marketing/digital-experience/about-gitlab-com/-/blob/main/CONTRIBUTING.md/","please contribute",{"twitter":1592,"facebook":1593,"youtube":1594,"linkedin":1595},"https://twitter.com/gitlab","https://www.facebook.com/gitlab","https://www.youtube.com/channel/UCnMGQ8QHMAnVIsI3xJrihhg","https://www.linkedin.com/company/gitlab-com",[1597,1644,1698,1742,1774],{"title":1288,"links":1598,"subMenu":1613},[1599,1603,1608],{"text":1600,"config":1601},"View plans",{"href":1290,"dataGaName":1602,"dataGaLocation":1580},"view plans",{"text":1604,"config":1605},"Why Premium?",{"href":1606,"dataGaName":1607,"dataGaLocation":1580},"/pricing/premium/","why premium",{"text":1609,"config":1610},"Why Ultimate?",{"href":1611,"dataGaName":1612,"dataGaLocation":1580},"/pricing/ultimate/","why ultimate",[1614],{"title":1615,"links":1616},"Contact Us",[1617,1620,1622,1624,1629,1634,1639],{"text":1618,"config":1619},"Contact sales",{"href":1470,"dataGaName":1151,"dataGaLocation":1580},{"text":1473,"config":1621},{"href":1475,"dataGaName":1476,"dataGaLocation":1580},{"text":1478,"config":1623},{"href":1480,"dataGaName":1481,"dataGaLocation":1580},{"text":1625,"config":1626},"Status",{"href":1627,"dataGaName":1628,"dataGaLocation":1580},"https://status.gitlab.com/","status",{"text":1630,"config":1631},"Terms of use",{"href":1632,"dataGaName":1633,"dataGaLocation":1580},"/terms/","terms of use",{"text":1635,"config":1636},"Privacy statement",{"href":1637,"dataGaName":1638,"dataGaLocation":1580},"/privacy/","privacy statement",{"text":1640,"config":1641},"Cookie preferences",{"dataGaName":1642,"dataGaLocation":1580,"id":1643,"isOneTrustButton":151},"cookie preferences","ot-sdk-btn",{"title":1188,"links":1645,"subMenu":1654},[1646,1650],{"text":1647,"config":1648},"DevSecOps platform",{"href":1170,"dataGaName":1649,"dataGaLocation":1580},"devsecops platform",{"text":1651,"config":1652},"AI-Assisted Development",{"href":1177,"dataGaName":1653,"dataGaLocation":1580},"ai-assisted development",[1655],{"title":1656,"links":1657},"Topics",[1658,1663,1668,1673,1678,1683,1688,1693],{"text":1659,"config":1660},"CICD",{"href":1661,"dataGaName":1662,"dataGaLocation":1580},"/topics/ci-cd/","cicd",{"text":1664,"config":1665},"GitOps",{"href":1666,"dataGaName":1667,"dataGaLocation":1580},"/topics/gitops/","gitops",{"text":1669,"config":1670},"DevOps",{"href":1671,"dataGaName":1672,"dataGaLocation":1580},"/topics/devops/","devops",{"text":1674,"config":1675},"Version Control",{"href":1676,"dataGaName":1677,"dataGaLocation":1580},"/topics/version-control/","version control",{"text":1679,"config":1680},"DevSecOps",{"href":1681,"dataGaName":1682,"dataGaLocation":1580},"/topics/devsecops/","devsecops",{"text":1684,"config":1685},"Cloud Native",{"href":1686,"dataGaName":1687,"dataGaLocation":1580},"/topics/cloud-native/","cloud native",{"text":1689,"config":1690},"AI for Coding",{"href":1691,"dataGaName":1692,"dataGaLocation":1580},"/topics/devops/ai-for-coding/","ai for coding",{"text":1694,"config":1695},"Agentic AI",{"href":1696,"dataGaName":1697,"dataGaLocation":1580},"/topics/agentic-ai/","agentic ai",{"title":1699,"links":1700},"Solutions",[1701,1703,1705,1710,1714,1717,1721,1724,1726,1729,1732,1737],{"text":1232,"config":1702},{"href":1227,"dataGaName":1232,"dataGaLocation":1580},{"text":1221,"config":1704},{"href":1204,"dataGaName":1205,"dataGaLocation":1580},{"text":1706,"config":1707},"Agile development",{"href":1708,"dataGaName":1709,"dataGaLocation":1580},"/solutions/agile-delivery/","agile delivery",{"text":1711,"config":1712},"SCM",{"href":1217,"dataGaName":1713,"dataGaLocation":1580},"source code management",{"text":1659,"config":1715},{"href":1210,"dataGaName":1716,"dataGaLocation":1580},"continuous integration & delivery",{"text":1718,"config":1719},"Value stream management",{"href":1260,"dataGaName":1720,"dataGaLocation":1580},"value stream management",{"text":1664,"config":1722},{"href":1723,"dataGaName":1667,"dataGaLocation":1580},"/solutions/gitops/",{"text":1270,"config":1725},{"href":1273,"dataGaName":1274,"dataGaLocation":1580},{"text":1727,"config":1728},"Small business",{"href":1279,"dataGaName":1280,"dataGaLocation":1580},{"text":1730,"config":1731},"Public sector",{"href":1285,"dataGaName":1286,"dataGaLocation":1580},{"text":1733,"config":1734},"Education",{"href":1735,"dataGaName":1736,"dataGaLocation":1580},"/solutions/education/","education",{"text":1738,"config":1739},"Financial services",{"href":1740,"dataGaName":1741,"dataGaLocation":1580},"/solutions/finance/","financial services",{"title":1293,"links":1743},[1744,1746,1748,1750,1753,1755,1758,1760,1762,1764,1766,1768,1770,1772],{"text":1306,"config":1745},{"href":1308,"dataGaName":1309,"dataGaLocation":1580},{"text":1311,"config":1747},{"href":1313,"dataGaName":1314,"dataGaLocation":1580},{"text":1316,"config":1749},{"href":1318,"dataGaName":1319,"dataGaLocation":1580},{"text":1321,"config":1751},{"href":1323,"dataGaName":1752,"dataGaLocation":1580},"docs",{"text":1344,"config":1754},{"href":1346,"dataGaName":1347,"dataGaLocation":1580},{"text":1756,"config":1757},"What's new",{"href":1403,"dataGaName":1404,"dataGaLocation":1580},{"text":1339,"config":1759},{"href":1341,"dataGaName":1342,"dataGaLocation":1580},{"text":1358,"config":1761},{"href":1360,"dataGaName":1361,"dataGaLocation":1580},{"text":1366,"config":1763},{"href":1368,"dataGaName":1369,"dataGaLocation":1580},{"text":1371,"config":1765},{"href":1373,"dataGaName":1374,"dataGaLocation":1580},{"text":1376,"config":1767},{"href":1378,"dataGaName":1379,"dataGaLocation":1580},{"text":1381,"config":1769},{"href":1383,"dataGaName":1384,"dataGaLocation":1580},{"text":1386,"config":1771},{"href":1388,"dataGaName":1133,"dataGaLocation":1580},{"text":1390,"config":1773},{"href":1392,"dataGaName":1393,"dataGaLocation":1580},{"title":1406,"links":1775},[1776,1778,1780,1782,1784,1786,1790,1795,1797,1799,1801],{"text":1413,"config":1777},{"href":1415,"dataGaName":1100,"dataGaLocation":1580},{"text":1418,"config":1779},{"href":1420,"dataGaName":1421,"dataGaLocation":1580},{"text":1426,"config":1781},{"href":1428,"dataGaName":1429,"dataGaLocation":1580},{"text":1431,"config":1783},{"href":1433,"dataGaName":1434,"dataGaLocation":1580},{"text":1436,"config":1785},{"href":1438,"dataGaName":1439,"dataGaLocation":1580},{"text":1787,"config":1788},"Sustainability",{"href":1789,"dataGaName":1787,"dataGaLocation":1580},"/sustainability/",{"text":1791,"config":1792},"Diversity, inclusion and belonging (DIB)",{"href":1793,"dataGaName":1794,"dataGaLocation":1580},"/diversity-inclusion-belonging/","Diversity, inclusion and belonging",{"text":1441,"config":1796},{"href":1443,"dataGaName":1444,"dataGaLocation":1580},{"text":1451,"config":1798},{"href":1453,"dataGaName":1454,"dataGaLocation":1580},{"text":1456,"config":1800},{"href":1458,"dataGaName":1459,"dataGaLocation":1580},{"text":1802,"config":1803},"Modern Slavery Transparency Statement",{"href":1804,"dataGaName":1805,"dataGaLocation":1580},"https://handbook.gitlab.com/handbook/legal/modern-slavery-act-transparency-statement/","modern slavery transparency statement",{"items":1807},[1808,1811,1814],{"text":1809,"config":1810},"Terms",{"href":1632,"dataGaName":1633,"dataGaLocation":1580},{"text":1812,"config":1813},"Cookies",{"dataGaName":1642,"dataGaLocation":1580,"id":1643,"isOneTrustButton":151},{"text":1815,"config":1816},"Privacy",{"href":1637,"dataGaName":1638,"dataGaLocation":1580},[1818],{"id":1819,"title":7,"body":1104,"config":1820,"content":1822,"description":1104,"extension":1825,"meta":1826,"navigation":151,"path":1827,"seo":1828,"stem":1829,"__hash__":1830},"blogAuthors/en-us/blog/authors/filipa-lacerda.yml",{"template":1821},"BlogAuthor",{"name":7,"config":1823},{"headshot":141,"ctfId":1824},"filipa","yml",{},"/en-us/blog/authors/filipa-lacerda",{},"en-us/blog/authors/filipa-lacerda","PJOnqPRcISHrOS1QcKT87stWcDtc8CpBxLaJ95gzJ0Y",[1832,1840,1847],{"title":1833,"description":1834,"heroImage":1835,"category":1100,"date":1836,"authors":1837,"slug":1839,"externalUrl":1104},"Why GitLab signed the Open Weights and American AI Leadership letter","GitLab supports customer choice, data privacy, and AI model neutrality, empowering teams to run secure, cost-effective, local solutions.","https://res.cloudinary.com/about-gitlab-com/image/upload/v1785333264/ww4mlighwlvvzgnmbe6w.png","2026-07-29",[1838],"Bill Staples","open-weight-model-letter",{"title":1841,"description":1842,"heroImage":1843,"category":1100,"date":1844,"authors":1845,"slug":1846,"externalUrl":1104},"GitLab Act 2","A letter to our customers and our investors.","https://res.cloudinary.com/about-gitlab-com/image/upload/v1776362275/ozbwn9tk0dditpnfddlz.png","2026-05-11",[1838],"gitlab-act-2",{"title":1848,"description":1849,"heroImage":1850,"category":1100,"date":1851,"authors":1852,"slug":1854,"externalUrl":1104},"GitLab named a 2026 Omdia Universe Leader","Omdia's 2026 report on AI-assisted software development ranked 19 vendors. Here is what GitLab's top scores mean for engineering teams.","https://res.cloudinary.com/about-gitlab-com/image/upload/v1774465167/n5hlvrsrheadeccyr1oz.png","2026-04-13",[1853],"Rebecca Carter","gitlab-named-a-2026-omdia-universe-leader",{"promotions":1856},[1857,1871,1883,1895],{"id":1858,"categories":1859,"header":1861,"text":1862,"button":1863,"image":1868},"ai-modernization",[1860],"ai","Is AI achieving its promise at scale?","Quiz will take 5 minutes or less",{"text":1864,"config":1865},"Get your AI maturity score",{"href":1866,"dataGaName":1867,"dataGaLocation":1347},"/assessments/ai-modernization-assessment/","modernization assessment",{"config":1869},{"src":1870},"https://res.cloudinary.com/about-gitlab-com/image/upload/v1772138786/qix0m7kwnd8x2fh1zq49.png",{"id":1872,"categories":1873,"header":1875,"text":1862,"button":1876,"image":1880},"devops-modernization",[1874,1682],"product","Are you just managing tools or shipping innovation?",{"text":1877,"config":1878},"Get your DevOps maturity score",{"href":1879,"dataGaName":1867,"dataGaLocation":1347},"/assessments/devops-modernization-assessment/",{"config":1881},{"src":1882},"https://res.cloudinary.com/about-gitlab-com/image/upload/v1772138785/eg818fmakweyuznttgid.png",{"id":1884,"categories":1885,"header":1887,"text":1862,"button":1888,"image":1892},"security-modernization",[1886],"security","Are you trading speed for security?",{"text":1889,"config":1890},"Get your security maturity score",{"href":1891,"dataGaName":1867,"dataGaLocation":1347},"/assessments/security-modernization-assessment/",{"config":1893},{"src":1894},"https://res.cloudinary.com/about-gitlab-com/image/upload/v1772138786/p4pbqd9nnjejg5ds6mdk.png",{"id":1896,"paths":1897,"header":1900,"text":1901,"button":1902,"image":1907},"github-azure-migration",[1898,1899],"migration-from-azure-devops-to-gitlab","integrating-azure-devops-scm-and-gitlab","Is your team ready for GitHub's Azure move?","GitHub is already rebuilding around Azure. Find out what it means for you.",{"text":1903,"config":1904},"See how GitLab compares to GitHub",{"href":1905,"dataGaName":1906,"dataGaLocation":1347},"/compare/gitlab-vs-github/github-azure-migration/","github azure migration",{"config":1908},{"src":1882},{"header":1910,"blurb":1911,"button":1912,"secondaryButton":1917},"Start building faster today","See what your team can do with the intelligent orchestration platform for DevSecOps.\n",{"text":1913,"config":1914},"Get your free trial",{"href":1915,"dataGaName":1146,"dataGaLocation":1916},"https://gitlab.com/-/trial_registrations/new?glm_content=default-saas-trial&glm_source=about.gitlab.com/","feature",{"text":1618,"config":1918},{"href":1470,"dataGaName":1151,"dataGaLocation":1916},1786803733016]