Sobre aquest lloc

sobre

1 Publiqueu un lloc web de Quarto a les pàgines de GitHub amb GitHub Actions

Aquesta guia ofereix una guia completa per crear i publicar un lloc web de Quarto a les pàgines de GitHub mitjançant GitHub Actions per al desplegament automatitzat.

1.1 Estructura d’aquest Document

Aquest document està organitzat en dues parts principals:

1.1.1 📘 Part 1: Tutorial Bàsic de Quarto (per a principiants)

Si estàs creant el teu primer lloc web amb Quarto o necessites un lloc en un sol idioma, aquesta primera part et guiarà pas a pas:

✅ Crear un lloc web Quarto des de zero
✅ Configurar Git i GitHub
✅ Implementar GitHub Actions per al desplegament automàtic
✅ Solucionar problemes comuns

1.1.2 📗 Part 2: Manual de Llocs Multilingües (avançat)

Si ja tens experiència amb Quarto i necessites crear un lloc web multilingüe amb navegació entre idiomes, ves directament a la segona part que cobreix:

✅ Estructura de projectes multilingües
✅ Sistema de navegació entre idiomes amb JavaScript
✅ Solució al problema localhost vs GitHub Pages
✅ Flux de treball per a múltiples idiomes

1.2 Requisits previs

Abans de començar, assegureu-vos de tenir:

Git instal·lat al vostre ordinador (Baixa Git)
Quarto instal·lat (Descarregueu Quarto)
Un compte de GitHub (Registreu-vos a GitHub)
Un editor de text o IDE (VS Code, RStudio, etc.)

1.3 Creeu el vostre lloc web de Quarto

1.3.1 Inicialitzar un nou lloc web de Quarto

Obriu el vostre terminal i executeu:

quarto create project website mywebsite
cd mywebsite

Això crea una estructura bàsica del lloc web de Quarto amb:

_quarto.yml - Fitxer de configuració
index.qmd - Pàgina d’inici
about.qmd - Sobre la pàgina
styles.css: estils personalitzats

1.3.2 Configura el teu lloc web

Editeu _quarto.yml per personalitzar el vostre lloc. Aquí teniu un exemple de configuració:

project:
  type: website
  output-dir: _site

website:
  title: "Mi Sitio Web"
  navbar:
    left:
      - href: index.qmd
        text: Inicio
      - about.qmd

format:
  html:
    theme: cosmo
    css: styles.css
    toc: true

Opcions de configuració clau:

output-dir: on es guarden els fitxers representats (per defecte: _site)
title: el títol del vostre lloc web
“tema”: tria entre temes de Bootswatch
navbar: estructura de navegació

1.3.3 Previsualitza el teu lloc web localment

Proveu el vostre lloc web localment abans de publicar-lo:

quarto preview

Això obre una vista prèvia en directe a http://localhost:4200 que s’actualitza automàticament quan feu canvis.

1.4 Configureu el repositori Git

1.4.1 Inicialitzar el repositori Git

Al directori del vostre projecte:

git init
git add .
git commit -m "Commit inicial: Sitio web Quarto"

1.4.2 Creeu `.gitignore`

Creeu un fitxer .gitignore per excloure fitxers innecessaris:

/.quarto/
/_site/
/.Rproj.user/
*.Rproj
.DS_Store

El directori _site el generarà GitHub Actions, de manera que no ho confirmem.

1.5 Creeu el repositori a GitHub

1.5.1 Creeu un nou dipòsit a GitHub

Aneu a GitHub i inicieu la sessió
Feu clic a la icona “+” a l’extrem superior dret
Seleccioneu “Nou repositori”
Introduïu els detalls del repositori:
- Nom del repositori: mywebsite (o el vostre nom preferit)
- Descripció: descripció opcional
- Visibilitat: públic (obligatori per a pàgines de GitHub gratuïtes)
- NO inicialitzeu-vos amb README, .gitignore o llicència
Feu clic a “Crea un repositori”

1.5.2 Connecteu el dipòsit local a GitHub

Copieu les ordres de GitHub (que es mostren després de crear el repositori):

git remote add origin https://github.com/tunombredeusuario/mywebsite.git
git branch -M main
git push -u origin main

Substituïu yourusername pel vostre nom d’usuari de GitHub real.

