Introduction¶
- Author:
Stefan Eletzhofer
- Date:
Feb 27, 2024
Introducing nexiles|elements apps¶
Prerequisites¶
OSX¶
http://cdn.sencha.com/cmd/6.0.0.202/jre/SenchaCmd-6.0.0.202-osx.app.zip https://www.sencha.com/legal/gpl/ -> check mail, click download link
Win¶
http://cdn.sencha.com/cmd/6.0.0.202/jre/SenchaCmd-6.0.0.202-windows-64bit.zip https://www.sencha.com/legal/gpl/ -> check mail, click download link
App Directory Structure¶
To create a app, we first need to create a app directory structure. The proposed standard structure looks like so:
.
├── docs
├── src
├── static
│ ├── css
│ ├── images
│ ├── js
│ └── resources
└── vendor
The directories have the following roles:
- docs
The documentation for the application.
- src
The source files of the application.
- static
The application runtime directory. This directory will contain all runtime resources and dependencies needed to run the application. This directory will be packed and upload to the Windchill server.
- vendor
This directory contains all external resources, frameworks etc. The build system will copy the dependencies to the runtime directory.
Build System¶
To build apps in an consistent and save manner, we have choosen to use CoffeeScript – see http://coffeescript.org. The build system uses a Cakefile to compile and assemble the app.
Quickstart¶
- Prerequisites:
nexiles.tools.api and its prerequisites
Let’s assume that we want to create a new web application using nexiles.tools called ‘finder’. To do so, we first instantiate a template from the server using the ‘app-create’ command:
$ nxtools app-create --name finder
Created `finder` application form template `template`.
This created a folder in the current working directory called ‘finder’ and populated it with the contents of the template web application from the server.
Note
the server side application template contains a fully functional web application which may e.g. be styled according to some CI rules.
We now have some template code locally to work with. We now can get started to develop the application.
An example of an application structure might be:
.
├── app
│ ├── controller
│ │ └── APPController.js
│ ├── model
│ │ └── APPModel.js
│ ├── store
│ │ └── APPStore.js
│ └── view
│ ├── APPGridPanel.js
│ └── Viewport.js
├── app.html
├── app.js
├── bom.json
├── build
│ └── template-app.zip
├── img
│ └── gruenerpunkt.png
├── meta.json
└── vendor
├── ext-all-debug.js
└── ext-all.css
8 directories, 13 files
The net effect is that we have a fully functional base example to work with.
For now, let’s imagine we altered the code – we now want to upload the new app. To do so, we issue the app-upload command and specify the finder directory – the directory whioch contains our application code:
$ nxtools app-upload finder
Created new iteration of `finder`: -.1
The command packaged the application and uploaded it to the server, creating a new iteration of it. We’re now able to preview it:
$ nxtools app-open finder
This will open a new web browser serving the application finder in it’s newest iteration.