Skip to content

Hvordan sette opp utviklingsmiljø

Kajrakso edited this page Nov 9, 2023 · 14 revisions

Hvordan komme i gang med nablaweb

[TOC]

Troubleshooting: Hopp til seksjon.

For å komme i gang med å gjøre nablaweb enda bedre må du få satt opp utviklingsmiljøet ditt. Her kommer en rask guide for å gjøre det.

Du trenger en datamaskin med følgende installert:

  • git
  • python 3.9
  • pip Inkludert når du installerer python fra python.org (vanligst på Windows og Mac).
  • pipenv Installeres med pip: python3.9 -m pip install pipenv)
  • npm På windows lastes det ned sammen med node.js. På Mac og Linux bør du bruke en package manager (f.eks. apt for Ubuntu eller brew på Mac, sudo apt install npm).

Disse kommandoene må ligge i %PATH%.

For å påse at dette er riktig installert kan du kjøre

git --version
python --version
pip --version
pipenv --version
npm --version

Alle kommandoer du ser fra nå av skal skrives inn i terminalen på den maskinen du jobber på.

Last ned nablaweb

Hvis du ikke allerede har lastet ned koden, går du til en mappe (via terminalen) du ønsker å laste ned nettsiden i. Denne mappa kan ikke ligge i en sti med mellomrom eller rare tegn, da venv ikke liker mellomrom og pip ikke liker rare tegn, så unngå stier som /home/usr/∇ projects/nablaweb. Herfra kan du kjøre følgende git-kommando:

#!bash

git clone https://github.com/NablaWebkom/nablaweb.git

Det skal nå ha dukket opp en mappe som heter nablaweb i den mappen du står i.

Gå nå inn i nablaweb-mappa du akkurat laget ved å skrive

#!bash
cd nablaweb

Hvis man nå kjører ls (eller dir) skal man få opp en liste med filer og mapper i nablaweb, blant disse er

  • manage.py
  • Pipfile
  • Pipfile.lock

Hvis du ikke ser disse, så er du i feil mappe.

Sette opp pipenv og installere nødvendige pakker

Vi bruker pipenv for å holde styr på python-pakker og virtualenv, du kan lese mer om pipenv her.

For å installere python-pakkene vi bruker, kjør:

#!bash
pipenv sync --dev

pipenv sync vil installere alle pakkene spessifisert i Pipfile.lock til en mappe et eller annet sted i hjemmeområdet ditt (vi bryr oss ikke om hvor).

Dette trenger du bare gjøre første gang man setter opp nablaweb eller hvis noen har endret Pipfile.lock.

For å kjøre komandoer trenger du nå bare skrive

#!bash
pipenv run [command]

der [command] er det du vil kjøre. For å slippe å måtte skrive pipenv run hver gang, kan man også 'aktivere' virtualenvironmenten, det gjøres ved å skrive

#!bash
pipenv shell

OBS! Dette fungerer ikke i git-bash (her kan man alternativt bruke pipenv run [command]-metoden). Det anbefales derfor å bruke enten cmd, powershell, cmder i Windows, eller tilsvarende på Linux/Mac.

Resten av denne siden vil forutsette at pipenv shell-kommandoen har blitt kjørt.

Installere pre-commit hooks

Vi formaterer koden vår med black og isort, og sjekker kodekvalitet med flake8. For å slippe å gjøre dette manuelt hver gang du commiter kan du installere pre-commit hooks som gjør det for deg. Disse formaterer koden du committer, og sier eventuelt ifra om eventuelle feil fra flake8.

pre-commit install

Om linterene klager på github, men ikke lokalt, kan det hende at de kjører forskjellige versjoner. For å oppdatere versjonene som kjøres lokalt med pre-commit bruk:

pre-commit autoupdate

MERK: pipenv og pre-commit har uavhengige versjoner av alle linterene.

Installere frontend pakker via npm

Nablaweb bruker noen frontend-pakker, bl.a jQuery. Disse installeres ved å kjøre

#!bash
npm install

mens du står i samme mappe som fila package.json

Sett opp database

Vanligvis kjører nablasiden på en MariaDB-database, men for utvikling bruker vi sqlite3. For å lage en database og sette opp alle tabeller og felt må du migrere. Dette gjør du ved å kjøre kommandoen:

#!bash
python manage.py migrate

Hvis alt gikk fint skal det nå ha dukket opp en ny fil kalt var/sqlite.db.

Kjøre nettsiden

For å kjøre nettsiden bruker du denne kommandoen:

#!bash
python manage.py runserver

Hvis runserver fungerte så skal utviklingstjeneren kjøre og en versjon av nablaweb være tilgjengelig på

http://127.0.0.1:8000

Det går også ann å kjøre webtjeneren på en annen port ved å kjøre

#!bash
python manage.py runserver 127.0.0.1:PORT

hvor PORT byttes ut med et tall mellom 1024 og 65535.

Lorem ipsum mm.

Om du vil fylle opp nettsiden med eksempelinnhold (kan være greit for å teste åssen ting fungerer), kan du skrive

#!bash
python manage.py seed

Dette vil også lage en administrator-bruker med brukernavn admin og passord admin.

Extra for Ubuntu

I noen linux-distribusjoner må du også installere noen pakkenr:

#!bash

sudo apt install libjpeg-dev zlib1g-dev

ImageMagick for Nabladet

Nablad-appen trenger ImageMagick for å håndtere pdfene som blir lastet opp. Dette gjøres ved hjelp av Wand pakken til Python, men man trenger fortsatt å installere ImageMagick for at dette skal fungere. Hvilken versjon som man bruker er tydeligvis litt sensitivt, men sist dette fungerte på Windows 64-bit (25. mars 2019), så ble følgende versjoner brukt:

  • ImageMagick-6.9.3-2-Q8-x64-dll
  • Ghostscript 9.26 for Windows (64 bit)
  • Wand==0.4.5

Miljøvariablen MAGICK_HOME måtte også settes til installasjonsmappen til ImageMagick. For Mac og Linux må man nok gjøre noe annet, Google er din venn.

For å teste at dette fungerer, kjør python manage.py test nablapps/nabladet

Ferdig oppsatt miljø

Neste gang du skal jobbe med nablaweb trenger du bare å kjøre pipenv shell og python manage.py runserver fra nablaweb-mappa. Husk også å kjøre git pull og pipenv sync regelmessig, slik at du får med deg de siste oppdateringene.

Happy coding!

Troubleshooting

Siden ser "rar" ut.

Det er trolig noe rart med bootstrap eller CSS.

  1. Ctrl-shift-R i nettleser. Refresher alt, og sletter cache (lagrede filer). Kan også prøve å slette cache i nettleser manuelt.
  2. I nablaweb-mappen din: npm install.
  3. I nablaweb-mappen din: pipenv sync.
  4. I nablaweb-mappen din: pipenv run python manage.py collectstatic. (Har trolig ikke noe å si, men mulig å prøve).
  5. Prøv private browser. Hvis dette fungerer, prøv å slette cache i nettleseren din. Chrome
  6. Gråt