Drücke "Enter", um den Text zu überspringen.

Kategorie: work

Simples HTML 5 mit Emmet erstellen

Heute möchte ich euch einfach einmal vorstellen wie schnell man mit EMMET standardisierte Templates erstellen kann. Und das BESTE dabei ist, dass EMMET standardmäßig im Visual Studio Code mitinstalliert ist. Zumindest in der aktuellen Version ( Sept 2018 )

html:5

ergibt, meistens via Tabulator Taste, :

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
    <body>

    </body>
</html>

Weitere Elemente können angehängt werden, beispielsweise wird hier eine html 5 Basisstruktur erzeugt, danach ein Element, hier ist es Title, mit dem Wert My Title erzeugt:

html:5>title{My Title}

Das Resultat sieht dann wie folgt aus:

Emmet HTML5

Eigentlich recht fein. Natürlich kann man EMMET unglaublich erweitern und mit einer Zeile damit sich sehr viel erleichtern. Nachzulesen gibt es das unter anderem auf einem sogenannten Emmet Cheat Sheet.

#EMMET #HTML5 #VisualStudioCode #Coding #100DaysOfCode

Schreibe einen Kommentar...

JavaScript Slice Methode

Schneidet man mit SPLICE einen Teile des Arrays ab, lässt sich mit der JavaScript Slice Methode eine flache Kopie, von einem zuvor definierten Teil, erstellen. Dabei wird sowohl Beginn als auch Endpunkt festgelegt. Das besondere Dabei, das originale Array wird dabei NICHT verändert.

Die Syntax wie folgt

arr.slice([begin[, end]])

Ein Anwendungsbeispiel dafür könnte wie folgt aussehen.

// Schneidet das Array an Position 3 bis zum Ende aus und speichert es in einer neuen Variablen
let slice1 = arr.slice(2);

Ein  Funktionsaufruf könnte wie folgt aussehen

function forecast(arr2) {
// Beginnt bei Position 2 und endet bei Position 4 OHNE Position 4 mitzunehmen
// Null-basierter Index bevor die Extraktion endet. slice extrahiert bis zu, aber nicht inklusive end.
let sliced = arr2.slice(2, 4);
return sliced;
}

// Console Log mit Anfangswerten
console.log(forecast(['cold', 'rainy', 'warm', 'sunny', 'cool', 'thunderstorms']));

Slice Funktion

Mehr gibts wie immer am Developer Network unter dem Motto SLICE Methode

#100DaysOfCode, #JavaScript, #Coding, # SliceMethode

Schreibe einen Kommentar...

NGINX – Ein schneller Webserver

NGINX, eine super alternative zum bekannten Apache Webserver. Mehr Leistung in diesem Fall mehr Anfragen entgegennehmen zu können als ein Apache ist schon etwas was ihn auszeichnet. Allerdings ist die Konfiguration etwas anders und daher kann man sein angesammeltes Wissen nicht anwenden. Daher habe ich mich entschlossen mal ein kleines Tutorial zu erstellen. Das klappt eigentlich ganz einfach, wenn wir uns einen normalen CentOS 7.x installieren und danach ein paar Dinge einstellen. Was recht einfach klappt, wenn man die genauen Painpoints kennt. Auf der Konsole angekommen kann man mit folgenden Befehlen NGINX installieren.

yum install epel-release
yum install nginx
systemctl status nginx
systemctl start nginx
systemctl status nginx


Wenn der Status hier aktiv ist, könnt ihr Problemlos euren Server ansprechen, dazu einfach im Browser die Adresse eingeben. Nun müssen wir ein paar Einstellungen treffen. Die Konfigurationsfiles findet ihr unter /etc/nginx

Default Landing Page NGINX

Ändern der Startseite und Anpassen an den eigenen Server, sind nur ein paar simple Einstellungen. Wenn ihr bereits einen Server installiert habt oder über eine Cent OS 7.x latest verfügt, dann solltet ihr über diesen Pfad verfügen /var/www/html/ wenn nicht, könnt ihr diese einfach erstellen mit

mkdir -p /var/www/html
vi /var/www/html/index.html

Ein einfacher Hello World Eintrag oder etwas Ähnliches in der Art, einfach schreiben, kein HTML oder sonst was notwendig. Versucht es einfach. Nun müssen wir noch die Konfiguration anpassen um NGINX mitzuteilen, dass es zusätzliche Ordner gibt die zu berücksichtigen sind. Dazu erstellen wir 2 neue Ordner, via
mkdir /etc/nginx/sites-available
mkdir /etc/nginx/sites-enabled

Hinzufügen der Einträge im /etc/nginx/nginx.conf und auskommentieren der nicht mehr notwendigen Einträge.
vim /etc/nginx/nginx.conf


