jamstack cms

JAMstack

Dies ist ein Experiment, bei dem ich versuche, eine JAMstack-Site zu erstellen.

Moderne Webentwicklungsarchitektur basierend auf clientseitigem JavaScript, wiederverwendbaren APIs und vorgefertigtem Markup.

Die Zutaten sind:

• JavaScript: Clientseitige Logik mit jQuery
• APIs: Serverseitige Logik mit auf Azure gehosteten Azure Functions Core Tools
• Markup: Statisches HTML, generiert mit Hugo
• Inhalt: Git-basiertes Headless CMS mit Netlify CMS

Der Quellcode für die Hugo-Site:

• /src/site

Der Quellcode für die Azure-Funktionen:

• /src/api

Die Website wird von Netlify gehostet unter:

• http://jamstack-cms.netlify.com

Laufen

Um die Site lokal auszuführen, bearbeiten Sie /src/site/data/api.toml:

[ recipe ]
get_ingredients = " http://localhost:7071/api/Ingredients/ "

[ submit ]
post_recipe = " http://localhost:7071/api/Recipe "

Führen Sie die Hugo-Site aus:

cd src/site

hugo server

Führen Sie die Azure-Funktionen aus:

cd src/api

func host start --cors http://localhost:1313

Durchsuchen:

http://localhost:1313

Zuschreibungen

Die Marmeladenrezepte stammen von der schwedischen Website Tasteline.com:

• Apfelmarmelade: http://www.tasteline.com/recept/appelmos-grundrecept/
• Preiselbeermarmelade: http://www.tasteline.com/recept/lingonsylt/
• Erdbeermarmelade: http://www.tasteline.com/recept/jordgubbssylt/

Übersetzungen vom Schwedischen ins Englische wurden mit Google Translate erstellt.

Die Bilder stammen von Flickr:

• Äpfel: https://www.flickr.com/photos/1sock/7910673688/ von 1sock
• Preiselbeeren: https://www.flickr.com/photos/kymis/2875484409/ von Jyrki Kymäläinen
• Erdbeeren: https://www.flickr.com/photos/42787780@N04/6984507532/ von Fried Dough