Differences
This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
tutorial:dev:creating_a_development_environment [2018/07/13 12:05] kopro [5. Frontend development environment] |
tutorial:dev:creating_a_development_environment [2024/01/09 08:25] koulaj |
||
---|---|---|---|
Line 1: | Line 1: | ||
+ | ====== Creating a development environment ====== | ||
+ | |||
+ | This text is intended as a tutorial for CzechIdM developers with the goal to set up IDE, build CzechIdM in it and run the system. If you prefer quick glance at the code or need to start quickly, you can use [[.: | ||
+ | |||
+ | ====== 1. Install Java and Maven ====== | ||
+ | |||
+ | First install JDK and Maven: | ||
+ | |||
+ | Download and install Java 11 OpenJDK (Java 21 OpenJDK for CzechIdM 13.1.0+). | ||
+ | |||
+ | Install Maven from your system packages, at least version 3.1 is required. | ||
+ | |||
+ | <code bash> | ||
+ | yum install maven | ||
+ | mvn -v | ||
+ | |||
+ | </ | ||
+ | |||
+ | Note: If you installed Java separately from your system libraries, you should set the correct Java home for Maven in the file " | ||
+ | < | ||
+ | |||
+ | export JAVA_HOME=/ | ||
+ | |||
+ | </ | ||
+ | |||
+ | This way Maven will always use this JDK. | ||
+ | |||
+ | ====== 2. Download the source code ====== | ||
+ | |||
+ | Download CzechIdM source code from GitHub: | ||
+ | |||
+ | <code bash> | ||
+ | git clone https:// | ||
+ | |||
+ | </ | ||
+ | |||
+ | Check branch: | ||
+ | |||
+ | <code bash> | ||
+ | git branch | ||
+ | |||
+ | </ | ||
+ | |||
+ | The development is always done on the branch " | ||
+ | |||
+ | <code bash> | ||
+ | git checkout -b develop origin/ | ||
+ | |||
+ | </ | ||
+ | |||
+ | To develop your own feature or fix a bug create new branch from develop | ||
+ | |||
+ | <code bash> | ||
+ | git checkout -b personal/ | ||
+ | |||
+ | </ | ||
+ | |||
+ | Create pull request to merge your branch to develop branch. | ||
+ | |||
+ | ====== 3. Install PostgreSQL ====== | ||
+ | |||
+ | CzechIdM in " | ||
+ | |||
+ | Install necessary packages: | ||
+ | |||
+ | <code bash> | ||
+ | yum install postgresql postgresql-server postgresql-init | ||
+ | |||
+ | </ | ||
+ | |||
+ | Fedora 25 packages: | ||
+ | |||
+ | <code bash> | ||
+ | dnf install postgresql-server postgresql-contrib | ||
+ | |||
+ | </ | ||
+ | |||
+ | Ubuntu 22.04 LTS packages: | ||
+ | |||
+ | <code bash> | ||
+ | apt install postgresql postgresql-contrib | ||
+ | |||
+ | </ | ||
+ | |||
+ | First run of the service: | ||
+ | |||
+ | <code bash> | ||
+ | systemctl start postgresql.service | ||
+ | |||
+ | </ | ||
+ | |||
+ | If the following error occurs: "Job for postgresql.service failed. See ' | ||
+ | |||
+ | <code bash> | ||
+ | postgresql-setup --initdb --unit postgresql | ||
+ | |||
+ | </ | ||
+ | |||
+ | Set automatic start of the service when starting OS: | ||
+ | |||
+ | <code bash> | ||
+ | systemctl enable postgresql.service | ||
+ | |||
+ | </ | ||
+ | |||
+ | Set the configuration file for the database to accept login and password (change METHOD from ident to md5) | ||
+ | |||
+ | < | ||
+ | vim / | ||
+ | |||
+ | in Ubuntu it is: | ||
+ | vim / | ||
+ | |||
+ | in Windows it is: | ||
+ | < | ||
+ | |||
+ | # TYPE DATABASE | ||
+ | |||
+ | # " | ||
+ | local all | ||
+ | # IPv4 local connections: | ||
+ | host | ||
+ | # IPv6 local connections: | ||
+ | host | ||
+ | |||
+ | </ | ||
+ | |||
+ | Restart the service to load the changes: | ||
+ | |||
+ | < | ||
+ | systemctl restart postgresql.service | ||
+ | |||
+ | </ | ||
+ | |||
+ | Create the database with name: | ||
+ | |||
+ | * Version 10 - bcv\_idm\_10 | ||
+ | * Below version 10 - bcv\_idm\_storage | ||
+ | * (Make sure you have installed and allowed en_US locale in your OS) | ||
+ | |||
+ | < | ||
+ | su postgres -c psql postgres | ||
+ | CREATE USER idmadmin PASSWORD ' | ||
+ | CREATE DATABASE " | ||
+ | |||
+ | </ | ||
+ | |||
+ | ====== 4. Backend development environment ====== | ||
+ | |||
+ | The tutorial is different for each IDE. Select one and continue with a certain tutorial below: | ||
+ | |||
+ | * [[: | ||
+ | * [[: | ||
+ | |||
+ | In the IDE start the Tomcat server with CzechIdM deployed. | ||
+ | |||
+ | In browser access [[http:// | ||
+ | |||
+ | > CzechIdM API is running | ||
+ | |||
+ | ====== 5. Frontend development environment ====== | ||
+ | |||
+ | <note important> | ||
+ | |||
+ | ===== Select IDE for frontend environment ===== | ||
+ | |||
+ | You can use any text editor or JavaScript IDE. We recommend to use ATOM | ||
+ | |||
+ | * See [[: | ||
+ | |||
+ | ====== 6. Run backend and frontend together ====== | ||
+ | |||
+ | Assume running backend from the previous steps. | ||
+ | |||
+ | In the project root folder: | ||
+ | |||
+ | Start frontend | ||
+ | |||
+ | <code bash> | ||
+ | cd CzechIdM/ | ||
+ | gulp | ||
+ | |||
+ | </ | ||
+ | |||
+ | A new browser window or tab will open with [[https:// | ||
+ | |||
+ | The frontend is fully started after you see in following line in log: | ||
+ | |||
+ | <code bash> | ||
+ | [BS] 1 file changed (app.js) | ||
+ | |||
+ | </ | ||
+ | |||
+ | After the application is running, log in: | ||
+ | |||
+ | * username: admin | ||
+ | * password: admin | ||
+ | |||
+ | <note tip>If the app shows error with permission, log out</ | ||
+ | |||
+ | Congratulations! Your CzechIdM development environment is ready to use. | ||
+ | |||
+ | ====== Common development errors & tips ====== | ||
+ | |||
+ | ===== Tomcat server fails to start ===== | ||
+ | |||
+ | If Tomcat server fails to start, try following: | ||
+ | |||
+ | * Increase the timeout for Tomcat server Start (see [[: | ||
+ | * Check that PostgreSQL server is running. | ||
+ | |||
+ | <code bash> | ||
+ | systemctl status postgresql.service | ||
+ | |||
+ | </ | ||
+ | |||
+ | * Check that PostgreSQL database exists and the user can connect: Use the credentials filled in '' | ||
+ | < | ||
+ | |||
+ | spring.datasource.url=jdbc: | ||
+ | spring.datasource.username=idmadmin | ||
+ | spring.datasource.password=idmadmin | ||
+ | |||
+ | </ | ||
+ | |||
+ | use the following command and type the password when asked for it. | ||
+ | |||
+ | <code bash> | ||
+ | psql -h 127.0.0.1 -U idmadmin bcv_idm_storage | ||
+ | |||
+ | </ | ||
+ | |||
+ | * Check that you can read from the tables of the database. As in the previous point, connect to the PostgreSQL database and try to select data from any of the IdM tables. If you have insufficient access rights, check the owner and grants for the schema " | ||
+ | * Check the error message in the server output console. | ||
+ | |||
+ | ==== Common error messages ==== | ||
+ | |||
+ | '' | ||
+ | |||
+ | '' | ||
+ | < | ||
+ | |||
+ | Offenders: | ||
+ | -> ... idm-core-impl-7.7.0-SNAPSHOT.jar!/ | ||
+ | -> ... idm-core-impl-7.7.0-SNAPSHOT.jar!/ | ||
+ | |||
+ | </ | ||
+ | |||
+ | Just increase the version in the name of one of the scripts, clean & build the project again. | ||
+ | |||
+ | === Could not create Vfs.Dir from url === | ||
+ | |||
+ | **This isn't error just warning**. You may don't interest about this warning. Warning is only when you start local development environment and you configuration for ic connectors path isn't correctly setup. Dont worry about this warning. | ||
+ | |||
+ | < | ||
+ | 2019-07-18 10: | ||
+ | |||
+ | org.reflections.ReflectionsException: | ||
+ | either use fromURL(final URL url, final List< | ||
+ | |||
+ | </ | ||
+ | |||
+ | ===== Frontend build fails ===== | ||
+ | |||
+ | ==== Out of memory ==== | ||
+ | |||
+ | If your gulp build fails with the following error: | ||
+ | |||
+ | < | ||
+ | [INFO] [18:43:00] Starting ' | ||
+ | [INFO] [18:45:30] Finished ' | ||
+ | [INFO] [18:45:30] Finished ' | ||
+ | [INFO] | ||
+ | [INFO] <--- Last few GCs ---> | ||
+ | [INFO] | ||
+ | [INFO] 192087 ms: Scavenge 1282.6 (1434.8) -> 1282.1 (1434.8) MB, 3.8 / 0 ms (+ 3.8 ms in 9 steps since last GC) [allocation failure]. | ||
+ | [INFO] 192095 ms: Scavenge 1282.6 (1434.8) -> 1282.2 (1434.8) MB, 3.6 / 0 ms (+ 3.3 ms in 8 steps since last GC) [allocation failure]. | ||
+ | [INFO] 192102 ms: Scavenge 1282.6 (1434.8) -> 1282.1 (1434.8) MB, 3.7 / 0 ms (+ 2.9 ms in 7 steps since last GC) [allocation failure]. | ||
+ | [INFO] | ||
+ | [INFO] | ||
+ | [INFO] <--- JS stacktrace ---> | ||
+ | [INFO] Cannot get stack trace in GC. | ||
+ | [ERROR] FATAL ERROR: Scavenger: semi-space copy | ||
+ | [ERROR] Allocation failed - process out of memory | ||
+ | [ERROR] 1: node:: | ||
+ | |||
+ | </ | ||
+ | |||
+ | Try following: | ||
+ | |||
+ | * Go to '' | ||
+ | * If you build BE+FE of a project together, check the '' | ||
+ | < | ||
+ | |||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | </ | ||
+ | |||
+ | * try adding '' | ||
+ | |||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | </ | ||
+ | |||
+ | ==== Wrong layout and NPM version ==== | ||
+ | |||
+ | If your frontend looks like this: [[https:// | ||
+ | |||
+ | * there is package-lock.json file in the frontend app module and it looks like this: [[https:// | ||
+ | * NPM version which you use when building frontend (or FE+BE) is at least 6. | ||
+ | < | ||
+ | |||
+ | npm -v | ||
+ | 6.4.1 | ||
+ | |||
+ | </ | ||
+ | |||