Git Product home page Git Product logo

fiori-meets-furo's Introduction

SAP Fiori meets Furo

Web app project to test the interoperability of Furo and SAP UI5

Setup

Step 1

run npm install to install the dependencies

Step 2 [optional]

Before you start the server you have to generate the API specs. To do this, run npm run spec:build to generate the needed environment files

The specs in this demo are pointing to static json files in /api, so you do not need an api server to see the client working.

Starting the server

To start a static server just type npm run start.

Starting development

The files for your project are located in /src. The starter pack contains some example views (pages).

Configuration

In /src/configs you will find some config files for a usual app.

- flowConfig.json :

This ist the configuration for the adaptive "routing".

- init.js :

initialize application env, theme, api

- styling.js :

In this file you can style the app (setting colors and spacing ,...).

- iconset.js :

In this file you can add your custom icons to the default icon set

Running the tests

The tests are located in /test. Like every other folder, you are free to move them, as long you update the dependencies and configs. To run the automated test use npm run test. This will take some time... (when you have added your testsuites ;-))

Add your browsers in the karma.config.js

Read more about testing

Build

Build tools take your code and make it production-ready. Among the things you may need build tools to do:

  • Transform ES6 code to ES5 for legacy browsers, including transforming JavaScript modules into other formats.
  • Bundle modules together can improve performance by reducing the number of files that need to be transferred.
  • Minify JavaScript, HTML, and CSS.

Many build tools can do this for you.

open-wc rollup build is already configured in this project

Read more about building your app on the lit-html page...

Pre configured npm commands

We have configured a lot of commands in the package.json (linter, formater, test, build, furo spec builder, furo user interface generators,...)

  • start
  • start:build
  • build:compatibility
  • build:modern
  • lint
  • lint:eslint
  • lint:prettier
  • format
  • format:eslint
  • format:prettier
  • test
  • test:watch
  • test:update-snapshots
  • test:prune-snapshots
  • test:compatibility
  • test:compatibility:watch
  • test:bs
  • uib:init
  • uib:generate
  • uib:watch
  • spec:build

Additional configs

  • rollup.config.js
  • rollup.config.modern.js
  • workbox-config.js
  • karma.bs.config.js
  • karma.conf.js
  • furo.spec.conf.json
  • furo.ui.spec.conf.json
  • es-dev-server.config.js
  • es-dev-server-build.config.js

Keep your repo in sync with the starter template

The starter get some updates from time to time. To stay in sync with this changes, you can add the template repository as a remote.

git remote add template [email protected]:theNorstroem/template-furo-app-starter.git
git fetch --all

# initial merge
git merge template/master --allow-unrelated-histories
# resolve the conflicts and merge the changes

fiori-meets-furo's People

Contributors

maltenorstroem avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.