[{"data":1,"prerenderedAt":372},["ShallowReactive",2],{"project-41425150":3},{"id":4,"name":5,"line":6,"line_source":7,"title":8,"url":9,"domain":10,"maker":11,"posted_at":12,"year":13,"points":14,"comments":15,"rank_in_year":16,"shown_in_year":17,"top":18,"tier":19,"category":20,"subcategory":21,"format":22,"keywords":23,"reception":28,"sentiment":29,"stance_mix":30,"scored_comments":34,"aspects":35,"strip":45,"post_text":47,"what":48,"said":85,"maker_in_thread":170,"shape":176,"grid":180,"attempts":334,"same_week":335,"maker_shows":44,"maker_hidden":365,"reader_version":366,"card":367},"41425150","Gov.uk Vue","A Vue Component Library for the Gov.uk Design System","title","Show HN: Gov.uk Vue, a Vue Component Library for the Gov.uk Design System","https:\u002F\u002Fgovukvue.org\u002F","govukvue.org","matteason",1725282945,2024,223,58,343,3515,10,"notable","languages","ui component library","library",[24,25,26,27],"vue","gov.uk design system","accessible components","vue component library","debated",0,{"positive":31,"neutral":32,"mixed":29,"critical":33},6,9,5,20,{"docs":36,"design":37,"idea":39,"performance":41,"execution":42,"privacy":43},{"positive":29,"critical":29},{"positive":38,"critical":29},2,{"positive":38,"critical":40},1,{"positive":29,"critical":29},{"positive":29,"critical":29},{"positive":29,"critical":44},4,[29,29,29,29,29,29,29,29,33,29,33,33,29,29,46,33,29,29,33,29,29,29,46,46,46,29,46,40,40,29,40,33,29,40,29,29,29,29,29,46],3,"Hi HN,\n\nI've built a Vue component library based on the GOV.UK Design System, which is used for government services in the UK. The Design System is well-known for being accessible, well designed and thoroughly researched, and it's been used as the basis for many other governments' and organisations' design systems.\n\nGOV.UK Vue includes every component in the GOV.UK Design System, with comprehensive docs. It can also be used for projects that aren't related to GOV.UK, as long as they don't use the GOV.UK branding",{"problem":49,"audience":55,"pricing":67,"motivation":67,"time_to_build":67,"stack":68,"openness":83,"stage":84,"team_size":83},{"value":50,"source":51,"evidence":52},"Lets Vue projects use the GOV.UK Design System components","maker",[53],{"id":54},"post",{"value":56,"source":51,"evidence":57},"Developers building interactive services, internal tools, dashboards or mapping with Vue",[58,61,64],{"id":59,"by":11,"text":60},"41427101","One example is the RNIB (Blindness and sight loss charity in the UK) - they use various bits of GOV.UK Frontend on their website, such as the breadcrumbs and accordion on [0].…",{"id":62,"by":11,"text":63},"41432208","Exactly - services on GOV.UK are developed by teams across government (as well as agencies etc), and they're (mostly) free to use whatever tech makes sense for the team and the…",{"id":65,"by":11,"text":66},"41433895","Haha, hi AL! Yeah the target for this definitely isn't the regular transactional GOV.UK services. I've added a note at the top of the installation guide: > GOV.UK Vue (or any…",null,[69,73,77],{"value":70,"source":51,"evidence":71},"Vue",[72],{"id":54},{"value":74,"source":51,"evidence":75},"Nuxt (docs site)",[76],{"id":65,"by":11,"text":66},{"value":78,"source":51,"evidence":79},"GOV.UK Frontend (styling)",[80],{"id":81,"by":11,"text":82},"41432149","GOV.UK Vue doesn't provide any of the Frontend styling directly, it's up to the consuming project to include it. I've done that so that you can add Vue to server-rendered…","unknown","launched",{"praise":86,"objections":99,"requests":122,"questions":130,"alternatives":145},[87,95],{"value":88,"source":89,"evidence":90},"Accessible and well designed components","commenter",[91],{"id":92,"by":93,"text":94},"41427025","denysvitali","This is impressively good - I admit that without looking at the URL I felt like visiting an official gov.uk website. Now, as someone else mentioned this might be a bit deceiving,…",{"value":96,"source":51,"evidence":97},"Useful for projects needing high accessibility",[98],{"id":59,"by":11,"text":60},[100,111],{"value":101,"source":89,"evidence":102},"Could be used to impersonate government services",[103,107],{"id":104,"by":105,"text":106},"41426706","NtG_UK","Impressive, but haven’t we just handed crooks the perfect tool for crafting their next GOV.UK themed phishing site?",{"id":108,"by":109,"text":110},"41435803","midenginedcoupe","A friendly word of warning - I also re-implemented the GOV.UK design system for my form builder SaaS and stood up a demo form showing off the components in a real multi-step…",{"value":112,"source":89,"evidence":113},"Unofficial use of GOV.UK name may confuse users",[114,118],{"id":115,"by":116,"text":117},"41429762","pimlottc","This is cool but I think you should be crystal clear that this is not an official gov.uk project. Like, put the word \"unofficial\" in the header, project description, etc.",{"id":119,"by":120,"text":121},"41426893","baliex","This is impressive Matt, and I love the design system GDS has developed, but I'm not sure they want non-government services to use the system. From the second link you posted: >…",[123],{"value":124,"source":89,"evidence":125},"Cross-framework web components",[126],{"id":127,"by":128,"text":129},"41430813","spankalee","It'd be really great if these were cross-framework compatible web components.",[131,138],{"value":132,"source":89,"evidence":133},"Does it keep up with GDS Frontend updates?",[134],{"id":135,"by":136,"text":137},"41432091","stuaxo","Do you generate the updates for this when GDS frontend updates? I think that's how the GDS django support stays up to date, otherwise it will be hard to keep up.",{"value":139,"source":89,"evidence":140},"Is SSR supported and does it work with progressive enhancement?",[141],{"id":142,"by":143,"text":144},"41433731","alphalima","Hey Matt, Super cool to see this, and congrats on 1.0! One question, has the GDS stance on Javascript softened, namely progressive enhancement being essentially mandatory [1],…",[146,152,159],{"value":147,"source":89,"evidence":148},"GOV.UK Frontend direct use",[149],{"id":150,"by":11,"text":151},"41426746","GOV.UK Frontend is already fully open source [0] with comprehensive documentation [1] and GDS encourage community contributions, libraries and resources [2]. If there was any…",{"value":153,"source":89,"evidence":154},"PrimeVue",[155],{"id":156,"by":157,"text":158},"41436617","KronisLV","I like this, feels very usable and not too visually noisy! For the most part, the most feature complete component library I've found for Vue is PrimeVue https:\u002F\u002Fprimevue.org\u002F…",{"value":160,"source":89,"evidence":161},"French and Czech government design systems",[162,166],{"id":163,"by":164,"text":165},"41427764","manuelleduc","Very interesting. France government is providing a design system as well https:\u002F\u002Fwww.systeme-de-design.gouv.fr\u002F A Vue impementation is available too https:\u002F\u002Fvue-ds.fr\u002F",{"id":167,"by":168,"text":169},"41431783","Tajnymag","Czech eGovernment has a similar component library with support for pure HTML, React, Vue and Angular. link: https:\u002F\u002Fdesignsystem.gov.cz\u002F",{"comments":171,"answered":33,"key":172},8,[173,174,175],{"id":59,"text":60},{"id":62,"text":63},{"id":65,"text":66},{"commenters":177,"max_depth":33,"maker_replies":171,"first_comment_mins":178,"lifespan_hours":179},42,187,45,[181,185,188,191,194,197,200,204,206,209,212,214,216,218,220,223,226,230,231,232,235,236,237,240,242,245,248,249,254,257,259,261,265,268,273,275,278,280,283,284,287,290,292,293,295,297,299,302,304,307,310,313,315,318,321,324,327,331],[182,29,29,183,184,29],"41428211","other\u002Fneutral\u002Fnone","rmason",[186,29,29,183,187,29],"41429665","scrlk",[189,29,29,183,190,29],"41430834","jen20",[192,29,29,183,193,29],"41434927","gm3dmo",[195,29,29,183,196,29],"41431292","beart",[198,29,29,183,199,29],"41433409","NoboruWataya",[201,29,29,202,203,29],"41433422","commenter\u002Fneutral\u002Fnone","butterknife",[205,29,29,202,199,29],"41433516",[207,29,29,202,208,29],"41434181","julkali",[210,29,29,183,211,29],"41444083","jonp888",[213,29,29,183,193,29],"41434885",[115,40,46,215,116,29],"project\u002Fneutral\u002Fdocs",[92,38,33,217,93,29],"project\u002Fpositive\u002Fdesign",[59,38,29,219,11,40],"project\u002Fneutral\u002Fnone",[221,38,33,222,93,29],"41427140","maker\u002Fpositive\u002Fnone",[224,38,33,222,225,29],"41427272","pglevy",[227,38,46,228,229,29],"41432137","project\u002Fneutral\u002Fidea","alias_neo",[62,38,29,228,11,40],[163,46,29,183,164,29],[233,46,29,183,234,29],"41435471","com",[142,44,46,228,143,29],[65,44,29,219,11,40],[238,44,33,239,143,29],"41436353","project\u002Fpositive\u002Fidea",[241,44,29,183,109,29],"41435717",[243,33,29,183,244,29],"41428623","pcrh",[246,33,29,183,247,29],"41429204","epolanski",[156,31,33,217,157,29],[250,251,29,252,253,29],"41428460",7,"other\u002Fpositive\u002Fnone","vegancap",[255,171,29,183,256,29],"41433749","smackay",[258,171,29,183,11,40],"41433945",[260,171,29,183,256,29],"41434178",[262,32,46,263,264,29],"41428139","project\u002Fneutral\u002Fperformance","londons_explore",[266,18,29,183,267,29],"41427620","nemesis17",[269,270,46,271,272,29],"41436812",11,"project\u002Fneutral\u002Fdesign","divbzero",[127,274,46,228,128,29],12,[276,274,29,183,277,29],"41430873","langcss",[167,279,29,183,168,29],13,[135,281,46,282,136,29],14,"project\u002Fneutral\u002Fexecution",[81,281,29,282,11,40],[108,285,40,286,109,29],15,"project\u002Fcritical\u002Fprivacy",[288,285,29,289,11,40],"41435865","project\u002Fneutral\u002Fprivacy",[104,291,40,286,105,29],16,[150,291,29,289,11,40],[119,291,40,294,120,29],"project\u002Fcritical\u002Fidea",[296,291,29,228,11,40],"41426955",[298,291,33,239,120,29],"41426991",[300,291,29,202,301,29],"41427505","esquivalience",[303,291,40,286,264,29],"41428131",[305,291,40,286,306,29],"41426779","unsupp0rted",[308,291,29,183,309,29],"41426963","tialaramex",[311,291,29,183,312,29],"41427415","mananaysiempre",[314,291,29,183,309,29],"41428251",[316,291,29,183,317,29],"41436785","seabass-labrax",[319,291,29,183,320,29],"41426866","dotancohen",[322,291,29,183,323,29],"41426928","globular-toast",[325,291,29,183,326,29],"41428668","samstave",[328,329,46,271,330,29],"41431494",17,"ggm",[332,329,46,271,333,29],"41435476","gherard5555",[],[336,341,346,350,355,360],{"id":337,"name":338,"points":339,"category":340},"41416714","Linkpreview",362,"dev_tools",{"id":342,"name":343,"points":344,"category":345},"41444855","tetris-sql",338,"games",{"id":347,"name":348,"points":349,"category":345},"41424371","Defrag the Game",326,{"id":351,"name":352,"points":353,"category":354},"41448439","AlphaFold3",314,"ai",{"id":356,"name":357,"points":358,"category":359},"41389176","solar concentrator",296,"hardware",{"id":361,"name":362,"points":363,"category":364},"41424954","Broadcast Box",283,"infrastructure",false,"v2",{"id":368,"name":5,"line":6,"ai":365,"cat":20,"year":13,"points":14,"comments":15,"rec":28,"s":29,"top":18,"kw":369,"maker":11,"domain":10,"tier":19,"attempts":29,"strip":370,"url":9,"mix":371,"praise":88,"objection":101,"sub":21},41425150,[24,25,26,27],"0000000050550035005000333031101501000003",[31,32,29,33],1793991099298]