Push-up vs push-message

  • En Power App Canvas app hvor du som bruker registrerer antall pushups, data lagres i Dataverse og presenteres i en PowerBI rapport.
  • Du som bruker kan ta initiativet selv eller motta push varsel (fra din mor/sjef) om å få ut fingeren.

Hvorfor:

  • Medarbedere som holder seg i form har mindre fravær og er bra for bedriften.
  • Familiemedlemmer som er aktive holder seg friske sikrer at mamma og pappa slipper å være hjemme for å passe på syke barn.
  • Når andre enn deg selv tar push-up holder de fred og du får jobbe i ro og mak.

For dette håper vi å få badgene:

Power apps i backend for å sende push varsel + power app canvas på mobilen for å motta varsel og registrere pushups
Fordi:”Use hip tech” + “embrace new Microsoft “

“Lego Shark Tank”

HTML5 WEB-COMPONENTS

What is HTML5 WEB-COMPONENTS aka custom components.

Custom components is a combination of several standards from the HTML standards.

  • Custom elements: A set of JavaScript APIs that allow you to define custom elements and their behavior, which can then be used as desired in your user interface.
  • Shadow DOM: A set of JavaScript APIs for attaching an encapsulated “shadow” DOM tree to an element — which is rendered separately from the main document DOM — and controlling associated functionality. In this way, you can keep an element’s features private, so they can be scripted and styled without the fear of collision with other parts of the document.
  • HTML templates: The <template> and <slot> elements enable you to write markup templates that are not displayed in the rendered page. These can then be reused multiple times as the basis of a custom element’s structure.

The thing with web-components is that they can be reused across, sites and installations by referencing the js script.

One way of using them is thinking of each component as a autonomous part/app that will not mess up anything else on the page.

You can can style things inside the a custom-element by using --css-variable

Communication between custom-elements can be done using events, setting attrubutes or calling functions on the element.

This component can be used together with anything else as long as it runs in a browser.

I have created a “super simple” demo component that counts up a number in random time and increment.

Creating a global-pushup-counter custom component using lit-element and lit-html.

Super simple, but functional
Buildt and bundled using esbuild.

https://esbuild.github.io/faq/

A new kind of bundler, written in GO to achieve extreme speed.

Embeded in an ASPNET core MVC application
And there it is..

We are claiming three badges for this:

  1. Hipster
  2. High 5
  3. Client side salsa

Cowders React Native App – Teknisk

Cowders mobil app er utviklet på React Native for å kunne lage en app som kan distribueres gjennom App Store for iPhone/IPad og Google Play for Android telefoner. Vi bruker også Expo som gir oss en rekke vanlige funksjoner og tjenester en bruker i en App. Videre kan også Expo brukes til å deploye apper til App Store/Play Store. Vi sikter på å kunne gi dommerne tilgang til appen slik at de skal kunne installere den på sin egen telefon. Expo er også tatt i bruk for å nå kamera og til pålogging gjennom Vipps.

Link til bruk av Kamera gjennom React Native og Expo: https://github.com/Cowders2021/cowzor-native/blob/master/pages/Camera.tsx

Appens hovedmeny, midlertidig sådan

Videre bruker vi React sit context API for State Management i appen, dette gjelder for en rekke av de ulike løsningene i appen, hittil værdata, notifikasjoner, men her vil sensordata og ikke minst den viktige Cownter funksjonen.

Link til vår bruk av React Context API: https://github.com/Cowders2021/cowzor-native/tree/master/contexts

Til denne posten claimer vi:

Go Native siden det er en Native app for Android og iPhone
Hipster for å bruke expo, react context api, delvis også for å bruke Blazor i desktop app (Vil bli bedre beskrevet i egen post)
moderne rammeverk, react native, context api, expo

Badge – Hipster

React app that runs on node.js server to serve conductors the possibility to drive trains from home office.

The app consumes 2 apps running on a raspberry PI, 1 app for live feed from train webcam and 1 app for controlling the trains through bluetooth.

The conductor portal in vs code to show that we are running it on node.

BTW we are also using react router for our menu handling.

The 2 apps that is serving the video feed and the remote control on the raspberry pi for the train is using sockets.io for communicating with frontend.

The resulting portal with live feed and further integration to PYTON controlled Rasberry PI