Compilar Fortran i gnuplot amb GitHub Codespaces

Compilar Fortran i gnuplot amb GitHub Codespaces

Tutorial

La idea

Existeix el que s’anomena Github Codespaces. Que permet tenir el VScode o el JupyterLab (IDEs + Compiladors o Intèrprets) tal com si el tinguessis instal·lat localment.
Aquests s’inicien des d’un repositori de Github (carpeta que obriries en el VSCode) que pots configurar (quines extensions vols instal·lades, quins compiladors, etc.).

Possibles usos

  • Exàmens resolts (repositori amb els exàmens resolts i el gfortran i gnuplot ja instal·lats).
  • Pràctiques i prepràctiques resoltes (també un repositori)
    • La gràcia està en que a part dels PDF amb els enunciats, es podrien posar fitxers markdown de teoria (que tenen codi, equacions, etc.). I des d’aquests pots referenciar qualsevol altre fitxer dins del repositori. De manera que si es combinés bé, podria haver-hi per una banda exàmens i per l’altra pràctiques resoltes i per l’altra teoria. I es relacionessin totes amb markdowns de teoria i links.
  • Al explicar la teoria. Donat un tema, posar el link del codespace directament
    • Nota: no sé si es pot executar el codespace d’un altre si aquest està autrat
  • Fins i tot es podria fer algo semblant pel Python. Els codespaces s’obren amb VS Code per defecte, però es pot configurar que l’IDE per defecte sigui JupyterLab (està en beta ara mateix).
  • I també es podria córrer el codespace amb JupyterLab utilitzant un kernel de fortran (compilador LFortran).

Pendent a implementar

  • Un altre repositori amb el gnuplot (i el fortran) ja instal·lat. És a dir en una carpeta que contingui els binaris per ubuntu
  • Una icona de gnuplot pel Material Icon Theme

Aconseguir-ho funcional des de zero (sense Dev Container)

0. Crea un nou repositori de Github

Crea un repositori buit i posar-hi (Upload Files) tots els teus arxius i programes (pots arrastrar la carpeta directament).

1. Instal·lar Fortran

En la terminal del VSCode (de la web) fer
sudo apt update && sudo apt install -y gfortran
Es pot comprovar amb gfortran --version.

2. Afegir l’extensió Modern Fortran

Anar a les extensions (Ctrl+Shift+X) i buscar l’extensió Modern Fortran, instal·lar-la.
Nota: si surten unes notificacions parlant de fortls i C++ ignoreu-les o doneu a “Disable” i “No” respectivament.
Comprovar en l’arxiu “prova.f90” que hi ha highlighting (colorets en el codi).

3. Instal·lar gnuplot

En la terminal fer
sudo DEBIAN_FRONTEND=noninteractive apt install -y gnuplot
Es pot comprovar amb gnuplot --version.

4. Afegir l’extensió gnuplot

Afegir l’extensió “Gnuplot” feta per “mammothb”.
Comprovar que a l’arxiu “fig1.gnu” hi ha highlighting (colorets en el codi).

Opcional: Afegir l’extensió Material Icon Theme

Per tal que es vegi millor cada arxiu o carpeta què és.
És l’extensió “Material Icon Theme” feta per “Philipp Kief”.
Nota x mi mateix: potser estaria bé afegir manualment una icona per gnuplot

Opcional: Afegir l’extensió PDF Viewer

Afegir l’extensió “PDF Viewer” feta per “Mathematic Inc” per tal de visualitzar els documents PDF a dins del VSCode.

Altres

Personalitzar-lo

Settings sync

Pla gratuït i ús de computació

Hem de parar el codespace quan no l’utilitzem (sinó es para sol als 30 minuts), ja que sinó gasta molt. Tenim 60h en el pla normal i 180h en el GitHub Pro (gratis per estudiants).
Hem d’instal·lar només les extensions que necessitem (ja que sinó gasta molt).
Podem veure quan hem gastat a https://github.com/settings/billing/summary.
notion image

Col·laboració en un codespace (que algú extern executi el teu)

Es guarda automàticament o s’ha de configurar?

Per defecte un cop l’executes, és a dir executes des del TEU repositori (que pots haver clonat d’algú altre), hi ha la funció auto save activada. Així que encara que el paris i el tornis a engegar manualment, no es perd informació ni personalització.
Al reconstruir (actualitzar el .devcontainer) es preserven els canvis dels arxius. No es perd la informació doncs.

Publicar a GitHub des del VSCode

No sé com es fa.

Relacionat

Markdown Github

Bash Terminal (Linux i Mac)

GIFs d’alta qualitat

Fortran Package Manager


Custom extension pels keybindings

You don't have to publish your custom extension to the VS Code Marketplace in order to use it in your GitHub Codespaces or DevContainer configuration. You can package the extension locally as a .vsix file and reference it directly in your devcontainer.json.

Here's how you can achieve that:

1. Create Your Extension and Package It

  • After you develop your extension using the instructions mentioned earlier, you can package it into a .vsix file, which is a packaged version of your extension.
To package the extension:
vsce package
This command will create a .vsix file (e.g., your-extension-name-0.0.1.vsix) in your project directory.

2. Include the .vsix in Your GitHub Repo

Once you have your .vsix file, you can add it to your repository, perhaps under a folder called extensions/ or similar. This will allow it to be accessed from the dev container configuration.
/your-repo-root /extensions your-extension-name-0.0.1.vsix /.devcontainer /...

3. Modify the devcontainer.json to Install the Local Extension

In your devcontainer.json, you can reference this local extension and install it when the Codespace or DevContainer is created. Use the extensions property in devcontainer.json and refer to the path of your .vsix file.
Here's how your devcontainer.json would look:
{ "name": "Your DevContainer", "image": "mcr.microsoft.com/vscode/devcontainers/base:ubuntu", "extensions": [ "ms-vscode.cpptools", // Example of a marketplace extension "./extensions/your-extension-name-0.0.1.vsix" // Path to the local extension ], "settings": { "editor.fontSize": 14 } }
  • The local extension (./extensions/your-extension-name-0.0.1.vsix) will be installed when the DevContainer is built.
  • Other marketplace extensions (like "ms-vscode.cpptools") can also be added as usual.

4. Build and Start the DevContainer or Codespace

Once you’ve set everything up, push your changes to GitHub. When a Codespace is created or the DevContainer is built, it will automatically install the local extension from the .vsix file.
To build or rebuild your DevContainer:
  • In VS Code, open the Command Palette (Ctrl+Shift+P), then run Dev Containers: Rebuild and Reopen in Container. If you're working in Codespaces, this will happen automatically when the environment is set up.

Summary of Steps:

  1. Create your custom extension and package it as a .vsix file.
  1. Add the .vsix file to your repo.
  1. Modify the devcontainer.json to include the local .vsix extension path.
  1. Rebuild the DevContainer or create the Codespace to apply the extension automatically.
This way, you don't have to publish the extension to the VS Code Marketplace — you can keep everything local to your repository.