und im File die folgenden Einträge setzen:
include /etc/nginx/sites-enabled/*;
server_names_hash_bucket_size 64;

AdaptiereKonfiguratin NGINX

Nun erstellen wir einen sogenannten Server Block in den neu angelegten Verzeichnissen. Dazu ein File anlegen mit vi /etc/nginx/sites-available/MeineDomain oder so in der Art. Mein Tipp wäre hier das File entsprechend der gewünschten Location zu benennen. Eine simple Basis Konfiguration sieht wie folgt aus:

server {
listen 80;
server_name MeineDomain.com;

        location / {
root /var/www/html;
index index.html index.htm;
try_files $uri $uri/ =404;
}


error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}

Nun erstellen wir noch einen sogenannten Symbolischen Link, also einen Symlink zwischen sites-available und sites-enabled.
ln -s /etc/nginx/sites-available/MeineDomain /etc/nginx/sites-enabled/MeineDomain

Danach noch den NGINX neu starten
systemctl restart nginx
systemctl status nginx

NGINX up and running
und ihr solltet die Webseite sehen.

Adaptierte Webseite NGINX

Ps: Ich persönlich teste immer vor dem Neustart die aktuelle Konfiguration, dass klappt mit nginx -t und sollte hier alles ok sein, wird der Reload oder der Neustart durchgeführt. Viel Erfolg und willkommen in der Welt von NGINX 🙂

#NGINX #OpenSource #CENTOS7x #Linux #More

Schreibe einen Kommentar...

Gratis und noch immer toll – Wesnoth

Eigentlich wollte ich mich heute nicht unbedingt mit OpenSource Spielen beschäftigen aber Wesnoth lässt einem keine Wahl. Eines meines Lieblingsspiele damals in Portugal, auch weil es ohne Probleme offline spielbar war ist. Die Schlacht um Wesnoth oder auch “The Battle for Wesnoth” Es ist schön anzusehen was aus der damaligen Version wurde. Kurzum, die Installation hat immer reibungslos funktioniert, zumindest auf Windows 10 und auf Ubuntu und jetzt endlich auch auf Steam und noch immer kostenlos. Also muss ich mir das heute gleich einmal ansehen.

Im Wesentlichen hat sich nicht viel geändert, gut es gibt neue Grafiken und neue Einheiten aber es ist noch immer gratis und jeder kann mitmachen. Wie es mit dem Multiplayer Modus aussieht kann und möchte ich eigentlich nicht sagen. Nur so viel bei der Schlacht um Wesnoth handelt es sich um ein richtig gutes altes rundenbasierendes Strategiespiel mit Rollenspiel Elementen. Eigentlich wird man hier fündig, wenn man sich welche sogenannten „old school“ Games ansehen will und etwas die Zeit der Kindheit revuepassieren lassen will. Jetzt mal abgesehen von den ganzen Nintendo Fan Boys and Girls.

Erster Auftrag

StartBildschirm Battle for Wesnoth

Schön zu sehen, dass aus einem Open Source Project ein richtig gutes Produkt werden kann. Und wenn man sich die Zeitspanne ansieht, ich beispielsweise habe es zum ersten mal 2014 ausprobiert, dann muss man neidlos feststellen, dass auch ohne Geld ein Spiel entstehen kann, welches sowohl von der Community als auch von den EntwicklerInnen geschätzt, supported und geliebt wird.

#Wesnoth #BattleforWesnoth #OpenSource #Steam

Schreibe einen Kommentar...

Webinar Update – Connected Citizens

Hier ein kleines Update zu unserem Webinar. Vorgestellt wurde ja unser Award Winning Projekt, Connected Citizens, bei dem ich sowohl die Architektur und den DataHub entwerfen durfte und neben der Implementierung der einzelnen Komponenten auch noch die Präsentationen vor Ort in Nizza über einen Zeitraum von drei Tagen übernehmen durfte. ? Und hier der offizielle Text auf der Homepage vom TMFORUM.

“This Catalyst has developed a cloud-based platform, or data hub, for smart cities that uses TM Forum Open APIs and software-defined networking, supports distributed ledger technology like blockchain, and provides an IoT gateway and identity and access management. It enables new business models supporting the TM Forum’s Smart City Manifesto and provides the digital capability for services that deliver cleaner, safer, more adaptive and efficient city environments for citizens, enterprises and visitors.”

Und etwas Stolz bin ich schon, immerhin haben wir damit 3 Jahre in Folge einen Team Award gewonnen. Das zeigt zumindest, dass das Thema Smart City nach wie vor aktuell ist und es auch bleiben wird. Ich bedanke mich für ein tolles Team, die gute Zusammenarbeit und freue mich auf die weiteren Schritte. Demnächst und sobald der Link verfügbar ist werde ich natürlich die Aufnahme des Webinars posten. Bin schon gespannt was sich daraus ergeben wird.

WinningTeam2018

Hier noch das Team, während des Events in Nizza, bzw. nach der Übergabe des Awards. Es war mir eine Ehre, bis bald.
#Smartcity #Catalyst #ConnectedCitizens #TMForum

1 Kommentar

Paint.Net

ALs Alternative zu teuren Bildbearbeitungsprogrammen gibt es ja schon seit längerem Paint.NET.
Entwickelt wird es an der Washington State University zusammen mit Hilfe von Microsoft. Was anfänglich als Ersatz für Paint gedacht war hat sich mittlerweile zu einem richtig guten Tool entwickelt. Paint.NET ist eine der besten Gratis-Alternativen zu anderen teuren Bildbearbeitungs-Programmen.

  • Übersichtliche Oberfläche
  • Viele Funktionen (mehrere Ebenen, Recolour, Filter usw)
  • Umfangreiche Tutorials

Und das Beste daran, es ist Freeware. Ein einfacher Download ermöglicht die schnelle Installation. Hilfe findet man im eigenen Forum oder anhand zahlreicher You Tube Tutorials. Dieser Schriftzug beispielsweise dauert maximal 2 Minuten.

#PaintNet #Freeware #OpenSource

Schreibe einen Kommentar...

Webinar – Connected Citizens

Das Thema Smart City ist in aller Munde. Ich habe am Donnerstag die Ehre in einem Webinar über unser „Award-winning-project“ Connected Citizens zu berichten. Sagen wir mal so, es ist ein Webinar in dem wir vorstellen, was alles möglich wäre und wie man vorhandene Ressourcen nützt, diese bündelt und daraus Lösungen entwickelt welche sowohl EinwohnerInnen und Städten helfen ihren Alltag zu optimieren und Kosten zu reduzieren.

#Webinar #ConnectedCitizens #SmartCity

Schreibe einen Kommentar...

Juni Update – #Bitcoin

Nachdem ich wieder aus dem wunderbaren Urlaub in Rhodos zurück bin, gehts auch wieder los. Dahingehend habe ich mir mal angesehen wie sich die Kurse in den letzten Wochen so entwickelt haben. Keine Angst, dass wird jetzt keine harte Analyse.

Im Wesentlichen, so denke ich hier und heute hat sich die Krypto Welt stabilisiert. Sicher, wir sind weit weg von unserem damaligen Hoch im Dezember aber dennoch auf einem guten Weg. Siehe nachfolgendes Bild.

Die sogenannte Volatilität ist derzeit eher minimal spürbar, sicher es gibt noch immer Sprünge von 5-10 Prozent am Tag, aber da kennen wir anderes. :-). Klar wenn wir uns das im Verlauf des letzten Monates ansehen, gibt es hier sicher einen Abwärtstrend, aber was solls. Wohin die Reise geht kann derzeit niemand sagen. Dennoch machen wir die Welt gemeinsam #kryptofit #Ethereum #Bitcoin

Schreibe einen Kommentar...

What is blockchain

Was ist die Blockchain, heute mal in Englisch!

Blockchain is a specific architectural implementation of the Distributed Ledger technology. Its unique characteristics are that it organizes transactional data in Blocks. Blocks are linked together and the integrity of blocks secured with cryptography.

Hoffe das ist mal einigermaßen verständlich. Die Deutsche Übersetzung wäre wie folgt

Blockchain ist eine spezifische Architekturimplementierung der Distributed Ledger-Technologie. Seine einzigartigen Eigenschaften sind, dass es Transaktionsdaten in Blöcken organisiert. Blöcke sind miteinander verbunden und die Integrität von Blöcken wird durch Kryptographie gesichert. Man kann sich das so vorstellen, wie eine doppelte Buchhaltung. Nachdem ein Block gefunden wird, wird jede Transaktion vermerkt, sowohl ausgehend als auch eingehend. Damit kann zumindest in der Theorie keine Transaktion verloren gehen.

#Blockchain #Ehtereum #Kryptofit

Schreibe einen Kommentar...

Auf nach NIZZA

Und dieses Jahr geht es wieder nach NIzza.

Was wir heute haben, tja wieder einmal einen wundervollen Catalyst mit tollen Partner(innen) Wir sehen uns in NIzza.

See you in Nice, looking forward to present Catalyst at in with and .

Und das haben wir heuer vor

Connected Citizen – Phase II from TM Forum on Vimeo.

Schreibe einen Kommentar...