question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Provide instructions on how to use Grommet without its accompanying development stack (grommet-toolbox)

See original GitHub issue

The documentation for someone who wants to integrate Grommet into an existing project is currently kind of lacking as evidenced by #632. Perhaps there needs to be more focus in the docs for something simpler, maybe along the lines of:

  1. First, install Grommet from NPM into your project: npm install --save grommet

  2. Wrap your entire app inside the <App> component:

    import App from 'grommet/components/App';
    
    const Layout = () => (
    <App>
    <MyAppHere />
    </App>
    );
    
  3. Finally, simply import the component you need and use it right away.

    import LoginForm from 'grommet/components/LoginForm';
    
    const Component = () => (
    <div>
      <LoginForm onSubmit={console.log('login clicked')} />
    </div>
    );
    

Also, maybe it would be a good idea to give the user an option that does not require wrapping the entire app inside the <App> component. I always found that to be a little bit weird, because it requires you to completely buy into the Grommet way of doing things. I think a more gradual or softer approach can win over more users.

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:3
  • Comments:7 (5 by maintainers)

github_iconTop GitHub Comments

4reactions
digital-flowerscommented, Aug 2, 2016

i have managed to successfully run grommet as a library with webpack for development and production also register grommet components as web components using reactive elements library where you can use grommet directly inside the html or template engine such as ejs or jade this will improve SEO and make the application easier to maintain, soon i will write full documentation on how to do that

2reactions
alansouzaticommented, Jul 6, 2016

sure thing. let me address that in the docs as well.

Read more comments on GitHub >

github_iconTop Results From Across the Web

INSTALL EYELETS vs GROMMETS IN FABRIC - YouTube
What is the difference between eyelets and grommets you ask? How do you install eyelets or grommets ? What type of fabrics to...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found