Autor: amoerke

Raspi über Hostname

Posted on by amoerke

Im Router dem Raspi eine feste IP-Adresse vergeben.

Auf dem Raspi in der /etc/hosts:

FESTE_IP HOSTNAME
Bsp.: 192.168.100.200  raspberrypi.localCode-Sprache: CSS (css)

In der /etc/hostname den gleichen Hostname (bspw. raspberrypi.local) eintragen

Git – CheatSheet

Posted on by amoerke

Remote-URL ändern

Bash
git remote set-url origin https://gitlab.com/KodeKloud/repository-1.git
Bash

Worktrees

Mit Worktrees checkt man defacto eine Kopie des Repos aus, auch wenn in dem bestehenden Repo uncommittete Änderungen enthalten sind. Man arbeitet in der Kopie (extra Branch) commited seine Änderungen, gleicht mit dem master/main Branch ab und switcht zurück in den master/main Branch.

Bash
# Im Repo /Users/jane/foo
git worktree list # Alle anzeigen

git worktrees add ../foo-hotfix -b hotfix # Neuen Worktree unter foo-hotfix in neuem Branch hotfix anlegen

cd ../foo-hotfix # in Worktreeverzeichnis wechseln

# ggf Dependencies installieren
npm install # composer install

# Änderungen einchecken
git add . & git commit -m "Fix ..."

# Eventuelle Änderungen aus master/main abgleichen
git rebase main

cd ../foo

# Hotfix in den main mergen
git merge hotfix

# Nicht mehr gebrauchten worktree löschen
git worktree remove ../foo-hotfix
Bash

Branches anzeigen

Bash
git branch
Bash

Stashing (Zwischenspeichern)

Bash
git stash // Git Stand zwischenspeichern
git stash pop // Zu letztem Git Stand zurückkehren und diesen gleich löschen
git stash apply [stash-name] // Zu entsprechenden Git-Stand wechseln
git stash drop [stash-name] // Entsprechenden Git-Speicherstand löschen
git stash save "Name des Stashs" // Stash mit Namen speichern
git stash list // Alles stashes auflisten
Bash

Artikel

Branching

Bash
git branch // Alle Branches anzeigen
git checkout -b [BRANCHNAME] // Neuen Branch anlegen und gleich in diesen wechseln
git branch -d [BRANCHNAME] // Löschen des lokalen Branches
git push origin --delete [BRANCHNAME] // Löschen des Remotebranches
Bash

Artikel | Artikel zum Branchlöschen

Merging

Bash
git checkout master // HEAD / Master auschecken
git merge [BRANCHNAME] // Änderungen aus [BRANCHNAME] in master zusammenführen
Bash

Artikel

Diff

Bash
git diff --name-only master...xyz // Alle geänderten Dateien in einem Branch auflisten
git diff-tree --no-commit-id --name-only -r bd61ad98 // Alle geänderten Dateien in einem Commit auflisten
Bash

Geänderte Dateien auflisten

Verzeichnis aus git NICHT lokal löschen

Bash
git rm -r --cached myFolder
Bash

Gelöschte Datei aus altem Stand ansehen

Bash
git log -- path/to/file
git show <commit_hash>:path/to/file
# BSP:
git show 3a9fbc1:src/config.php
Bash

Gelöschte Datei aus altem Stand zum Vergleich wiederherstellen

Bash
git checkout <commit_hash>^ -- path/to/file
# BSP:
git checkout 3a9fbc1^ -- src/config.php
Bash

Linux Cheatsheet

Posted on by amoerke 
find `$pwd` -name '*.$DATEIENDUNG' -exec echo rm -rv {} \; // Dateien mit bestimmter Dateiendung löschen

du --max-depth=1 -h // Datei/Verzeichnisgrößen ermitteln

find -mtime +30 `$pwd` -exec echo rm -rv {} \; // Dateien älter als 30 Tage löschenCode-Sprache: PHP (php)

VSCode Fonts anpassen

