Herzlich willkommen bei tsoto.net, Community, Magazin & Shop.
Jetzt kostenlos registrieren. Du hast Dein Passwort vergessen?
ForumGrafik-, Medien- & Webdesign AllgemeinNützliche Tools für Webdesigner und -entwickler
Nützliche Tools für Webdesigner und -entwickler - geschrieben am 04.03.2021 - 11:00

Level 11 Administrator
In diesem Thema sammeln wir nützliche Tools für Webdesigner und -entwickler rund um HTML, CSS3, JavaScript und was es sonst noch so gibt. Das Thema wird nach und nach erweitert und Vorschläge können gerne direkt hier gepostet werden.




Kategorien

Web
Allgemein
CSS3
JavaScript

Bild & Grafik
Bild & Grafik: Allgemein
Icons

Browser-Erweiterungen
Chrome

Sonstiges
IDE Erweiterungen
Alles andere




Allgemein

CSS Lernkurse
Ein umfangreicher CSS Lernkurs.
Link: https://web.dev/learn/css/

Ultimative Coding Ressourcen
Link: https://github.com/PizzaPokerGuy/ultimate-coding-r...-resources

Nützliche Übersicht über Entwickler Skills
Link: https://andreasbm.github.io/web-skills/

Bibliothek mit Testmethoden von größeren Firmen
Link: https://github.com/abhivaikar/howtheytest

Sammlung von Tools und Ressourcen
Link: https://www.designgems.co/




CSS3

CSS Filter Library
Link: https://bansal.io/filters-css

CSS Reset: reseter.css
Damit lassen sich z.B. von verschiedenen Browsern vordefinierten CSS-Angaben zurücksetzen. Sehr praktisch um Webseiten Cross-Browser kompatibel zu gestalten.
Link: https://github.com/krishdevdb/reseter.css

Artikel bzgl. CSS Reset oder Normalize
Link: https://elad.medium.com/normalize-css-or-css-reset...75175c5d1e

Fünf ungewöhnliche Methoden Pseudo-Elemente zu nutzen
Link: https://blog.logrocket.com/5-css-pseudo-elements-y...w-existed/

Mausposition in CSS
Ein eher experimenteller Versuch die Mausposition via CSS zu ermitteln.
Link: https://css-tricks.com/how-to-map-mouse-position-i...ion-in-css

Neon-Leuchtschrift mit CSS
Neon-Texte mit CSS text-shadow erstellen.
Link: https://css-tricks.com/how-to-create-neon-text-wit...-with-css/

Chart CSS
Ein Framework um alle mögliche Arten von Daten und Statistiken via CSS darstellen zu können, wie z.B. Balken-, Kurven- oder Linienstatistiken.
Link: https://chartscss.org/

A Complete Guide to Custom Properties
Viele nützliche Tipps bzgl. Custom Properties in CSS.
Link: https://css-tricks.com/a-complete-guide-to-custom-...roperties/

Ultimativer Guide zu Flexbox
Link: https://css-tricks.com/snippets/css/a-guide-to-fle...o-flexbox/




JavaScript

Zeichnet handgemalte-ähnliche Bilder
Link: https://github.com/pshihn/rough

Konvertiert Texte zu Handschrift
Link: https://github.com/alias-rahil/handwritten.js

console.log wie ein Profi verwenden
Link: https://denic.hashnode.dev/use-consolelog-like-a-p...like-a-pro




Bild & Grafik Allgemein

Vergrößert und verbessert Bilder
Vergrößert Bilder und Fotos mithilfe einer KI.
https://icons8.com/upscaler/




Icons

Mono Icons
Eine Sammlung von Open Source Icon-Sets.
Link: https://icons.mono.company/




Browser-Erweiterungen: Chrome

Durchsucht Seiten mit "Natürlicher Sprache" statt exakten Begriffen
Link: https://github.com/model-zoo/shift-ctrl-f




IDE Erweiterungen

Integriert eine Spielwiese (wie CodePen, JSFiddle) in Visual Studio Code
Link: https://github.com/lostintangent/codeswing




Sonstiges

Webseiten als Desktop-App ausliefern
Link: https://github.com/jiahaog/nativefier

magnificent app
Korrigiert fehlerhafte Eingaben im Terminal
Link: https://github.com/nvbn/thefuck

