Fyrirlestur — GitHub og Netlify

Vefforritun 1 — TÖL107G

Ólafur Sverrir Kjartansson, osk@hi.is

---

GitHub

• GitHub er stærsti hýsingaraðili Git repoa
• Mjög mjög mörg verkefni hýst á GitHub, bæði open-source og ekki
• Notum GitHub sem sameiginlegan stað sem við geymum repo á

---

GitHub workflow

Þegar við vinnum verkefni á GitHub er flæðið yfirleitt:

1. Clone (eða fork) af repo
2. Gera breytingar í branch
3. Ýta breytingum á GitHub
4. Opna pull request í upprunalega repo
5. Ræða breytingar, laga o.s.fr.
6. merge á breytingum inn í aðal branch repo

---

GitHub repo

• Ef við ætlum að búa til verkefni á GitHub, búum við til nýtt repository
  • Gefum því nafn
  • Bjóðum öðrum til að vinna með okkur og stillum réttindi, t.d. mega gera breytingar á main branch
• Ýtum kóða á GitHub
  • Útbúum README.md skjal sem lýsir um hvað verkefnið okkar snýst

---

Clone

• Getum clone’að repo frá github auðveldlega, finnum slóð á GitHub
  • git clone https://github.com/vefforritun/vef1-2021.git
• Ef við höfum aðgang getum við síðan ýtt aftur breytingum á repo

---

Fork

• Fork útbýr afrit af repo á okkar GitHub account
• Höfum leyfi til að gera breytingar á okkar afriti
• Getum síðan útbúið pull request á upprunalega repo með okkar breytingum

---

Netlify

• „Netlify is an all-in-one platform for automating modern web projects.“
• Í grunninn hýsing fyrir static vefi
  • Vefir sem hafa ekki „bakenda“
• Samt með stuðning fyrir serverless Lambda functions

---

Netlify hýsing

• Búum til aðgang og staðfestum gegnum tölvupóst
• Skráum okkur inn, förum í build, veljum new site from git
• Tengjum við GitHub (getum líka uploadað folder)
• Deployum!

---

Continuous Deployment

• Alltaf þegar nýtt commit kemur inn á main (eða skilgreint branch to deploy):
  • build keyrt
  • skrár í Publish directory gerðar aðgengilegar fyrir site
• Ef allt virkar, ný útgáfa gerð aðgengileg strax
• Getum farið fram og til baka í útgáfum

---

• Þurfum að geta sett allt sem á að birta í eina möppu
• Bætum við tóli sem leyfir okkur að afrita skrár, t.d. cpy-cli
• Bætum við build script sem buildar Sass og færir .html  skrár í möppu, t.d. build/ eða dist/

---

"sass-build": "sass styles.scss ./build/styles.css",
"copy": "cpy ./*.html ./build/",
"build": "concurrently npm:sass-build npm:copy"

---

• Viljum engar buildaðar skrár í Git
  • Eru í eðli sínu afleiddar af source skrám
• Bætum við í .gitignore

---

node_modules

# Þýddar skrár fyrir dev
styles.css
styles.css.map

# Þýddar skrár fyrir production build
build

---

Netlify sýnidæmi