1.6 Configureu les pàgines de GitHub

1.6.1 Habilita les pàgines de GitHub

Aneu al vostre repositori a GitHub
Feu clic a la pestanya “Configuració”
Desplaceu-vos cap avall fins a “Pàgines” a la barra lateral esquerra
A “Font”, seleccioneu “Accions de GitHub”

Això indica a GitHub que utilitzi les accions de GitHub per al desplegament en lloc d’una branca.

1.7 Creeu el flux de treball d’accions de GitHub

1.7.1 Creeu el directori de flux de treball

A l’arrel del vostre projecte, creeu el directori de flux de treball GitHub Actions:

mkdir -p .github/workflows

1.7.2 Creeu el fitxer de flux de treball

Creeu .github/workflows/publish.yml amb el contingut següent:

name: Publish Quarto Website

on:
  push:
    branches: [main]
  workflow_dispatch:

permissions:
  contents: read
  pages: write
  id-token: write

concurrency:
  group: "pages"
  cancel-in-progress: false

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout repository
        uses: actions/checkout@v4

      - name: Set up Quarto
        uses: quarto-dev/quarto-actions/setup@v2
        with:
          version: 'release'

      - name: Render Quarto Project
        run: quarto render

      - name: Upload artifact
        uses: actions/upload-pages-artifact@v3
        with:
          path: _site

  deploy:
    needs: build
    runs-on: ubuntu-latest
    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}
    steps:
      - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v4

1.7.3 Comprensió del flux de treball

Components del flux de treball:

on: push: branques: [principal]: activat amb empentes a la branca principal
workflow_dispatch: permet l’activació manual des de la interfície de GitHub
permisos: els permisos necessaris per al desplegament a les pàgines de GitHub
concurrència: impedeix que diversos desplegaments s’executin simultàniament
‘build’ job: Baixeu el codi, instal·leu Quarto, lloc de renderització
deploy job: desplega el lloc renderitzat a les pàgines de GitHub

Accions clau utilitzades:

actions/checkout@v4: Baixeu el vostre repositori
quarto-dev/quarto-actions/setup@v2: instal·leu Quarto
actions/upload-pages-artifact@v3: carregueu el lloc per al desplegament
actions/deploy-pages@v4: desplega a les pàgines de GitHub

1.8 Implementeu el vostre lloc web

1.8.1 Confirmeu i carregueu el flux de treball

Afegeix i confirma el fitxer de flux de treball:

git add .github/workflows/publish.yml
git add .gitignore
git commit -m "Añadir flujo de trabajo de GitHub Actions para despliegue"
git push

1.8.2 Monitoritzar el desplegament

Aneu al vostre repositori a GitHub
Feu clic a la pestanya “Accions”
Hauríeu de veure el vostre flux de treball en funcionament

Execució del flux de treball de GitHub Actions

Feu clic a l’execució del flux de treball per veure els registres detallats
Espereu que s’acabin les tasques de construcció i implantació (normalment d’1 a 3 minuts)

1.8.3 Accediu al vostre lloc web publicat

Un cop el desplegament tingui èxit, el vostre lloc web estarà disponible a:

https://tunombredeusuario.github.io/mywebsite/

Substituïu yourusername pel vostre nom d’usuari de GitHub i mywebsite amb el nom del vostre repositori.

1.9 Domini personalitzat (opcional)

1.9.1 Configura el domini personalitzat

Si teniu el vostre propi domini, podeu utilitzar-lo en lloc de l’URL predeterminat de les pàgines de GitHub:

Aneu a Configuració → Pàgines al vostre repositori
A “Domini personalitzat”, introduïu el vostre domini (p. ex., www.mysite.com)
Feu clic a “Desa”

1.9.2 Configuració de la configuració de DNS

Afegiu registres DNS amb el vostre proveïdor de domini:

Per al domini àpex (mysite.com):

A     185.199.108.153
A     185.199.109.153
A     185.199.110.153
A     185.199.111.153

Per al subdomini (www.mysite.com):

CNAME     tunombredeusuario.github.io

Més detalls: Documentació del domini personalitzat de les pàgines de GitHub

1.10 Actualitzeu el vostre lloc web

1.10.1 Feu canvis localment

Editeu qualsevol fitxer .qmd del vostre projecte:

