From 7a2e987eabb862d9692abbc90aafad0044a79b44 Mon Sep 17 00:00:00 2001 From: dcruvolo Date: Tue, 19 Nov 2024 15:24:06 +0000 Subject: [PATCH 1/2] docs: revised generating typescript interfaces section --- docs/molgenis/dev_apps.md | 43 +++++++++++++++++++++++++++++++-------- 1 file changed, 35 insertions(+), 8 deletions(-) diff --git a/docs/molgenis/dev_apps.md b/docs/molgenis/dev_apps.md index 76f6d0605d..bef580e969 100644 --- a/docs/molgenis/dev_apps.md +++ b/docs/molgenis/dev_apps.md @@ -404,14 +404,41 @@ Open the index.html file, add update the message with the name of your app. In a By this point, you should have enough to view your app. Run the `yarn dev` command to start the dev server. The app will be served at [http://localhost:5173](http://localhost:5173). -### Generate typescript types for an app +### Generating typescript types for an app -To generate the typescript interfaces for a given schema, run: -`./gradlew generateTypes --args=[schemaName] [full-path+file-name]` +Throughout the EMX2 frontend, we use typescript for stronger typing and validation in our frontend components. (Note: we are currently migrating older applications. Not all applications may have typescript enabled by default.) For developers that use gradle, we've include a few shortcut for autogenerating typescript interfaces and types. To generate, follow these steps. -for example on unix: `./gradlew generateTypes --args='catalogue /Users/john/Code/emx2/molgenis-emx2/apps/nuxt3-ssr/interfaces/generated/types.ts'` -" -or on windows: `.\gradlew generateTypes --args='"catalogue" "C:\Users\john\Code\emx2\molgenis-emx2\apps\nuxt3-ssr\interfaces\generated\types.ts"' ` +#### 1. Start a local gradlew run -The first param is the schema name, second param is the full path to the file the interfaces get generated into. -Note that the file is either created or overridden, and that the folder must already exist. +Start your local molgenis instance. (Note: you will have to also start Postgres.) + +```terminal +./gradlew run +``` + +#### 2. Import your schema + +Once your instance is live and you have signed in, create a new database and import your EMX2 file. Optionally, import any ontologies or reference datasets. + +#### 3. Generate the interfaces and types + +In your application folder (`apps/*`), create a directory to store the types (e.g., "types", "interfaces", etc.). The syntax to generate the file is: + +```terminal +./gradlew generateTypes --args=[schemaName] [full-path+file-name] +``` + +- `schemaName`: the name of the schema you would like to use to generate types and interfaces +- `full-path+file-name`: the full system path to the output file. (Note: the command will throw an error if the output directory does not exist.) + +Any changes made to this file will be overwritten when the command is run again. If you would like to keep these changes, we recommend saving them in a new file. + +Depending on your operating system, there are some slight differences in the way it should be written. For example, if you wanted to generate types for a schema called `MySchema`, here's how it would be written. + +```terminal +# unix +./gradlew generateTypes --args='MySchema /Users/john/Code/emx2/molgenis-emx2/apps/nuxt3-ssr/interfaces/generated/types.ts' + +# windows +.\gradlew generateTypes --args='"MySchema" "C:\Users\john\Code\emx2\molgenis-emx2\apps\nuxt3-ssr\interfaces\generated\types.ts"' +``` From a37638243fdc70ea0190d5a55c40b7a56cd1f8b6 Mon Sep 17 00:00:00 2001 From: dcruvolo Date: Tue, 19 Nov 2024 16:24:56 +0000 Subject: [PATCH 2/2] docs: revised typescript section --- docs/molgenis/dev_apps.md | 21 +++++++++++++++------ 1 file changed, 15 insertions(+), 6 deletions(-) diff --git a/docs/molgenis/dev_apps.md b/docs/molgenis/dev_apps.md index bef580e969..ecca846946 100644 --- a/docs/molgenis/dev_apps.md +++ b/docs/molgenis/dev_apps.md @@ -404,13 +404,13 @@ Open the index.html file, add update the message with the name of your app. In a By this point, you should have enough to view your app. Run the `yarn dev` command to start the dev server. The app will be served at [http://localhost:5173](http://localhost:5173). -### Generating typescript types for an app +### Generating interfaces and types for use in MOLGENIS fontend apps -Throughout the EMX2 frontend, we use typescript for stronger typing and validation in our frontend components. (Note: we are currently migrating older applications. Not all applications may have typescript enabled by default.) For developers that use gradle, we've include a few shortcut for autogenerating typescript interfaces and types. To generate, follow these steps. +Throughout the EMX2 frontend, we use typescript for stronger typing and validation in our frontend components. To make things easier for developers, we've include a command for autogenerating typescript interfaces and types from an EMX2 schema. This process is outlined in the steps below. -#### 1. Start a local gradlew run +#### 1. Start a local EMX2 instance -Start your local molgenis instance. (Note: you will have to also start Postgres.) +Start your local molgenis instance using gradlew. (Note: Postgres will also need to be started.) In the root `molgenis-emx2` directory, run the following command. ```terminal ./gradlew run @@ -418,19 +418,28 @@ Start your local molgenis instance. (Note: you will have to also start Postgres. #### 2. Import your schema -Once your instance is live and you have signed in, create a new database and import your EMX2 file. Optionally, import any ontologies or reference datasets. +Once your instance is live - + +1. Navigate to the local emx2 instance at [http://localhost:8080/](http://localhost:8080/) +2. Sign in as admin or as another user that can create databases +3. Create a new database (e.g., `My new database`) +4. Import your EMX2 file into the new database #### 3. Generate the interfaces and types -In your application folder (`apps/*`), create a directory to store the types (e.g., "types", "interfaces", etc.). The syntax to generate the file is: +In your application folder (`apps/*`), create a directory to store the types (e.g., "types", "interfaces", etc.). The command is `generateTypes`. The syntax to generate the file is described below. ```terminal ./gradlew generateTypes --args=[schemaName] [full-path+file-name] ``` +##### Definitions + - `schemaName`: the name of the schema you would like to use to generate types and interfaces - `full-path+file-name`: the full system path to the output file. (Note: the command will throw an error if the output directory does not exist.) +##### Notes + Any changes made to this file will be overwritten when the command is run again. If you would like to keep these changes, we recommend saving them in a new file. Depending on your operating system, there are some slight differences in the way it should be written. For example, if you wanted to generate types for a schema called `MySchema`, here's how it would be written.