Egov-UI-framework to create a new project and use it.

OVERVIEW

Documentation of  eGovernment Project, how to clone, how to add a new module, how to run separate modules

Steps to Clone the project:

1)Go to the provided project Github link(https://github.com/egovernments/frontend).

Note - Always use the latest branch to clone (eg - release-feb-24).

Screenshot - 1

2). Copy the URL link and open your GitHub desktop app, open the File icon, and select the clone repository option. In that go to URL stepper and paste the GitHub link and set the local path where you want to store your project and then click on the clone button.

Screenshot - 2



3). One’s the Cloning is done go to the current branch option and switch the new release branch.

Screenshot - 3

4). Github desktop will provide the IDE which you installed on your system on clicking that IDE it will navigate to your project.

Screenshot - 4

 

5). Click on the show in explorer option  so we can easily see the path of the project  in our system

Steps to run the project in Development:

First-time users should install Lerna and yarn as a global dependency, below is the command and link.

https://github.com/lerna/lerna

Note: Node should be above version 8.

npm install --global lerna
npm install -g yarn

Steps for development:

1). Step 1 - Go command will transpile all the dependent modules from /dev-packages to /packages and link them to the respective packages in the repo. It will also take care of installing all the required npm packages inside each module including citizen and employee.

yarn run go

2). Step 2 - if you want to run citizen

Or

2). Step 2 - if you want to run employee

Steps to add a new module to the employee:

1). Copy the egov-boilerplate-dev and paste into web/rainmaker/dev-packages and rename as egov-wms-dev.

2). Go to egov-wms/package.json update the name by egov-wms-dev.

Screenshot - 5

and with that go to egov-wms/src/package.json update the name by egov-wms.

Screenshot - 6

3). Got to egov-wms/src/ui-config/routes/route-name update the REDIRECT path

from

to

Screenshot - 7

4). Go to egov-wms/src/ui-views/Playground and update the import statement 

From

To

Screenshot - 8

 

5). Go to web/rainmaker/package.json update this transpile-common-modules command by appending new values(egov-wms).

Screenshot - 9

From

To

6). Add the new below script for the new module

Screenshot - 10

7). Here we are using SCSS file as CSS files in packages/employee and packages/citizen for that we need to install CSS files so update the build-css-common command by appending new values(build-css-egov-wns).

Note - Current react CRA will not support SCSS files so that we need to use a third-party library to convert it.

Screenshot - 11

 

From

To

6). Add new CSS command

Screenshot - 12

7). If we want to use egov-wms package inside our employee module then we need to add inside our employee module package.json :go to web/rainmaker/packages/employee/package.json update package.json by adding a new command :

Screenshot - 13

8). After completing the above steps now we have to add a switch case inside web/rainmaker/packages/employee/src/ui-config/commonConfig/remote-config-path.

ex:

Screenshot - 14

9). Add remote component configuration to the employee.

Screenshot - 15

 

10). We have to tell lerna to register the new module, updating lerna.json.

 

11). After this do below to update the new module in an employee.

12). Run the employee project by using then go to the link below and check the module is updated or not. If in case the module has not to update check all the above steps are covered or not.

URL:http://localhost:3006/egov-wns/login;

13). Do the same steps for the citizen to reflect the new module in citizen.