patternfly-elements icon indicating copy to clipboard operation
patternfly-elements copied to clipboard

docs: improve get started

Open bennypowers opened this issue 11 months ago • 0 comments

@tkitslaar writes:

Firstly I would emphasize installing then making sure users know to also include the import statements...using the get started page for example, the currently layout/wording doesn't make it clear that you should do the npm install first then the import options, as the wording says it will install pf-card or whatever element you're using via npm, so it kinda comes across as an either or. That's a pretty easy fix of just making the docs more process oriented. This is probably pretty obvious if you've done a lot of web component work but my impression using other systems was that each do it a little bit differently, some only use import statements and not npm, etc, so I tended to follow the laid out process pretty closely.

Secondly and maybe more importantly, the usage instructions for each component completely omit the import statements, which without them the component wont work. So under usage on each component page I would add the proper import statement for each component i.e. import '@patternfly/elements/pf-card/pf-card.js'; or whatever, with each component having the proper relevant import statement specific to its component so users can easily copy paste and get up and running with whatever component is being used. The other related issue here is it leaves the user to guess and figure out what the right import statement is just based on the one example given on the getting started page, i.e. import '@patternfly/pfe-tabs/dist/pfe-tabs.min.js'; for V1 pfe-tabs based off of the example of import '@patternfly/pfe-card/dist/pfe-card.min.js'; given in the getting started section, which I could imagine getting tedious if you're using a lot of different components.

bennypowers avatar Jul 09 '23 11:07 bennypowers