Skip to content

Gatsby

15 Beiträge wurden mit "Gatsby" markiert
Alle Tags

Wie ich mit Theme UI meine Gatsby Themes Bibliothek gebaut habe

25.07.20195 Min. Lesezeit Kategorie: Coding
Themes für Gatsby zu erstellen macht Spaß und ist eine gute Möglichkeit, Projekte mit der Open Source Community zu teilen. In der Vergangenheit habe ich hauptsächlich Starter erstellt, die ich in die Starterübersicht auf Gatsbyjs.org eingereicht habe und damit quasi fertig war. Während ich daran arb...

Gatsby Starter Portfolio: Jodie

20.05.20191 Min. Lesezeit Kategorie: Coding
TypeScript wird immer beliebter und auch ich konnte mich nach einer gewissen Einarbeitungszeit davon begeistern lassen. Daraus entstanden ist mein neuester Gatsby Starter namens "Jodie". Neben TypeScript gibt es auch eine Integration mit Instagram und ein gut konfigurierbares Design System....

Tipps & Tricks für Gatsby

02.03.20199 Min. Lesezeit Kategorie: Tutorial
Seit längerer Zeit versuche ich immer mal wieder einen Quicktipp zu Gatsby auf Twitter zu veröffentlichen, da die Community solche kurzen, nützlichen Tipps liebt. Dementsprechend hatte ich schon damals einen Twitter Moment erstellt – aber wieso eigentlich nur Content von mir? Am 6. Januar diesen Jah...

Gatsby Starter Portfolio: Cara

05.02.20191 Min. Lesezeit Kategorie: Coding
react-spring ist mein persönlicher Favorit für Animationen in React. Es bietet unter anderem auch eine "Parallax" Komponente an - und genau diese wollte ich mal für einen meiner Gatsby Starter einsetzen. Dabei herausgekommen ist der Starter "Cara", der jene Komponente zusammen mit SVGs und CSS Anima...

Gatsby Starter für Prismic.io

29.10.20181 Min. Lesezeit Kategorie: Coding
Prismic.io ist ein proprietäres Headless CMS (SaaS), das besonderen Fokus auf Marketer, Editoren und Entwickler legt. Es verfügt sowohl über einen guten Editor zum Erstellen der Einträge als auch eine umfangreiche API. Weiterhin lassen sich komplizierte Content Modelle inkl. Beziehungen erstellen. F...

Upgrade-Guide: Gatsby v2

17.06.20184 Min. Lesezeit Kategorie: Coding
Die Beta zu Gatsby v2 ist da! Im offiziellen Blogpost kannst du die Änderungen im Detail nachlesen — kurz zusammengefasst gibt es folgendes dazu zu sagen: Das Konzept der Layouts wurde entfernt, dafür gibt es nun die StaticQuery. Die Dependencies wurden auf den aktuellen Stand gebracht (sprich: Babe...

Erstelle dein Design System mit Gatsby

02.04.20182 Min. Lesezeit Kategorie: Coding
Mittlerweile gibt es unzählige Tools und Möglichkeiten um ein Design System zu erstellen. Sei es per CSS, direkt aus React Komponenten oder mithilfe eines Online-Dienstes. Für Gatsby gab es bislang kein Plugin, um solche Design Systeme leicht & schnell zu entwickeln - weshalb ich ein eigenes erstell...

Kategorien & Tags zu Gatsby hinzufügen

28.03.20185 Min. Lesezeit Kategorie: Tutorial
Um auch langfristig den Überblick über alle Blogposts zu behalten, werden diese gerne in Kategorien eingeordnet und mit Stichwörtern (Tags) verschlagwortet. Genau das will ich in diesem Tutorial erklären: Die Einträge um Kategorien erweitern, diese Informationen im Beitrag anzeigen und Übersichsseit...

styled-components in Gatsby nutzen

13.03.20186 Min. Lesezeit Kategorie: Tutorial
Nach dem ersten und zweiten Teil meiner Gatsby-Reihe soll es nun um styled-components gehen. Die CSS-in-JS Library erfreut sich großer Beliebtheit unter React Entwicklern und ist momentan auch mein Favorit. Aber wieso eine CSS-in-JS Library nutzen und im speziellen styled-components? CSS-in-JS verh...

React Code Styling mit ESLint und Prettier

01.03.20185 Min. Lesezeit Kategorie: Tutorial
Nachdem wir im ersten Teil unseren Gatsby Blog erstellt und veröffentlicht haben, wird es in den folgenden Teilen darum gehen diesen mit Funktionen stetig zu erweitern. Im Laufe der Tutorials wirst du einiges an React Code schreiben müssen - und dabei schleichen sich immer wieder gerne Flüchtigkeits...

Ultra-schnellen Blog mit React und Gatsby erstellen

04.02.201815 Min. Lesezeit Kategorie: Tutorial
Gatsby ist ein blitzschneller Static Site Generator basierend auf React. Wer keine Lust auf ein großes CMS wie Wordpress hat, aber dennoch gerne etwas mehr als reine HTML-Seiten bearbeiten will, wird Gatsby sicherlich lieben (natürlich muss man auch React mögen). Gatsby erfüllt alle Ansprüche an ein...

Gatsby Starter Portfolio: Emilia

23.01.20181 Min. Lesezeit Kategorie: Coding
Für den auf React basierenden Static-Site-Generator Gatsby habe ich heute meinen zweiten "Starter" veröffentlicht! Nachdem mein vorheriger Starter ein helles Theme hatte, habe ich mich dieses Mal an dunkle Töne gewagt und den Fokus auf die Fotos gelegt. Das Theme Emilia hat hierbei alles, was ein sc...

Gatsby Starter Portfolio: Emma

06.11.20171 Min. Lesezeit Kategorie: Coding
Gatsby erlaubt es per CLI sogenannte "Starter" zu installieren. Diese sind wie der Name suggeriert vorkonfigurierte Gatsby-Projekte, die einen schnellen Start für das eigene Projekt ermöglichen. Einige Starter bieten eine gute Grundlage für ein Design-Framework (z.B. Google Material Design), andere ...

Willkommen auf meinem Blog

14.10.20172 Min. Lesezeit Kategorie: Allgemein
Gatsby ist ein sog. "Static Site Generator" für React.js, das dem Nutzer ermöglicht, schnelle und dynamische Websiten zu erstellen. Besonderen Fokus legt Gatsby auf die Optimierung für Mobilgeräte und erstellt hierfür automatisch eine PWA (Progressive Web App). Befüllt wird die Website mit Hilfe von...