# Editar archivos
nano index.qmd

# Previsualizar cambios
quarto preview

1.10.2 Canvis de càrrega

Comprometeu i pengeu els vostres canvis:

git add .
git commit -m "Actualizar contenido"
git push

GitHub Actions reconstruirà i tornarà a desplegar automàticament el vostre lloc web en qüestió de minuts.

1.11 Resolució de problemes

1.11.1 Problemes Generals de Quarto i GitHub Pages

Aquesta secció cobreix problemes comuns que poden ocurrer tant en llocs bàsics com multilingües.

1.11.1.1 Problema: el flux de treball falla amb “Permís denegat”

Solució: Assegureu-vos que els permisos del flux de treball estiguin definits correctament:

Vés a Configuració → Accions → General
A “Permisos de flux de treball”, seleccioneu “Permisos de lectura i escriptura”
Marqueu “Permet que les accions de GitHub creïn i aprovin sol·licituds d’extracció”
Feu clic a “Desa”

1.11.1.2 Problema: error 404 en accedir al lloc

Solució: Verifiqueu que:

El feed de pàgines de GitHub està configurat a “Accions de GitHub”
El flux de treball s’ha completat correctament
Esteu utilitzant el format d’URL correcte
El repositori és públic (per a pàgines de GitHub gratuïtes)

1.11.1.3 Problema: els estils o les imatges no es carreguen

Correcció: Això sol passar amb camins base incorrectes. Actualitza _quarto.yml:

website:
  site-url: "https://tunombredeusuario.github.io/mywebsite"
  repo-url: "https://github.com/tunombredeusuario/mywebsite"

Per a recursos en llocs multilingües: Usa rutes relatives des del fitxer actual:

![](../images/about/pedro.jpg)

Les rutes absolutes com /images/about/pedro.jpg no funcionen a GitHub Pages quan el lloc està en un subdirectori (ex: usuari.github.io/repositori/)

1.11.1.4 Problema: el flux de treball no s’activa

Solució:

Assegureu-vos que el fitxer de flux de treball estigui al directori .github/workflows/
Comproveu que el fitxer tingui l’extensió .yml o .yaml
Confirmeu que heu premut a la branca “principal”.
Proveu d’activar-lo manualment: Accions → Nom del flux de treball → Executar el flux de treball

1.11.1.5 Problema: Canvis No Apareixen a GitHub Pages

Solucions:

Neteja la memòria cau del navegador: Ctrl+F5 (Windows) o Cmd+Shift+R (Mac)
Verifica l’estat de desplegament:
- Vés a Actions a GitHub
- Verifica que el workflow de GitHub Pages va completar amb èxit
Espera uns minuts: GitHub Pages pot trigar 1-5 minuts a actualitzar

1.12 Configuració avançada

1.12.1 Utilitzeu R o Python

Si els vostres documents Quarto utilitzen codi R o Python:

1.12.1.1 Paradeta:

Actualitzeu .github/workflows/publish.yml per incloure la configuració R:

- name: Set up R
  uses: r-lib/actions/setup-r@v2

- name: Install R packages
  run: |
    install.packages(c("rmarkdown", "knitr", "tidyverse"))
  shell: Rscript {0}

1.12.1.2 Per a Python:

Actualitzeu .github/workflows/publish.yml per incloure la configuració de Python:

- name: Set up Python
  uses: actions/setup-python@v5
  with:
    python-version: '3.11'

- name: Install Python packages
  run: |
    pip install jupyter matplotlib pandas numpy

1.12.2 Congelació de càlculs

Per a càlculs complexos, utilitzeu la funció de congelació de Quarto per evitar que torni a executar codi en cada desplegament:

A _quarto.yml:

execute:
  freeze: auto

Això guarda a la memòria cau els resultats computacionals localment. Confirmeu el directori _freeze/:

git add _freeze/
git commit -m "Añadir computaciones congeladas"

1.13 Recursos Útils

1.13.1 Documentació oficial

1.13.2 Recursos Quarto

Galeria Quarto - Exemples de llocs web
Extensions Quarto - Afegeix una funcionalitat
Comunitat Quarto - Obteniu ajuda

1.13.3 Recursos GitHub Actions

