jamstack.org

Pile de confiture

Ceci est le dépôt pour https://jamstack.org

Une porte d'entrée pour découvrir ce modèle architectural. Un endroit pour apprendre ce qu'est Jamstack, pour partager des outils, des conseils, des exemples et des articles. C'est également un endroit pour trouver une rencontre avec la communauté locale ou pour demander de l'aide pour en créer une.

Ressources contributives

Nous avons rassemblé un ensemble de vidéos, de présentations, d'articles et d'autres ressources d'apprentissage sur Jamstack. Vous pouvez contribuer au contenu de ce pool de ressources !

Nous acceptons les contributions soumises sous forme de demandes de tirage.

Fournir des liens vers des ressources

Pour contribuer un lien vers une ressource :

1. Créez un nouveau fichier md dans le dossier src/site/resources avec un nom unique et descriptif. Remplissez ce fichier selon la structure indiquée ci-dessous.
2. Pour les présentations et les vidéos, ajoutez une image miniature facultative au dossier src/site/img/cms . (L'image doit être au format JPEG de 600 px de large et 400 px de haut)
3. Soumettre une pull request

référence md de ressource :

---
title : Resource title
date : Publish date (YYYY-MM-DD)
link : the URL of this resource
thumbnailurl : /img/cms/resources/resource-thumbnail.jpg
type :
  - article (Help us group and sort the resources by type article|video|presentation)
---

Avant de soumettre une pull request, ou si vous suggérez/contribuez à des modifications de code ou de contenu, il est sage de prévisualiser votre modification dans une version locale. Nous avons essayé de rendre le processus d'exécution d'une version locale aussi bas que possible.

Exécuter une build locale

Conditions préalables

• Nœud et NPM

Installer et exécuter la build

 # Clone this repository to your local environment
git clone [email protected]:jamstack/jamstack.org.git

# move in to your local site folder
cd jamstack.org

# install the dependencies
npm install

# run the build and dev server locally
npm start

Style avec TailwindCSS

Ce site utilise TailwindCSS pour proposer des classes CSS utilitaires et fournir un moyen rapide de styliser le site. Cela signifie que la plupart des styles peuvent être effectués sans écrire de CSS supplémentaire. Au lieu de cela, les classes utilitaires peuvent être ajoutées directement au HTML. Cela peut permettre un développement très rapide et également offrir des niveaux de familiarité surprenants pour ceux qui sont habitués à travailler de cette manière (puisque les conventions et les cours ne sont pas par site .)

Lors de l'exécution/du développement localement, la commande npm run start générera le site, y compris le pipeline CSS de Tailwind.

Utilitaires CSS globaux.

Un petit nombre de règles CSS sur mesure sont fournies pour l'efficacité des classes répétées ou globales. Ceux-ci résident dans src/css/tailwind.css mais ils doivent être utilisés avec parcimonie, la plupart des styles étant effectués dans le HTML via les classes utilitaires de Tailwind.

Dév vs production

Lors d'une version de production, le pipeline CSS comprend une étape permettant de supprimer toutes les instructions CSS inutilisées et de compresser le CSS résultant. Pour des raisons d'efficacité du développement, cette étape n'est pas effectuée lors du développement local via la commande npm run start . Vous pouvez prévisualiser une version de production optimisée en exécutant ces commandes :

 # Run a production build
npm run build

# Serve the build locally
npm run start

Cloner et déployer en un clic

Vous pouvez cloner ce référentiel et l'amorcer en tant que site de test, complété par le pipeline de construction CI/CD sur Netlify en cliquant sur le bouton ci-dessous. (Nécessite des comptes GitHub et Netlify gratuits)