Mai 3, 2021

Bruchailromantik

Bruchrechnen in JavaScript

Weiterlesen
März 12, 2021

Alle Teiler einer Zahl

Mathe in JavaScript

Weiterlesen
Januar 26, 2021

Mit Node.js gegen den Rest der Welt

Heute: schnell mal was zippen

Weiterlesen
November 8, 2020

Mit Node.js gegen den Rest der Welt - Heute Webserver

Webserver in Node.js

Weiterlesen
Cover Image

Bruchailromantik

Bruchrechnen in JavaScript

Mai 3, 2021 - Lesezeit: 41 Minuten

So, hier jetzt also ein JavaScript für Bruchrechenaufgaben. Das ist diesmal etwas größer, um der Anzeige von Bruchzahlen auch gerecht zu werden und nicht irgendeine komische Schreibweise verwenden zu müssen.

//(
var myCalcer = (NumberToUsetargetElement=> {
  // the brain -> calcing stuff
  function Fraction(zahl) {
    let numerator = 0;
    let denominator = 0;
    for (i = 1truei *= 10) {
      if ((zahl * i) == Math.floor(zahl * i)) {
        numerator = (zahl * i);
        denominator = i;
        break;
      }
    }
    return ([numeratordenominator]);
  }

  function calc_ggt(ab) {
    let h = (a > b) ? b : a;
    for (i = hi > 1i--) {
      if ((a % i) == 0 && (b % i) == 0) {
        return i;
      }
    }
    return 1;
  }
  // the eye -> formatting output
  function writeFraction(zaehlernenner) {
    let outSpan = document.createElement("SPAN");
    outSpan.setAttribute('class''frac');
    outSpan.setAttribute('style''padding-right:5px;');
    outSpan.innerHTML = `<sup>${zaehler}</sup><span>/</span><sub>${nenner}</sub>`;
    targetElement.appendChild(outSpan);
  }

  function writeOperatorOrLine(opToWrite) {
    let outSpan = document.createElement("SPAN");
    outSpan.setAttribute('style''vertical-align:14px;padding-right:5px;');
    outSpan.innerText = opToWrite;
    targetElement.appendChild(outSpan);
  }

  function addcss() {
    let styleHelper = document.createElement("style");
    styleHelper.id = 'styleHelper';
    styleHelper.innerHTML = `span.frac {
          display: inline-block;
          text-align: center;
        }

        span.frac>sup {
          display: block;
          border-bottom: 1px solid;
          font: inherit;
        }

        span.frac>span {
          display: none;
        }

        span.frac>sub {
          display: block;
          font: inherit;
        }`;
    targetElement.appendChild(styleHelper);
  }
  // the hand -> doing things
  let bruch = Fraction(NumberToUse);
  let ggt = calc_ggt(bruch[0], bruch[1]);
  addcss();
  writeOperatorOrLine(NumberToUse);
  writeOperatorOrLine("=");
  writeFraction(bruch[0], bruch[1]);
  writeOperatorOrLine(":");
  writeOperatorOrLine(ggt);
  writeOperatorOrLine("=");
  writeFraction(bruch[0] / ggtbruch[1] / ggt);
};
//)(0.45);
var inputElement = document.createElement("INPUT");
var buttonElement = document.createElement("BUTTON");
var targetOutElement = document.createElement("DIV");
buttonElement.innerHTML = "Calc";
buttonElement.onclick = () => {
  /*
  for(var mainCounter = 1; mainCounter < 100; mainCounter++ ) {
    myCalcer(
      mainCounter /
      Math.pow(10, ("" + mainCounter).length),
      targetElement
    );
    targetElement.appendChild(document.createElement("BR"));
    targetElement.appendChild(document.createElement("BR"));
  }
  */
  targetOutElement.innerHTML = "";
  let numberToUse = parseFloat(inputElement.value.replace(',''.'));
  myCalcer(numberToUsetargetOutElement);
};
targetOutElement.style.backgroundColor = "white";
targetOutElement.style.border = '1px solid black';
targetOutElement.style.borderRadius = '4px';
targetOutElement.style.padding = '10px';
targetOutElement.style.margin = 'auto';
targetOutElement.style.width = '200px';
targetOutElement.style.textAlign = 'center';
document.body.appendChild(inputElement);
document.body.appendChild(buttonElement);
document.body.appendChild(targetOutElement);

Hierbei teilt sich die Funktion myCalcer in 3 Teile. Der erste Teil sind die Berechnungsfunktionen. Der zweite Teil regelt die Ausgabe und der dritte Teil macht die Rechnung. Am Ende kommt noch ein bisschen Styling dazu, damit das auch was hermacht. Kann man direkt in der Konsole benutzen oder hier:

EOF


Cover Image

Alle Teiler einer Zahl

Mathe in JavaScript

März 12, 2021 - Lesezeit: ~1 Minute

Mal schnell alle Teiler einer Zahl zu finden erfordert nicht unbedingt ein großes Programm. Statt dessen kann man das schnell in der Konsole erledigen.

The Power of JavaScript unleashed.

Hier eine einfache schnelle Lösung, CopyUndPaste fertig:


var totest = 120; // hier einfach die Zahl einsetzen.
// ermittelt alle Teiler und gibt sie auf der Konsole aus.
for(let i = 0;i < (totest+1); i++) {
  if(totest % i === 0) {
    console.log(i);
  }
}


Hier noch ein passender Generator für irgendwelche Zahlen.


for(let j = 0;j < 100; j++) {
let teilerCount=0;
for(let i = 0;i < (j+1); i++) {
if(j % i === 0) {
teilerCount++;
}
}
if(teilerCount === 6){
console.log(j); //,teilerCount);
}

}

Cover Image

Mit Node.js gegen den Rest der Welt

Heute: schnell mal was zippen

Januar 26, 2021 - Lesezeit: 6 Minuten

Wenn man mehrere Dateien transportieren will ist es meistens einfacher die Dateien in einer Datei zusammenzufassen. Dazu kann man die Dateien einfache in ein komprimiertes Archiv stecken. Eigentlich ist die Komprimierung dafür gedacht, die Dateigröße auf ein Minimum zu reduzieren und so Speicherplatz sparen zu können. Die Komprimierungsverfahren erzeugen aber Dateien, die erst wieder entpackt werden müssen um benutzt werden zu können. Das funktioniert sowohl bei Dateien wie auch ganzen Ordnern.

Es gibt Verfahren, bei denen wird vor der Ausführung der Datei ein eigenes Entpacken ausgeführt und dann wird die Datei gestartet. Sofern es sich um ein Programm handelt, ist das durchaus ein Möglichkeit. Dieses Verfahren ist in der Demo Szene sehr beliebt. Hier gibt es die Herausforderung möglichst viel Programmlogik in möglichst kleinen Dateien unterzubringen. Diese Verfahren sind sehr kompliziert und meist nur für den aktuellen Fall geeignet und machen teilweise von Systemlücken gebrauch, die unter Umständen vom Betriebssystemhersteller auch mal korrigiert werden, was dafür sorgt, dass im nächsten Moment ein entpacken nicht mehr möglich ist oder das Programm funktioniert nicht mehr korrekt. Jetzt gibt es aber auch Verfahren, die genormte Komprimierungs-technologien verwenden und keine Lücken nutzen, dafür nicht immer ganz so effektiv sind. Für unsere Anforderung ganze Verzeichnisse in einer Datei zu transportieren, fällt das aber nur gering ins Gewicht.

Jetzt kann man das Ganze von Hand manuell über Systemtools oder mithilfe vorhandener Software lösen. Hat man die Anforderung aber öfter, sagen wir mal man macht täglich Releases, dann darf der Vorgang gerne automatisiert werden. Das lässt sich in vielen Programmiersprachen sehr komfortabel erledigen. So auch in JavaScript und Node.js. Node.js stellt hierbei die Dateifunktionen und die Pakete und JavaScript macht das Ganze schön flexibel. Gerade wenn z.B. der Dateiname automatisch aus einem Datum erzeugt werden soll, macht einem JavaScript das Leben einfach.

Das Ganze in ein Skript gepackt könnte dann so aussehen:

const path = require('path');
const zipFolder = require('zip-folder'); // npm install zip-folder

// make some nice name
const filenameToUse = new Date().toLocaleString().replace(/\:/g'-');

(async () => {
  zipFolder(
    path.join(__dirname, 'FolderToZip'),
    path.join(__dirname, filenameToUse + '.zip'),
    (err) => {
      if (err) {
        console.log(`oh no! Error while create: ${filenameToUse} `, err);
      } else {
        console.log(`EXCELLENT: ${filenameToUse} created`);
      }
    })
})();

Das Ganze kann man z.B. ja auch noch mit einem ftp Upload kombinieren. Oder die Datei zum Beispiel danach noch zur Sicherung kopieren. So können hier einfach Schritte automatisiert werden und auch an andere Anforderung schnell und flexibel angepasst werden und das mit einem simplen Texteditor. Und und und...


Cover Image

Mit Node.js gegen den Rest der Welt - Heute Webserver

Webserver in Node.js

November 8, 2020 - Lesezeit: 26 Minuten

Mit Node.js lässt sich JavaScript in einer Konsolenumgebung starten, ohne dass dazu eín Browser notwendig wäre. Das eröffnet ganz neue Möglichkeiten, da so JavaScript aus der Sandbox des Browsers herauskommt und die bisherigen Beschränkungen, wie Dateizugriff und betriebssytemspezifische Abfragen nun entweder direkt möglich sind oder unkomplitziert implementiert werden können. Node.js kommt mit einem Paketverwaltungssytem auf den Rechner. Dieser Manager liefert Zugriff auf eine große Zahl von Paketen, in denen viele Funktionen in Node.js bereits realisiert sind oder Node.js durch z.B. Platform invokes sinnvoll erweitert.

Diese Pakete wiederum können Verweise auf andere Pakete haben, falls sie diese benutzen. Ganz ähnlich zu dem Paketmanager von Debian. Wenn z.B. ein FTP Paket geladen wird, wird im Hintergrund das Paket für den Dateizugriff ebenfalls installiert. Mithilfe einer kleinen Konfigurationsdatei und einem ordnerbasierten Paketmanagement, können verschiedene Versionen auf einem Rechner nebeneinander installiert werden. Dies ermöglicht verschiedene Projekte in verschiedenen Versionständen nebeneinander zu betreiben. Weiterhin ist der Anspruch, auf jedem System lauffähig zu sein und das Prinzip "Write once, run anywhere" passend umzusetzen. Intressant wird es immer dann, wenn man versucht betriebssystemspezifische Implementierungen zu nutzen.

Da Node.js unkompliziert sowohl unter Windows als auch unter Linux verwendet werden kann, ist es naheligend, als JavaScriptentwickler einen Blick zu wagen. Man kann im Gegensatz zu anderen Systemen den Know How Aufbau für eine Skriptsprache minimal halten und schnell Ergebnisse erzielen. Um mit der ganzen Umgebung etwas warm zu werden und weil ich für die Entwicklung einen kleinen Webserver benötigt habe, hab ich das Ganze mal mit einem Nodeskript umgesetzt. Natürlich ist dieser Server nicht vergleichbar mit der voll ausgestatteten Variante eines Symolo Servers, aber für kleine Zwecke ist auch ein solches Skript durchaus hilfreich.

Die Funktion des Skriptes umfasst lediglich das Starten eines Webservers, der eine begrenze Anzahl von Dateien aus einem Ordner und dessen Unterordnern laden kann. Dieses Skript ist nicht für Produktivumgebungen gedacht. So, genug chitchat, los gehts:

const http = require("http");
const path = require('path');
const fs = require('fs');

const HOST = "localhost";
const PORT = 8190;
const HOMEPATH = "dmf";

const requestListener = (requestresponse=> {

  let filePath = './' + request.url;
  if (filePath == './/'filePath = './' + HOMEPATH + '/index.html';
  else filePath = './' + HOMEPATH + request.url;

  filePath = filePath.split('?')[0];

  let extname = path.extname(filePath).split('?')[0]; // filter the queryparams

  let contentType = 'text/html'// set default content type
  switch (extname) {
    case '.js'contentType = 'text/javascript'break;
    case '.css'contentType = 'text/css'break;
    case '.json'contentType = 'application/json'break;
    case '.png'contentType = 'image/png'break;
    case '.jpg'contentType = 'image/jpg'break;
  }

  fs.readFile(filePath, (errorcontent=> {
    if (error) {
      if (error.code == 'ENOENT') {
        fs.readFile('./404.html', (errorcontent=> { // some nice error handling
          response.writeHead(200, { 'Content-Type': contentType });
          response.end(content'utf-8');
        });
      }
      else {
        response.writeHead(500);
        response.end('Sorry, check with the site admin for error: ' + error.code + ' ..\n');
      }
    }
    else {
      response.writeHead(200, { 'Content-Type': contentType });
      response.end(content'utf-8');
    }
  });
};

const server = http.createServer(requestListener);
server.listen(PORTHOST, () => { console.log(`Server is running on http://${HOST}:${PORT}`); });

Ein minimalistischer Server auf nur 50 Zeilen. Natürlich wird hier Gebrauch von einigen Paketen gemacht, die viele der Grundarbeiten bereits erledigen. Trotzdem kann sich das Ergebnis sehen lassen. Dieses Skript, unter und für Windows entwickelt, ist auch aus dem Stand unter Linux und MacOS lauffähig. Da hier Dateizugriffe verwendet werden, ist dieses Skript leider nicht für den direkten Einsatz im Browser verwendbar. Dafür beim nächsten Mal ein Beispiel.