Quarto GitHub Actions - Accions oficials
GitHub Actions Marketplace - Troba accions
Sintaxi de flux de treball - Referència completa

1.14 Resum

Ara heu après a:

✅ Creeu un lloc web de Quarto localment
✅ Configura un repositori Git
✅ Crea un repositori a GitHub
✅ Configura les pàgines de GitHub
✅ Configura les accions de GitHub per al desplegament automatitzat
✅ Implementa i actualitza el teu lloc web
✅ Solucionar problemes habituals

Cada vegada que introduïu canvis a la vostra branca “principal”, GitHub Actions reconstruirà i tornarà a desplegar automàticament el vostre lloc web. Això crea un flux de treball de publicació perfecte que no requereix cap intervenció manual.

Feliç publicació! 🚀

2 Manual Avançat

2.1 Manual: Construcció i Publicació d’un Lloc Web Quarto Multilingüe

Aquest manual documenta el procés complet per crear, desenvolupar i publicar un lloc web Quarto multilingüe que funciona perfectament tant en desenvolupament local com en producció a GitHub Pages.

2.1.1 Estructura del Projecte Multilingüe

El lloc web està organitzat en tres idiomes amb la següent estructura de carpetes:

wikiPedro_MasterUPF/
├── es/                 # Espanyol (carpeta arrel per defecte)
│   ├── _format.yml
│   ├── _quarto.yml
│   └── [fitxers .qmd]
├── ca/                 # Català
│   ├── _format.yml
│   ├── _quarto.yml
│   └── [fitxers .qmd]
├── en/                 # Anglès
│   ├── _format.yml
│   ├── _quarto.yml
│   └── [fitxers .qmd]
├── images/             # Recursos compartits
├── styles.css          # Estils globals
└── _quarto.yml         # Configuració global

Principis clau: - Cada idioma té la seva pròpia carpeta amb configuració independent - L’espanyol (es/) es renderitza a l’arrel del lloc (/) - Els recursos compartits (imatges, estils) es mantenen en carpetes comunes - Cada carpeta d’idioma té el seu propi _quarto.yml i _format.yml

2.1.2 Desenvolupament Local

2.1.2.1 Previsualització d’un Idioma Específic

Per previsualitzar un idioma en desenvolupament local:

# Espanyol (des de l'arrel)
quarto preview es

# Català
quarto preview ca

# Anglès
quarto preview en

El servidor local s’executarà a http://localhost:3000/ (o port similar).

2.1.2.2 Renderitzat de Tot el Lloc

Abans de publicar, renderitza totes les versions d’idioma:

quarto render es && quarto render ca && quarto render en

Això genera els fitxers HTML a les carpetes corresponents: - _site/ (espanyol) - _site/ca/ (català) - _site/en/ (anglès)

2.1.3 Sistema de Navegació entre Idiomes

2.1.3.1 Funcionament del Sistema

El lloc implementa un selector d’idiomes mitjançant JavaScript que permet canviar entre les tres versions sense perdre la pàgina actual. La funció switchLanguage() realitza els següents passos:

Detecta la ruta actual: Obté l’URL on es troba l’usuari
Auto-detecta l’entorn: Verifica si el lloc està a GitHub Pages o localhost
Estableix la ruta base: Usa /wikiPedro_MasterUPF/ per GitHub Pages o / per localhost
Neteja la ruta: Elimina la ruta base i el prefix d’idioma existent (ca/ o en/)
Construeix la nova ruta: Genera l’URL amb el prefix de l’idioma destí
Navega: Redirigeix el navegador a la nova versió d’idioma

2.1.3.2 Exemple de Flux de Navegació

Quan canvies de l’anglès a l’espanyol: - Ruta actual: /wikiPedro_MasterUPF/en/index.html (a GitHub Pages) - Eliminar ruta base: en/index.html - Eliminar prefix d’idioma: index.html - Construir ruta espanyola: /wikiPedro_MasterUPF/index.html (l’espanyol està a l’arrel) - Navegar a la nova URL

2.1.3.3 El Problema GitHub Pages vs Localhost

Problema: La navegació entre idiomes funcionava perfectament a GitHub Pages però fallava en provar localment amb quarto preview.

Causa Arrel: Desajust en l’estructura d’URL entre entorns:

