GitPod: VS Code in Browsers

GitHub Editor

Period in a repo

From any GitHub repo or pull request, developers can simply press the period (.) key to bring up the browser-based VS Code environment with the source code file ready for editing.

Substitute github by github.dev in a GitHub URL

That dot press to bring up the web-based editor takes you to https://github.dev/ (opens in a new tab), so the same one-press . functionality can be duplicated just by changing a URL from "github.com" to "github.dev".

Documentation

Esta documentación es sólo para usuarios GitHub Enterprise

• Web-based editor (opens in a new tab)

Referencias

• One-Click VS Code in Browser from GitHub Repo (opens in a new tab)

GitPod

Gitpod is an open source platform for automated and ready-to-code development environments that blends into your existing workflow. It enables developers to describe their dev environment as code and start instant and fresh development environments for each new task directly from your browser.

Aprendiendo GitPod

• Getting Started (opens in a new tab)

Configure Gitpod

Botón GitPod

Para tener el botón GitPod instala la correspondiente extensión en Chrome o Firefox

• GitPod Browser Extension (opens in a new tab)
• Chrome extension (opens in a new tab) in the webstore
• fireFox addon (opens in a new tab)
• GitPod Screencasts (opens in a new tab) 7 videos

Open in VSCode

En el menú de arriba a la izquierda elige la opción "Open in VS Code":

Tienes que instalar la extensión GitPod the VSCode y darle los permisos. A partir de ese momento puedes editar con tu VSCode local en el contenedor de GitPod.

See it running in my local machine, after the VSCode has been opened:

Observe the output in the terminal. We are running on the GitPod docker container

¡Ojo! tu VSCode local está compartiendo el GitPod Workspace. Cualquier modificación que hagas en el VSCode local se refleja en el GitPod Workspace en la nube y viceversa.

Snapshots

Whenever you want to share a reproducible example on StackOverflow or an issue report, providing real code that can be quickly tried, executed and explored is the best you can do. Online code playgrounds, such as CodePen or JSFiddle, are an excellent way to do that, as they are very accessible for both the creator and the readers. Unfortunately, they are not available for every programming platform, language and often don’t work for larger projects or examples.

Gitpod lets you create reproducible examples for any programming environment and any size of project.

No matter what state your Gitpod workspace is in, taking a Snapshot captures everything and provides you a link to share anywhere: on issues, forums (StackOverflow), emails and blogs. Anybody who clicks on a snapshot link instantly gets an exact copy of that workspace, including any uncommitted file changes and the UI layout.

See

• Creating reproducibles for any programming language (opens in a new tab)

Sustainable Node.js development with only a browser

See the article

Sustainable Node.js development with only a browser (opens in a new tab)

Oferta para Estudiantes (2023)

::: danger Cambios en la oferta para estudiantes (2023) Desafortunadamente, la oferta para estudiantes ha cambiado. GitPod ya no se ofrece como parte del GitHub Student Developer Pack.

En el blog de GitPod de 8 dic 2022 Introducing workspace classes and flexible pricing (opens in a new tab) dice:

Students and educators are encouraged to check out the generous new free and paid offerings described above. Our pricing plans which require student verification have been discontinued. Existing paid student plans will keep working.

• GitHub Student Developer Pack (opens in a new tab) :::

Oferta Plan Personal (2021) Profesores

En esta URL https://gitpod.io/plans (opens in a new tab) se puede solicitar un upgrade al plan "personal"  que permite acceder a repositorios privados si eres un miembro de una comunidad educativa. No he tenido que introducir tarjetas.

Importante: Cuando rellenes la solicitud ¡El campo VAT déjalo vacío!

Lo que pasa (Abril 2021) es que GitPod está siendo ofertado como parte del GitHub teachers' toolbox (opens in a new tab). Por tanto, si tienes actualizado tu GitHub Toolbox, creo que tanto los profesores como los alumnos tienen acceso a repos privados y a la nube proveída por GitPod.

Está limitada a 100 horas de uso por mes:

• 100 horas (opens in a new tab)
• Repositorios privados

En el ejemplo se ve los apuntes de PL (un repo público usando Jekyll) siendo editado con VSCode:

todo funciona bien.

Con este plan es posible acceder a repos privados. En el repo en GitHub aparece un nuevo botón verde con etiqueta "GitPod". Obsérvese que el repo es privado:

Cuando le damos al botón "GitPod" por primera vez es posible que nos salga un mensaje de error:

Le damos los permisos adecuados:

y ya podemos editar nuestros repos privados.

Drawbacks according to Pattacini

Gitpod is fantastic but comes with some constraints that may affect yours and your students’ work:

Obviously, you’d need to learn how to deal with Docker files and do some preliminary tests on your side. Getting accustomed to Docker might take some time :hourglass_flowing_sand:

In a Gitpod workspace, the user has no sudo credentials. This is understandable and represents good practice, but sometimes it’d be convenient to install packages straight away from the console without the burden of adjusting the Dockerfile once more.

Pero en otro post posterior (Feb 25 2021) comenta:

Just wanted to tell you that Gipod has been growing up tremendously as well as awesomely and, among the latest advancements it provides, we have now root access

Gitpod is free only for public GitHub repositories. This is ok for public assignments but could be a hitch for private ones. An easy workaround could be to ask students to clone their private repositories only after the workspace is ready.

Esto se resuelve como he comentado

There’s the threshold of 100 hours/month per user. Quite reasonable, but much depends on your classroom payload. When you share a running workspace, you’ll share also your access to GitHub, which might not be desirable! This is a serious inconvenient during remote technical interviews, for example.

Finally, don’t expect to have quantum computers available from free Cloud IDE’s services. After all, there’s a trade-off and resources are limited (e.g. no GPU), even though Gitpod seems quite generous in this sense.

Docker Images

Si la imagen (opens in a new tab) por defecto no se adapta a lo que quieres puedes configurarla (opens in a new tab)

Véase Docker in Gitpod (opens in a new tab)

Self Hosted

Gitpod, just as you know it from gitpod.io (opens in a new tab), can be deployed and operated on your own infrastructure. It supports different

• cloud providers,

• self-managed Kubernetes clusters,

• corporate firewalls, and even

• off-grid / air-gapped networks.

• Gitpod Self-Hosted (opens in a new tab)

You can find all configuration templates and installation scripts in the Gitpod repository:

https://github.com/gitpod-io/gitpod (opens in a new tab)

If you already have a Kubernetes cluster, or don’t want/cannot use AWS or GCP, please follow the generic guide:

• Install Gitpod on Kubernetes (opens in a new tab)

Referencias

• The benefits of integrating Docker and Cloud IDE’s in the GitHub Classroom workflow (opens in a new tab) by Ugo Pattacini
• Introduction to Gitpod (opens in a new tab)
• GitPod For Schools, Universities, and Coding Bootcamps (opens in a new tab)
• A Beginner’s Guide to Understanding and Building Docker Images (opens in a new tab)
• Config Docker for GitPod (opens in a new tab)
• Docker in gitpod (opens in a new tab)