Elc-ui-project NPM

Repository: https://bitbucket.org/mindstixlabs/elc-ui-library/src/development/

Setup

Install Dependencies:
```
$ npm run install:dev
```
Launch the demo app:
```
$ npm run demo
```

Folder Structure

Library: /src/library/src/
- Contains all the files related to the ui-library.
Demo: /src/demo/src/
- Contains all the files related to the demo-app.

UI Component Development

For a component library, we do not need any html file or App.js
But we need them in order to develop an ui component.
For that we need to launch and test the component under development

Steps to launch ui-library

Create a public/ folder inside the library/ folder.
Create a file named 'index.html' inside the public/ folder.

Add the following inside the index.html file:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Test App</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
  </body>
</html>

Create a 'App.js' file inside the /library/src/ folder

Add the following inside the App.js file:

import React from 'react';
function App() {
  return <div></div>;
}
export default App;

Now, create a index.js file inside the /library/src/ folder

Add the following to the index.js file:

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root'),
);

Done. Navigate to the root folder and run:
```
$ npm run lib:dev
```
These files that we just created are already added to the '.gitignore' file.
Note: Do not commit these files.

@infinitebrahmanuniverse/nolb-elc @everything-registry/sub-chunk-1563

0.0.3

4 years ago

0.0.2

4 years ago