Estructura URL a GitHub Pages:
```
https://pedrogeogiscoding.github.io/wikiPedro_MasterUPF/
```
El lloc està allotjat en un subdirectori /wikiPedro_MasterUPF/
Estructura URL a Localhost:
```
http://localhost:3000/
```
El lloc es serveix des del directori arrel /

La implementació original tenia una ruta base codificada:

const basePath = '/wikiPedro_MasterUPF/';

Això funcionava a GitHub Pages on la ruta inclou /wikiPedro_MasterUPF/, però a localhost, la funció intentava trobar pàgines en rutes com /wikiPedro_MasterUPF/en/index.html que no existeixen localment (en realitat estan a /en/index.html).

2.1.3.4 La Solució: Auto-Detecció d’Entorn

La solució implementada detecta automàticament si el lloc s’està executant a GitHub Pages o localhost i usa la ruta base apropiada:

// Auto-detectar entorn: GitHub Pages o localhost
const isGitHubPages = window.location.hostname.includes('github.io');
const basePath = isGitHubPages ? '/wikiPedro_MasterUPF/' : '/';

Com funciona: - Verifica si el hostname conté github.io - Si és així → GitHub Pages → usa /wikiPedro_MasterUPF/ com a ruta base - Si no → localhost o altre → usa / com a ruta base

Beneficis: - ✅ Funciona perfectament a GitHub Pages (producció) - ✅ Funciona correctament a localhost (desenvolupament) - ✅ No necessita modificar codi en canviar entre entorns - ✅ Els logs de consola ajuden a depurar problemes

2.1.3.5 Logs de Depuració a la Consola

La funció inclou logs de consola per ajudar a solucionar problemes. Obre les Eines de Desenvolupador del navegador (F12) → pestanya Console per veure:

Current path: /wikiPedro_MasterUPF/en/index.html
Target language: es
Environment: GitHub Pages
Base path: /wikiPedro_MasterUPF/
Clean path after removing base: en/index.html
Clean path after removing language prefix: index.html
New path: /wikiPedro_MasterUPF/index.html

Aquests logs ajuden a verificar que la funció està: 1. Detectant l’entorn correcte 2. Usant la ruta base correcta 3. Netejant les rutes apropiadamente 4. Construint URLs de destí vàlides

2.1.3.6 Fitxers Modificats

La funció switchLanguage() es troba a: - /home/pedro/Documents/wikiPedro_MasterUPF/en/_format.yml (línies 5-43) - /home/pedro/Documents/wikiPedro_MasterUPF/es/_format.yml (línies 5-43) - /home/pedro/Documents/wikiPedro_MasterUPF/ca/_format.yml (línies 5-43)

Després de modificar aquests fitxers, sempre renderitza totes les versions d’idioma:

quarto render es && quarto render ca && quarto render en

2.1.4 Publicació a GitHub Pages

2.1.4.1 Configuració Inicial del Repositori

Crear repositori a GitHub:
- Nom: wikiPedro_MasterUPF
- Visibilitat: Públic (necessari per GitHub Pages gratuït)
Configurar GitHub Pages:
- Vés a Settings → Pages
- Source: Deploy from a branch
- Branch: main (o master)
- Carpeta: / (root)

2.1.4.2 Configuració de Quarto per GitHub Pages

Al fitxer _quarto.yml principal (arrel del projecte):

project:
  type: website
  output-dir: _site
  
website:
  site-url: "https://pedrogeogiscoding.github.io/wikiPedro_MasterUPF"
  
format:
  html:
    theme: [cosmo, custom.scss]

2.1.4.3 Procés de Publicació

Opció 1: Publicació Manual

# 1. Renderitzar totes les versions
quarto render es && quarto render ca && quarto render en

# 2. Afegir canvis al git
git add .
git commit -m "Update site content"

# 3. Publicar a GitHub
git push origin main

Opció 2: Publicació amb Comandament Quarto

quarto publish gh-pages

Aquest comandament: - Renderitza automàticament el lloc - Crea/actualitza la branca gh-pages - Puja els canvis a GitHub

2.1.4.4 Verificació Post-Publicació

Després de publicar, verifica:

