Cheatsheets voor bijvoorbeeld poetry en conda

[OlivierSwaak]

Maak cheatsheets voor handelingen die vaak nodig zijn zoals poetry initialiseren of conda environment aanmaken.

[AnneliesVlaar]

Overzicht van cheatsheet van oud student:

Conda:

• nieuw environment
• package installeren

Github:

• bestaande map als repository toevoegen

Poetry:

• Poetry installeren
• nieuw Poetry project
• package installeren
• dependency toevoegen

[davidfokkema]

De handeling 'maak nieuw project' is ook lastig: eerst poetry new en dan GitHub? Of eerst GitHub en dan poetry new?

[OlivierSwaak]

Nadat poetry wordt geïntroduceerd maakt het natuurlijk uit of we een conda environment aanmaken voor een geheel nieuw project of dat we een environment aanmaken om te controleren of het poetry project wel goed ingesteld is.

[AnneliesVlaar]

navigatie naar cheatsheet in appendix of vanuit de header

[OlivierSwaak]

Environment aanmaken

Initieel

Empty

conda create -n pythondaq python=3.10 Installeer je dependencies met pip/conda install

Nadat je een poetry project hebt

conda create -n pythondaq python=3.10
poetry install

Cheatsheet

Tab 1 voor poetry

1. Maak een nieuwe environment aan met conda create -n [naam] python=3.10
2. Installeer je dependencies met pip/conda install (welke willen we liever gebruiken?)

Tab 2 na poetry

1. Maak een nieuwe environment aan met conda create -n [naam] python=3.10
2. Installeer je dependencies met poetry install

[OlivierSwaak]

Github

1. Maak in de map ECPC een nieuwe map voor je repository aan
2. Open Github Desktop
3. File > Add repository en kies de aangemaakte map
4. Druk op de blauwe tekst Create repository
5. Vink Initialize this repository with a README
6. Kies bij Git ignore voor "Python"
7. Bevestig met de blauwe knop Create Repository

[OlivierSwaak]

Poetry

Compleet nieuw project

poetry new --src [naam]

Installeren van je package

poetry install

Toevoegen van dependencies

poetry add [dependency]

Alleen pyproject.toml

poetry init --no-interaction

Commandos toevoegen

Voeg onder [tool.poetry.scripts] een commando toe met: naam_commando = "package.module:naam_functie"

Cheatsheet

Tab 1 volledig nieuw project

1. Open de map ECPC met Visual Studio Code
2. Maak een nieuw project aan met poetry new --src [naam]
3. Open de projectmap (de map waar pyproject.toml in staat) met Visual Studio Code.
4. Installeer je poetry project met poetry install
5. Voeg je dependencies toe met poetry add [dependency]
6. Elke keer wanneer je een commando toevoegt of in een nieuwe conda environment zit, installeer je project opnieuw met poetry install

Tab 2 alleen pyproject.toml

1. Maak een nieuwe map voor je project aan in de map ECPC
2. Open de map met Visual Studio Code.
3. Maak een nieuw project aan met poetry init --no-interaction
4. Maak de volgende mappenstructuur aan: [boomstructuur met src, tests en de init.py]
5. Installeer je poetry project met poetry install
6. Voeg je dependencies toe met poetry add [dependency]
7. Elke keer wanneer je een commando toevoegt of in een nieuwe conda environment zit, installeer je project opnieuw met poetry install

[OlivierSwaak]

Mijn idee is om de hele tijd rechtsboven een lightbulb te hebben, als het nodig is kunnen we deze laten oplichten zodat de studenten weten waar ze moeten drukken. Simpelste is om met de lightbulb naar een andere pagina te verwijzen waar de cheatsheets staan. We willen echter het 'heen-en-weer klikken' verminderen, dus ik wil kijken of ik het iets van een pop-up kan maken, dat de cheatsheets 'uit' de header komen.

[OlivierSwaak]

Ik heb nu animaties en een placeholder cheatsheet toegevoegd aan dit knopje.

https://github.com/user-attachments/assets/5cd00b34-d8b6-4ce6-8f85-c82bb4c6ef74

Ik wil dit uiteindelijk een soort embedded html pagina maken, zodat de cheatsheets onder elkaar kunnen staan en dat je kan scrollen tot waar je het nodig hebt. We zouden eventueel ook door te kijken naar op welke pagina je bent sommige dingen wel of niet laten zien (bij les 1 heb je nog geen poetry nodig).

Zoals je kan zien aan het einde van de video moeten we ook nog nadenken over hoe we de cheatsheet miss naar het midden van de pagina moeten verschuiven als er wordt ingezoomd om er zo voor te zorgen dat het niet de rechterkant van het venster clipt. Dit is zeker belangrijk als studenten bijvoorbeeld splitscreen gebruiken tijdens het schrijven van de code (splitscreen van VSCode en de handleiding), dat de cheatsheet leesbaar blijft.

[OlivierSwaak]

Om ervoor te zorgen dat hij in de midden van de pagina blijft heb ik de alignment en de breedte van het element aangepast.

https://github.com/user-attachments/assets/17628ec6-bc01-419a-bab2-326f2a6e8a14

Ik vond het mooier toen hij uit het midden van de lightbulb kwam, maar nu blijft hij wel met elke scaling mooi in het midden van de pagina (althans hij houdt de breedte van de header aan die tussen het begin van de kopnaam is en het begin van de search bar).

[OlivierSwaak]

Cheatsheets standaard ingeklapt

[OlivierSwaak]

Lightbulb icoon wit

[AnneliesVlaar]

Een cheatsheet met als eerste een aantal hoofdstukken GitHub, Poetry, Conda

Door op het hoofdstuk te klikken kom je op een tweede pagina met paragrafen:

Daarna zie je dan de cheatsheet, met bovenin de navigatiebar waarmee je weer terug kan naar een vorig level, door te klikken op het hoofdstuk of de paragraaf (of het > tekentje):

ps: let niet op de kleuren, die zijn volledig random

[OlivierSwaak]

Het is me nu gelukt om de embedded pagina er wat breder te displayen en ik heb het icoontje wit gemaakt.

https://github.com/user-attachments/assets/b6751f58-d292-4534-bcb1-e1f4bf713c3b

Zoals verwacht krijgen we een recursieve cheatsheet, dus ik zal kijken of ik de header weg kan halen

[OlivierSwaak]

Het is me gelukt om de header weg te krijgen en door de verhoudingen van de embed, is de navigatie nergens te bekennen.

https://github.com/user-attachments/assets/1b1df5fa-1e30-4aa5-bf6a-99ec6425d03d

Door de manier waarop ik dit heb gedaan, mist de cheatsheets in de appendix wel een header, maar ik vind dat op dit moment niet belangrijk genoeg om op te lossen.

[OlivierSwaak]

Ik heb nu de hiërarchische structuur verwerkt en de cheatsheets toegevoegd.

https://github.com/user-attachments/assets/9a74b736-34c4-4116-97c6-f465e23d3f93

Voor sommige kopjes is die tweede laag nog niet helemaal nodig (nu voor 'Github' en 'Anaconda'), maar we kunnen nu wel makkelijk extra cheatsheets toevoegen. Het moet echter niet te complex worden, want dan schieten de cheatsheets weer hun doel voorbij.

[OlivierSwaak]

Verder springt het beeld op en neer elke keer als we naar een nieuwe pagina gaan, omdat het heel even de header inlaadt en vervolgens weer weghaalt. Dit kan visueel een beetje irritant zijn, maar ik weet niet hoe we dit makkelijk kunnen oplossen, we zouden hier eventueel later nog naar kunnen kijken, maar het heeft geen prioriteit.