Moya Angular Frontend

Requirements

• You need nodejs installed.
  • Installing and using nvm can be helpful. You can install and update node with nvm.

Run only Angular part of the project

1. npm install
2. npm run
3. Open http://localhost:4200/login on your browser.

Development

Naming

• Write everything in English, no Finglish allowed.
• Use moya prefix for all components/directives/pipes. Components generated with angular-cli automatically add this prefix.

Examples:

• moya-info
• moya-menu

Workflow

Kehittäminen on nopeampaa jos saa muutokset suoraan käyttöön, tämän takia kannattaa käynnistää lasikala ja webback-palvelin erikseen, ja proxyttää webbakista moya-jutut lasikalaan.

ng-palvelimessa on bugi, ja se ei osaa jakaa tavaraa muusta hakemistosta kuin /.

moyaproxy.conf.json sisältää proxyasetukset localhostin porttiin 8080.

Käyttö: npm run start

Tämän jälkeen kirjaa selaimesi sisään moyaan: http://localhost:4200/MoyaWeb/ ja surffata softaan: http://localhost:4200/

HMR

HMR -asetukset löytyy, niistä ei nykyisellään ole mitään hyötyä. Saa poistaa.

Code

Moya-REST

Oma moduulinsa, joka tullaan jossain vaiheessa eriyttämään ja käyttämään myös mahdollisessa nativescript-kännyappiksessa. Eli sen alle tulee vain servisejä, ei komponentteja.

Muuta

Jos tulee muita järkeviä kokonaisuuksia, joita voi käyttää muualla, jaa omaan moduuliinsa.

Directory structure

Älykäs komponentti:

- app
  - pages | "älykkäät" komponentit (stateful), eli componentit jotka
          | tietää mitä dataa haetaan ja mistä. Käytännössä route
          | -targetit
    - user | Loppukäyttäjälle näkyvät jutut, ohjleman ns. main moduuli
      - pizzatilaus
        - listOpen.component.ts | avoimet pizzatilaukset joista voi
                                | tilata
        - own_orders.component.ts
        - testit yms.
    - admin | moya asetukset, esim. tuotteet, korttipohjat, oma
            | moduulinsa joka lazyloadataan
      - admin.module.ts
      - pizzatilaus
        - pizzaedit.component.ts | hallitse mitä pizzoja voi tilata
    - info  | tapahtumanaikana "infolaisen" toimesta tehtävät jutut,
            | ylipäätänsä sisäänotto, käyttäjänhallinta jne. Oma
            | moduulinsa joka lazyloadataan
      - info.module.ts
      - viplist
        - viplist.component.ts,html,jne
        - viplist.service.ts
      - pizzatilaus
        - list.component.ts | listaa kaikki, ja lisää uusi pizzailaus
    - old-moya  | Monessa paikassa käytettävät target -componentit
                | tulevat omiksi kokonaisuudiksiin
      - old-moya.component.ts
    - pizzatilaus | Jos halutaan lazyloadata jokin osa moyasta, tehdään
                  | siitä uusi päätason komponentti. Joka sitten
                  | laitetetaan user / admin yms. puolille route
                  | -targetiksi
      - pizzatilaus-route.module.ts
      - pizza-user-order.component.ts
  - menu  | menu
  - shared  | geneeriset, mihinkään osaan kuulumattomat jaetut modellit
            | ja servicet tulevat tänne
    - models
      - user.model.ts
    - services
      - moya-rest.service.ts
      - session.service.ts
  - widgets | tyhmät componponentit tulevat tänne
    - button
      - html
      - ts
      - scss
  - components  | servicet sekä componenttien geneeriset tyhmät osat
                | tulevat tämän hakemiston alle. Tänne voi myös
                | pistää älykkäitä pieniä komponentteja
    - viplist
      - list.component.ts
      - add.component.ts
    - moya-locale
      - moya-locale.service.ts
      - moya-locale.model.ts  | model -tiedosto joka on käytössä vaan
                              | moya-locale -servicessä
  - modules | Kokonaiset, monessa paikassa olevat kokonaisuuksien
            | tyhmät osat tulevat tänne. Sen verta isot että ne
            | kannattaa tehdä moduuleiksi
    - pizzatilaus
      - anna-pizza.component.ts
      - list-pizzat.component.ts,*
      - listItem.component.ts
      - edit.component.ts
        - pizzatilaus.service.ts
      - pizza-tilaus.module.ts

I18N & Localization

Kieleistyksessä on käytössä ngx-translate. (koska angularin oma kieleistys oli rikki kieleistyksen toteutushetkellä). Lokalisointi -tukea ei vielä ole.

Kielitiedostot sijaitsevat: assets/i18n -hakemistossa. You figure it out how they works.

TODO

Tekemistä jota voi esim kämpissä säätää

Paketointi

Miten paketoidaan moya niin että mukaan kääntyy myös angular -jutukkeet?

Lazy loading

Lazy loading niin että se toimii vielä moyan kanssa, vaatinnee säätöä.

Travis yms. autotestit

oma travis-palvelin, ja siihen autotestit Ehkä greenkeeper, jos sitä voi hostata ite

Testit

Integraatio jne. testit, aloitteliat ei riko asioita niin todennäköisesti.

WebPack ja buildin minimointi

aot-kääntäminen ja siihen comperssointia jne.

---

MoyaAngular, auto generated instructions

This project was generated with angular-cli version 1.0.0-beta.24.

Development server

Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive/pipe/service/class/module.

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the -prod flag for a production build.

Running unit tests

Run ng test to execute the unit tests via Karma.

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via Protractor. Before running the tests make sure you are serving the app via ng serve.

Deploying to Github Pages

Run ng github-pages:deploy to deploy to Github Pages.

Further help

To get more help on the angular-cli use ng help or go check out the Angular-CLI README.