URL principal: https://pedrogeogiscoding.github.io/wikiPedro_MasterUPF/
Navegació entre idiomes: Prova els botons de canvi d’idioma
Consola del navegador: Verifica que no hi hagi errors JavaScript
Rutes de recursos: Assegura’t que imatges i estils carreguen correctament

2.1.5 Solució de Problemes Específics de Llocs Multilingües

Nota

Per a problemes generals de Quarto i GitHub Pages, consulta la secció de solució de problemes de la Part 1.

2.1.5.1 Els Enllaços entre Idiomes No Funcionen en Local

Símptoma: Els botons de canvi d’idioma donen error 404 a quarto preview.

Solució: Assegura’t que la funció switchLanguage() inclou l’auto-detecció d’entorn:

const isGitHubPages = window.location.hostname.includes('github.io');
const basePath = isGitHubPages ? '/wikiPedro_MasterUPF/' : '/';

2.1.5.2 Els Enllaços entre Idiomes No Funcionen a GitHub Pages

Símptoma: Els botons de canvi d’idioma donen error 404 a GitHub Pages.

Possibles causes i solucions:

Verifica la ruta base: Ha de coincidir amb el nom del repositori

const basePath = isGitHubPages ? '/wikiPedro_MasterUPF/' : '/';

Assegura’t que tots els idiomes estan renderitzats:

quarto render es && quarto render ca && quarto render en

Verifica l’estructura de carpetes a _site/:

_site/
├── index.html (espanyol)
├── ca/
│   └── index.html
└── en/
    └── index.html

2.1.5.3 Recursos (Imatges, CSS) No Carreguen

Símptoma: Les imatges o estils no es mostren correctament.

Solucions:

Usa rutes relatives des del fitxer actual:
```
![](../images/about/pedro.jpg)
```
Les rutes absolutes com /images/about/pedro.jpg no funcionen a GitHub Pages en subdirectoris

Verifica que les carpetes de recursos estan fora de les carpetes d’idioma:

wikiPedro_MasterUPF/
├── images/        # ✅ Correcte
├── styles.css     # ✅ Correcte
└── es/
    └── images/    # ❌ Incorrecte

2.1.5.4 Canvis No Apareixen a GitHub Pages

Solucions:

Neteja la memòria cau del navegador: Ctrl+F5 (Windows) o Cmd+Shift+R (Mac)
Verifica l’estat de desplegament:
- Vés a Actions a GitHub
- Verifica que el workflow de GitHub Pages va completar amb èxit
Espera uns minuts: GitHub Pages pot trigar 1-5 minuts a actualitzar

2.1.5.5 Depuració amb Consola del Navegador

Per qualsevol problema de navegació:

Obre DevTools (F12)
Vés a la pestanya Console
Busca els logs de switchLanguage()
Verifica:
- Environment detectat correctament
- Base path és correcte
- Les rutes es construeixen correctament

2.1.6 Flux de Treball Recomanat

# 1. Desenvolupament local
quarto preview es  # Treballar en contingut espanyol

# 2. Provar navegació entre idiomes
# Obrir navegador a localhost:3000
# Provar botons de canvi d'idioma

# 3. Renderitzar abans de publicar
quarto render es && quarto render ca && quarto render en

# 4. Verificar localment els fitxers renderitzats
# Obrir _site/index.html al navegador

# 5. Publicar a GitHub
git add .
git commit -m "Update content: [descripció]"
git push origin main

# 6. Verificar en producció
# Visitar https://pedrogeogiscoding.github.io/wikiPedro_MasterUPF/
# Provar navegació entre idiomes

2.1.7 Millors Pràctiques

Sempre renderitza tots els idiomes abans de publicar
- Manté coherència entre versions
- Evita enllaços trencats
Prova localment abans de publicar
- Verifica que la navegació funciona a localhost
- Revisa la consola del navegador buscant errors
Manté sincronitzada l’estructura de fitxers
- Cada pàgina a es/ ha de tenir equivalents a ca/ i en/
- Usa el mateix filename al frontmatter
Usa la consola del navegador per depuració
- Els logs de switchLanguage() són el teu millor amic
- Faciliten identificar problemes de rutes
Documenta canvis a l’estructura
- Actualitza aquest manual si modifiques el sistema de navegació
- Manté notes sobre configuracions especials

2.1.8 Recursos Addicionals

