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

History & Digital Humanity Posts

Something Good – Utah Saints

Und heute einmal ein Video. Einfach zum entspannen. Hilft immer, vor allem wenn der Tag besser sein hätte können ==> Utah Saints – Something Good

Mehr kann und will man nicht dazu sagen, außer:

“The freshest move i have ever seen, like he was floating on air”

#CodeOn #100DaysofCode #SomethingGood #WorkLifeBalance

Schreibe einen Kommentar...

Delete from Array

Heute sehen wir uns mal an wie man etwas aus einem Array löschen kann. Das klappt einwandfrei, wenn man den DELETE Operator verwendet. Nein hier wird kein Speicher freigegeben, sondern nur eine Eigenschaft aus einem Array inklusive Wert gelöscht. Ich hab hier mal ein Array zusammengestellt.


let vereine = {
GAK: 1,
AustriaSalzburg: 2,
Sturm: 3
};

//Nun löschen wir den Stadtverein mit einem einfachen

delete vereine.Sturm;

// Ausgabe der richtigen Vereine
console.log(vereine);

Das Resultat ergibt natürlich nur mehr 2 Einträge. Einmal der GAK und dann noch die Austria Salzburg.
Delete from Array

In diesem Sinne, happy coding und bis bald. Mehr Informationen gibts wie immer auf dem MDN Netzwerk

#100DaysOfCode #JavaScript #Array #Delete #GAK

Schreibe einen Kommentar...

Arrays in JavaScript

Heute hab ich mich einmal etwas mit Arrays in JavaScript beschäftigt. Nicht wirklich schlimm, wenn man die genauen Strukturen kennt. Und um es gleich etwas spannender zu machen, hab ich mir gedacht erstellen wir einmal ein schnelles cooles Array mit einem Satz welches sich in unterschiedliche Tiefen erstreckt. Eigentlich nennt man das ein multidimensionales Array.

Codebeispiel eines Arrays

Ausgeben kann man sich das nun alles, wenn man quasi mit console.log durchs Array wandert. Siehe den Output hier.

Console Output

In diesem Sinne, alles gute, bis bald und #codeOn #100DaysOfCode #Deutsch

Und wie immer gibt’s mehr auf der deutschsprachigen Seite von Mozilla Developers. Diesmal findet ihr alles unter ARRAY

Schreibe einen Kommentar...

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...

Die SPLICE Methode

Manchmal muss man Elemente in einem JavaScript Array löschen um das so bereinigte Array weiter zu verarbeiten. Die Antwort darauf ist die sogenannte splice() Methode. Damit kann sowohl der Startpunkt als auch die Anzahl der zu löschenden Elemente eines Arrays festgelegt werden.

Wie das beispielsweise aussehen könnte habe ich hier schnell mal niedergeschrieben. Nehmen wir einmal an wir haben in einem Array sowohl Nummer als auch Strings wollen aber nur die Nummern addieren. Dazu entfernen wir zuerst einmal die Strings welche hier praktischerweise im Array hintereinander positioniert sind. Dazu müssen wir die Position der Elemente im Array definieren und entfernen, wie man das macht siehe angefügtes Bild.

Splice Methode

Dies stellt nur eine simple Möglichkeit dar wie man Splice anwendet, Möglichkeiten unbegrenzt. Mehr Informationen wie immer auf der Mozilla Developer Page unter SPLICE Methode.  Bis bald und Code on 🙂

#100DaysOfCode #JavaScript #splice #OpenSource

Schreibe einen Kommentar...

POP und SHIFT

Heute gibts es das Gegenteil bei JavaScript Arrays zu Unshift und PUSH. ES handelt sich dabei um SHIFT und POP

  • pop() entfernt das letzte Element des Arrays und gibt es zurück
  • shift() entfernt das erste Element des Arrays und gibt es zurück

Wie das dann in einem Codebeispiel aussieht seht ihr hier

function popShift(arr) {
let popped = arr.pop(); // gibt complete zurück( Letzes Element im Array)
let shifted = arr.shift(); // gibt challenge zurück ( 1. Element im Array)
return [shifted, popped];
}
console.log(popShift(['challenge', 'is', 'not', 'complete']));