Posted on by amoerke
  1. Download and install both FiraCode and FlottFlott (or another cursive alternative if you want)
  2. Install VSCode Extension: Custom CSS and JS Loader
  3. Save styles.css on your desktop
  4. Update the User settings (settings.json) in VSCode. (note: don’t forget to change the path “ vscode_custom_css.imports”)
  5. Ctrl + CMD + P -> Reload Custom JS and CSS
// Place your settings in this file to overwrite the default settings
{
    "editor.fontFamily": "Fira Code",
    "editor.fontLigatures": true,   
    "vscode_custom_css.imports": ["file:///Users/zamamoha/Desktop/styles.css"]
}   Code-Sprache: JSON / JSON mit Kommentaren (json)

styles.css

.type.storage,.type.storage.declaration, .storage.class.modifier {
  font-family: 'flottflott';
  font-size: 1.7em;
}

.type.storage.arrow.function {
  font-family: 'Fira Code'
}

.decorator.name, .decorator.punctuation:not(.block), .import.keyword {
    font-family: 'flottflott';
    font-size: 1.7em;
    color: #68f39b!important;
}
.attribute-name {
    font-family: 'flottflott';
    font-size: 1.5em;
}

.html.quoted.double {
    color: #a6f3a6!important;
}
.comment {
	color: #c5c5fd!important;
}
.comment:not(.punctuation) {
    font-family: flottflott;
    font-size: 1.5em;
}Code-Sprache: CSS (css)

Quelle: https://medium.com/@zamamohammed/multiple-fonts-alternative-to-operator-mono-in-vscode-7745b52120a0

Gulp – primordials is not defined

Posted on by amoerke

Beim Ausführen von Gulp erscheint folgende Fehlermeldung

primordials is not defined

Problem ist das Gulp 3 und NodeJS > 10 nicht miteinander kompatibel sind.

Dafür gibt es einen Workaround.

  1. Im Verzeichnis der package.json eine Datei npm-shrinkwrap.json anlegen
  2. In der Datei folgenden Eintrag hinterlegen
  3. npm install ausführen
  4. gulp sollte wieder funktionieren
 {
      "dependencies": {
        "graceful-fs": {
            "version": "4.2.2"
         }
      }
    }Code-Sprache: JSON / JSON mit Kommentaren (json)

Quelle: https://stackoverflow.com/questions/55921442/how-to-fix-referenceerror-primordials-is-not-defined-in-node-js#60921145

useImperativeHandle

Posted on by amoerke

Wenn eine Funktion einer Unterkomponente in einer Elternkomponente ausgeführt werden soll sollte man diesen Hook verwenden.

Beispiel: In einer Komponente wird ein Formular als Kindkomponente eingebettet. Der Submitbutton liegt aber in der Elternkomponente. Die Submitmethode liegt in der Childkomponente.

In der Childkomponente wird die auszuführende Funktion in den Hook einbettet:

useImperativeHandle(ref, () => ({
        submitForm() {
          console.log('sendForm');
        },
      }))Code-Sprache: JavaScript (javascript)

Dafür muss die Komponente über forwardRef befähigt werden, als Referenz aufgerufen werden zu können:

const AddressForm = forwardRef((props, ref) => {Code-Sprache: JavaScript (javascript)

Die Komponente wird dann wie folgt in die Elternkomponente eingebettet:

<AddressForm ref={addressFormRef} />Code-Sprache: HTML, XML (xml)

In der Elternkomponente kann dann beim Klick auf den Button die Funktion über die Referenz auf die Komponente aufgerufen werden:

const _onSubmit = () => {
        addressFormRef.current.submitForm();
    }Code-Sprache: JavaScript (javascript)

Hinweis: Wenn die Unterkomponente mit der Redux-Funktion connect verbunden ist, dann muss im connect als Option forwardRef: true mitgegeben werden:

export default connect(mapStateToProps, null, null, { forwardRef: true })(AddressForm)Code-Sprache: JavaScript (javascript)

https://reactjs.org/docs/hooks-reference.html#useimperativehandle