8 ms·

Ok, so it looks like the main point of this is fast-components, which is a just a bunch of components styled as MS-style, but I'm more interested in the fast-fo

Ok, so it looks like the main point of this is fast-components, which is a just a bunch of components styled as MS-style, but I'm more interested in the fast-foundation package. According to the instructions: > The exports of this package can generally be thought of as un-styled base components that implement semantic and accessible markup and behavior. > it exports parts and pieces intended to be composed into Web Components, allowing you to implement your own design language by simply applying CSS styles and behaviors without having to write all the JavaScript that's involved in building production-quality component implementations. Which means... if I want to make my own components, I can just take this package and don't worry about making broken components. Since the core HTML/JS is properly taken care (by MS, hopefully) I can less worry about re-implementing keyboard access, or things like accessibility which is hard to do properly. This is IMO huge, and should be more universal.

RubenvanE 6y ago
The foundation package sounds a lot like the Lion components that ING Bank open sourced last year. It is indeed super handy to not have to worry about all the browser compatibility and accessibility issues!
- spankalee 6y ago
  Link to Lion's storybook demos for those interested: https://lion-web-components.netlify.app/?path=/story/intro-lion-web-components--page https://lion-web-components.netlify.app/?path=/story/intro-l...
  - Arkdy 6y ago
    Any idea how FAST compares to using storybook directly? ( https://storybook.js.org/ https://storybook.js.org/ )
    - spankalee 6y ago
      Fast is a set of components (and a base class). Storybook is a way to demo components.
ramon 6y ago
Lit has been doing this for a while it's from that Polymer project. https://lit-element.polymer-project.org/ https://lit-element.polymer-project.org/ Web Components is a huge deal, you can do just web components on plain notepad and not need any build system for something very simple just using module based packages on the browser this is really cool. Snowpack for me was something huge, getting away from webpack was like getting back hours of work. But I don't know, till now for me I still see the Lit-Element and stuff as being more flexible than this one, the beauty is for example you can have a component in react and another on in Vue, it doesn't really matter and another one in JQuery. You can have whatever works best for you for each case.
parksy 6y ago
edit - to thank everyone who took time out to explain what's going on - I'm still cynical but it all makes more sense now. I also like to think the ignorant guy asking the ignorant questions (in this case me) can sometimes be valuable for others who aren't in the club. Previous rant intact below for fun and hijinks. --- As a jaded old web developer I've seen so many frameworks along the way all promising this and that. Can someone who is familiar with this answer me this: Does this framework automatically sort out ARIA standards for me? Like tab ordering and stuff is dealt with automatically? I know it seems I am being lazy but I am just fed up. "FAST is a collection of JavaScript packages centered around web standards, designed to help you efficiently tackle some of the most common challenges in website and application design and development." COOL! (/s) "Have you ever needed a reusable set of UI components that you could drop into your app and have an amazing experience? That's FAST." UNIQUE! (/s) "Have you ever needed to create your own components, and share them across your company, including across groups that use different, incompatible front-end frameworks? That's FAST." <record scratch> Different, incompatible front-end frameworks? So like, this shit is magic that will let me streamline components between my Oceania team's WordPress and my German team's Magento frontends? And I don't have to learn any new paradigm to make this work? I don't have to use their specific, custom HTML in order to leverage it? https://www.fast.design/docs/components/accordion https://www.fast.design/docs/components/accordion SWEET! (/s) Come on. We'd have to re-write everything to use this library specifically, and train our teams. Honestly this is to me just another bunch of shit that will get tacked into projects and have to be known and supported, because some sprightly young thing will convince management this is the panacea to seemingly redundant development work. What's the actual selling point here.
- spankalee 6y ago
  > Come on. We'd have to re-write everything to use this library specifically That is not how web components work. Web components are just HTML elements, so any framework that can use HTML can use web components. That's what sharing across different, incompatible frameworks means.
  - parksy 6y ago
    I honestly don't understand what this definition of "frameworks" means in this exact context and I've been building websites since 1994, survived the XHTML collapse, etc etc... What's the main advantage here? That we have a standardised way of writing HTML markup so that CSS / JS knows how to operate on it? I'm almost certainly coming across as "old man yells at cloud" (lol just realised a pun there) but what would you say is the best resource for me to go and upskill so I can see the actual value in this for me and / or my teams in the future?
ourmandave 6y ago
MS had this back in 2006 with CSS Friendly Control Adapters for asp.net. https://docs.microsoft.com/en-us/aspnet/web-forms/videos/how-do-i/how-do-i-utilize-the-css-friendly-control-adapters https://docs.microsoft.com/en-us/aspnet/web-forms/videos/how...
CuddleBunny 6y ago
fast-foundation and fast-element are the main point of this. The components are mostly just a showcase. Though the MS-style set of components (https://www.npmjs.com/package/@fluentui/web-components https://www.npmjs.com/package/@fluentui/web-components) leveraging FAST will probably end up one of the most consumed products.

RubenvanE 6y ago

The foundation package sounds a lot like the Lion components that ING Bank open sourced last year. It is indeed super handy to not have to worry about all the browser compatibility and accessibility issues!

spankalee 6y ago
Link to Lion's storybook demos for those interested: https://lion-web-components.netlify.app/?path=/story/intro-lion-web-components--page https://lion-web-components.netlify.app/?path=/story/intro-l...
- Arkdy 6y ago
  Any idea how FAST compares to using storybook directly? ( https://storybook.js.org/ https://storybook.js.org/ )
  - spankalee 6y ago
    Fast is a set of components (and a base class). Storybook is a way to demo components.

ramon 6y ago

Lit has been doing this for a while it's from that Polymer project. https://lit-element.polymer-project.org/ https://lit-element.polymer-project.org/ Web Components is a huge deal, you can do just web components on plain notepad and not need any build system for something very simple just using module based packages on the browser this is really cool. Snowpack for me was something huge, getting away from webpack was like getting back hours of work. But I don't know, till now for me I still see the Lit-Element and stuff as being more flexible than this one, the beauty is for example you can have a component in react and another on in Vue, it doesn't really matter and another one in JQuery. You can have whatever works best for you for each case.

parksy 6y ago

edit - to thank everyone who took time out to explain what's going on - I'm still cynical but it all makes more sense now. I also like to think the ignorant guy asking the ignorant questions (in this case me) can sometimes be valuable for others who aren't in the club. Previous rant intact below for fun and hijinks. --- As a jaded old web developer I've seen so many frameworks along the way all promising this and that. Can someone who is familiar with this answer me this: Does this framework automatically sort out ARIA standards for me? Like tab ordering and stuff is dealt with automatically? I know it seems I am being lazy but I am just fed up. "FAST is a collection of JavaScript packages centered around web standards, designed to help you efficiently tackle some of the most common challenges in website and application design and development." COOL! (/s) "Have you ever needed a reusable set of UI components that you could drop into your app and have an amazing experience? That's FAST." UNIQUE! (/s) "Have you ever needed to create your own components, and share them across your company, including across groups that use different, incompatible front-end frameworks? That's FAST." <record scratch> Different, incompatible front-end frameworks? So like, this shit is magic that will let me streamline components between my Oceania team's WordPress and my German team's Magento frontends? And I don't have to learn any new paradigm to make this work? I don't have to use their specific, custom HTML in order to leverage it? https://www.fast.design/docs/components/accordion https://www.fast.design/docs/components/accordion SWEET! (/s) Come on. We'd have to re-write everything to use this library specifically, and train our teams. Honestly this is to me just another bunch of shit that will get tacked into projects and have to be known and supported, because some sprightly young thing will convince management this is the panacea to seemingly redundant development work. What's the actual selling point here.

spankalee 6y ago
> Come on. We'd have to re-write everything to use this library specifically That is not how web components work. Web components are just HTML elements, so any framework that can use HTML can use web components. That's what sharing across different, incompatible frameworks means.
- parksy 6y ago
  I honestly don't understand what this definition of "frameworks" means in this exact context and I've been building websites since 1994, survived the XHTML collapse, etc etc... What's the main advantage here? That we have a standardised way of writing HTML markup so that CSS / JS knows how to operate on it? I'm almost certainly coming across as "old man yells at cloud" (lol just realised a pun there) but what would you say is the best resource for me to go and upskill so I can see the actual value in this for me and / or my teams in the future?

ourmandave 6y ago

MS had this back in 2006 with CSS Friendly Control Adapters for asp.net. https://docs.microsoft.com/en-us/aspnet/web-forms/videos/how-do-i/how-do-i-utilize-the-css-friendly-control-adapters https://docs.microsoft.com/en-us/aspnet/web-forms/videos/how...

CuddleBunny 6y ago

fast-foundation and fast-element are the main point of this. The components are mostly just a showcase. Though the MS-style set of components (https://www.npmjs.com/package/@fluentui/web-components https://www.npmjs.com/package/@fluentui/web-components) leveraging FAST will probably end up one of the most consumed products.