Das Ergebnis unsere kleinen Funktion sehen wir hier

Pop und SHIFT im Code Beispiel
Weitere Links beziehungsweise Details findet ihr hier auf dem Mozilla Developer Network.
POP METHODE und SHIFT METHODE

In diesem Sinne, bis bald
#100DaysOfCode #JavaScript #JS #POP()#SHIFT() #Array

Schreibe einen Kommentar...

Unshift und Push

September ist immer Schulbeginn oder aber auch der richtige Zeitpunkt etwas Neues beispielsweise JavaScript zu (er)lernen. Ich für meinen Teil hab mir gedacht, dass ich nun auch mal anfange kleinere Details preiszugeben. Simple und einfache Aufgaben via den angeführten Code darzustellen.

Im JavaScript gibts es beispielsweise die UNSHIFT und PUSH Funktionen. Während die PUSH Funktion jedem ein Begriff ist, stellt sich hin und wieder die Frage was denn die UNSHIFT so alles kann.

Einfach erklärt:

  • Mit Unshift lassen sie Elemente an den ANFANG eines Arrays hinzufügen.
  • Im Gegensatz dazu ist die PUSH Methode ja dazu da weitere Elemente am Ende des Arrays anzuhängen.

Wollen wir beispielsweise in einem leeren Array die Nummern 1-9 ausgeben, manche in Zahlen die Anderen im String Format können wir das recht simpel darstellen.


function mixedNumbers(arr) {
    // Mit Unshift füge ich am Array Anfang etwas hinzu
    arr.unshift('I', 2, 'three');
    // Mit Push werden die Zahlen am Ende angeführt
    arr.push(7, 'VIII', 9);
    return arr;
  }
  //  Hier wird nun das Array Ausgegeben mit den Werten aus
  // Unshift , den eingegebenen Werter im Concole.log und Push
  console.log(mixedNumbers(['IV', 5, 'six']));
  // Das Resultat in der Console sind demnach die Zahlen 1-9 dargestellt durch die entsprechenden Ziffern und Strings

Push und UNSHIFT

Gar nicht so schwer oder? Weiterführende Links gibt’s hier:
Die UNSHIFT Methode & Die PUSH Methode

Bis bald und liebe Grüße

#100DaysofCode #JavaScript #Array #MozillaDeveloper

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...

Ein simples Shell Script

Heute schreiben wir ein einfaches Shell Script und ermöglichen es unserem Linux es auszuführen. Klingt recht einfach, allerdings scheitern viele KollegInnen daran. Der erste Schritt wäre ein Script vorzubereiten. Dazu in eine Datei mit dem Editor eurer Wahl erstellen. Ich benutze dazu VIM. Dazu vim first.sh erstellen.

Der Inhalt der Datei könnte nun so aussehen
#mchoeti first script
echo -n "Enter your name: "
read name
echo "Hello, $name" we will wait for 3 seconds ....
sleep 3
echo " Thats it, $name ! This was your first Shell Script with a simple ECHO"

Nun müssen wir die neu erstellte Datei, also das Shell Script ausführbar machen, per Default ist es das nämlich nicht. Dies gelingt indem man das chmod Kommando den Wert und die Datei benennt.

chmod 755 first.sh

Ein Shell Script wird mit ./scriptname.sh ( in unserem Fall ./first.sh ) ausgeführt.

Danach solltet ihr folgendes Ergebnis sehen:

Simple Shell Script

Gratulation das klappt. Allerdings kann man das Script nur dann ausführen, wenn man beispielsweise in dem Order ist. Um das Script von überall ausführen zu können muss man die Pfad Variable setzen. Dazu muss man das bash_profile editieren.

cd ~
vim .bash_profile

Die Einträge wie im Bild setzen sich aus dem Pfad des Scripts zusammen. Generelle Syntax $PATH:directory

Bash_Profile Settings

Danach kann man das Script „normal“ ausführen wie folgender Screenshot nahelegt.

Globales Ausführen des Scripts

#ShellScripting #Linux #CentOS #100DaysOfCode

Schreibe einen Kommentar...