stream-unzip
Python-Funkion um ein Stream unzip für Dateien in einem ZIP-Archiv auszuführen, ohne die komplette ZIP-Datei in den Speicher zu laden.
Link: https://github.com/uktrade/stream-unzip
Nützliche Tools für Webdesigner und -entwickler - geschrieben am 04.03.2021 - 20:33

Level 2 Moderator
Allgemein

# Ultimative Coding Ressourcen
https://github.com/PizzaPokerGuy/ultimate-coding-r...-resources

# Nützliche Übersicht über Entwickler Skills
https://andreasbm.github.io/web-skills/

# Bibliothek mit Testmethoden von größeren Firmen
https://github.com/abhivaikar/howtheytest

# Sammlung von Tools und Ressourcen
https://www.designgems.co/




CSS

# Ultimativer Guide zu Flexbox
https://css-tricks.com/snippets/css/a-guide-to-fle...o-flexbox/

# CSS Filter Library
https://bansal.io/filters-css

# CSS Resetter
https://github.com/krishdevdb/reseter.css

# Artikel bzgl. CSS Reset oder Normalize
https://elad.medium.com/normalize-css-or-css-reset...75175c5d1e

# 5 seltene Methoden Pseudo-Elemente zu nutzen
https://blog.logrocket.com/5-css-pseudo-elements-y...w-existed/

Experimente

# Map Mouse Position in CSS
https://css-tricks.com/how-to-map-mouse-position-i...on-in-css/




JavaScript

# Zeichnet handgemalte-ähnliche Bilder
https://github.com/pshihn/rough

# Konvertiert Texte zu Handschrift
https://github.com/alias-rahil/handwritten.js

# console.log wie ein Profi verwenden
https://denic.hashnode.dev/use-consolelog-like-a-p...like-a-pro

Experimente

# Entfernt Personen in Echtzeit aus Videos
https://github.com/jasonmayes/Real-Time-Person-Rem...on-Removal




IDE Erweiterungen

# Integriert eine Spielwiese (wie CodePen, JSFiddle) in Visual Studio Code
https://github.com/lostintangent/codeswing




Chrome Erweiterungen

# Durchsucht Seiten mit "Natürlicher Sprache" statt exakten Begriffen
https://github.com/model-zoo/shift-ctrl-f




Iconsets

https://icons.mono.company/




Weiteres

# Vergrößert und verbessert Bilder
https://icons8.com/upscaler/

# Webseiten als Desktop-App ausliefern
https://github.com/jiahaog/nativefier

# magnificent app... Korrigiert fehlerhafte Eingaben im Terminal
https://github.com/nvbn/thefuck
Nützliche Tools für Webdesigner und -entwickler - geschrieben am 25.03.2021 - 19:30

Level 9 Mitglied
Ist Dreamweaver veraltet?
Neueste Beiträge
» Anime oder Manga? vor 3 Tagen
» Asiatische Horrorfilme vor 7 Tagen
» Mangas aus China vor 13 Tagen
» Lieblings Mangaka? vor 13 Tagen
» [Fun] Meine Zeichnungen vor 16 Tagen
» Welche asiatischen Bands findet ihr... vor 27 Tagen
» Like-Button vor 27 Tagen
» [PC] Amnesia: Rebirth - Gerade koste... vor 27 Tagen
» Farbfehler beheben vor 27 Tagen
» [FanFic] Fanfiction Schreiberlinge vor 29 Tagen
Neueste Mitglieder
» Inklingvor 13 Stunden
» Kiririnvor 23 Stunden
» Nemasvor 1 Tag
» Mun88vor 1 Tag
» Melonchenvor 2 Tagen
» Murmelmausvor 2 Tagen
» Tycfjnvor 3 Tagen
» ryurseivor 3 Tagen
» Fluggivor 4 Tagen
» AngelaDrachevor 4 Tagen
Shop Artikel
Matrix - Nendoroid - Neo
Matrix - Nendoroid - Neo für 57,99 EUR

Alle Preise inkl. MwSt., zzgl. Versandkosten.
🍀
Hinweis: Um Dir ein besseres Nutzererlebnis zu bieten, werden von uns sogenannte Cookies gesetzt. Durch die Nutzung unserer Website stimmst Du dem zu. Nähere Informationen findest Du in unserer Datenschutzerklärung.  Hinweis schließen.