Documentació oficial de Quarto: https://quarto.org
GitHub Pages Docs: https://docs.github.com/pages
Repositori del projecte: https://github.com/pedroGEOGIScoding/wikiPedro_MasterUPF

Torna a dalt

1 Publiqueu un lloc web de Quarto a les pàgines de GitHub amb GitHub Actions

1.1 Estructura d’aquest Document

1.1.1 📘 Part 1: Tutorial Bàsic de Quarto (per a principiants)

1.1.2 📗 Part 2: Manual de Llocs Multilingües (avançat)

1.2 Requisits previs

1.3 Creeu el vostre lloc web de Quarto

1.3.1 Inicialitzar un nou lloc web de Quarto

1.3.2 Configura el teu lloc web

1.3.3 Previsualitza el teu lloc web localment

1.4 Configureu el repositori Git

1.4.1 Inicialitzar el repositori Git

1.4.2 Creeu .gitignore

1.5 Creeu el repositori a GitHub

1.5.1 Creeu un nou dipòsit a GitHub

1.5.2 Connecteu el dipòsit local a GitHub

1.6 Configureu les pàgines de GitHub

1.6.1 Habilita les pàgines de GitHub

1.7 Creeu el flux de treball d’accions de GitHub

1.7.1 Creeu el directori de flux de treball

1.7.2 Creeu el fitxer de flux de treball

1.7.3 Comprensió del flux de treball

1.8 Implementeu el vostre lloc web

1.8.1 Confirmeu i carregueu el flux de treball

1.8.2 Monitoritzar el desplegament

1.8.3 Accediu al vostre lloc web publicat

1.9 Domini personalitzat (opcional)

1.9.1 Configura el domini personalitzat

1.9.2 Configuració de la configuració de DNS

1.10 Actualitzeu el vostre lloc web

1.10.1 Feu canvis localment

1.10.2 Canvis de càrrega

1.11 Resolució de problemes

1.11.1 Problemes Generals de Quarto i GitHub Pages

1.11.1.1 Problema: el flux de treball falla amb “Permís denegat”

1.11.1.2 Problema: error 404 en accedir al lloc

1.11.1.3 Problema: els estils o les imatges no es carreguen

1.11.1.4 Problema: el flux de treball no s’activa

1.11.1.5 Problema: Canvis No Apareixen a GitHub Pages

1.12 Configuració avançada

1.12.1 Utilitzeu R o Python

1.12.1.1 Paradeta:

1.12.1.2 Per a Python:

1.12.2 Congelació de càlculs

1.13 Recursos Útils

1.13.1 Documentació oficial

1.13.2 Recursos Quarto

1.13.3 Recursos GitHub Actions

1.14 Resum

2 Manual Avançat

2.1 Manual: Construcció i Publicació d’un Lloc Web Quarto Multilingüe

2.1.1 Estructura del Projecte Multilingüe

2.1.2 Desenvolupament Local

2.1.2.1 Previsualització d’un Idioma Específic

2.1.2.2 Renderitzat de Tot el Lloc

2.1.3 Sistema de Navegació entre Idiomes

2.1.3.1 Funcionament del Sistema

2.1.3.2 Exemple de Flux de Navegació

2.1.3.3 El Problema GitHub Pages vs Localhost

2.1.3.4 La Solució: Auto-Detecció d’Entorn

2.1.3.5 Logs de Depuració a la Consola

2.1.3.6 Fitxers Modificats

2.1.4 Publicació a GitHub Pages

2.1.4.1 Configuració Inicial del Repositori

2.1.4.2 Configuració de Quarto per GitHub Pages

2.1.4.3 Procés de Publicació

2.1.4.4 Verificació Post-Publicació

2.1.5 Solució de Problemes Específics de Llocs Multilingües

2.1.5.1 Els Enllaços entre Idiomes No Funcionen en Local

2.1.5.2 Els Enllaços entre Idiomes No Funcionen a GitHub Pages

2.1.5.3 Recursos (Imatges, CSS) No Carreguen

2.1.5.4 Canvis No Apareixen a GitHub Pages

2.1.5.5 Depuració amb Consola del Navegador

2.1.6 Flux de Treball Recomanat

2.1.7 Millors Pràctiques

2.1.8 Recursos Addicionals

1.4.2 Creeu `.gitignore`