Basics and Setup

Setup, Installation and Basics

The SDK is currently distributed as a standalone .zip file which contains basic app scaffolding for a traditional Angular app, as well as build and deploy tools.

Unzip the provided skedulo-customview-sdk.zip. The default directory with the two defined Sample Views ( Patient and Telemedicine Forms ) would look like this.

|-- FORMSDK
    |-- .babelrc
    |-- .editorconfig
    |-- .gitignore
    |-- jsVNextify.js
    |-- jsconfig.json
    |-- npm-shrinkwrap.json
    |-- package.json
    |-- run.sh
    |-- deploy
    |   |-- index.js
    |-- public
    |   |-- definition.json
    |   |-- index.html
    |   |-- npm-shrinkwrap.json
    |   |-- package.json
    |   |-- tsconfig.json
    |   |-- utils-browser.js
    |   |-- utils-node.js
    |   |-- webpack-require.d.ts
    |   |-- javascripts
    |   |   |-- forms
    |   |       |-- directives.js
    |   |       |-- services.js
    |   |       |-- patient_form
    |   |       |   |-- controller.js
    |   |       |   |-- data.js
    |   |       |   |-- template.html
    |   |       |   |-- view.js
    |   |       |-- telemedicine_consent
    |   |           |-- controller.js
    |   |           |-- data.js
    |   |           |-- template.html
    |   |           |-- view.js
    |   |-- signature
    |   |   |-- index.js
    |   |   |-- signatureTemplate.html
    |   |-- stylesheets
    |       |-- fonts
    |       |   |-- mobileskedicons.eot
    |       |   |-- mobileskedicons.svg
    |       |   |-- mobileskedicons.ttf
    |       |   |-- mobileskedicons.woff
    |       |-- images
    |       |   |-- popup-bg.png
    |       |   |-- select2x.png
    |       |   |-- spinner-lines.svg
    |       |-- sass
    |           |-- skedulo-mobile.scss
    |           |-- common
    |           |   |-- _colors.scss
    |           |   |-- _grid.scss
    |           |   |-- _icons.scss
    |           |   |-- _mixins.scss
    |           |   |-- _variables.scss
    |           |-- mobile
    |               |-- _alerts.scss
    |               |-- _badge.scss
    |               |-- _buttons.scss
    |               |-- _checkbox.scss
    |               |-- _device-android.scss
    |               |-- _device-ios.scss
    |               |-- _directives.scss
    |               |-- _fonts.scss
    |               |-- _form.scss
    |               |-- _list.scss
    |               |-- _loading.scss
    |               |-- _map.scss
    |               |-- _misc.scss
    |               |-- _mixins.scss
    |               |-- _modals.scss
    |               |-- _notification.scss
    |               |-- _page.scss
    |               |-- _passcode.scss
    |               |-- _radio.scss
    |               |-- _reset.scss
    |               |-- _signature.scss
    |               |-- _tables.scss
    |               |-- _tablet.scss
    |               |-- _utils.scss
    |               |-- _variables.scss
    |-- tools
        |-- main.js
        |-- make.webpack.config.js
        |-- wd-server.js
        |-- webpack.config.prod.js

To get up and running quickly, the default Angular app scaffold should work well enough. All code that needs to be written will be within the public folder.

All actions performed by the SDK are performed by calling the ./run.sh bash file. Try running it without any arguments.

> ./run.sh

Please select from one of the following options.
 * bootstrap : Install all npm package dependencies from the root and public folder.
 * dev-server : Development build with live-reload and error reporting in the javascript console of the app.
 * compile : Production build, all assets are minified, compressed and prepared for deployment.
 * deploy : Deploy compiled assets to a Skedulo server.

The SDK depends on various npm package dependencies to work properly. To install these dependencies just run:

> ./run.sh bootstrap

Internally, all that does is call npm install from the root as well as public folders. Once the process completes, the SDK can be used to start building custom views.

The public folder contains all dependencies used by the custom view itself. This includes, angular, lodash, bluebird etc.

When installing additional libraries ensure they are installed from the public folder.

Any build tools related packages (eg: additional babel packages, etc … ) must be installed in the root folder of the SDK. More on upgrading build tool capabilities are in the Build Tools section.


Last modified August 2, 2019: Updated fonts and finished guide 1:1 (fe87bc2)