Build, bundle és deploy
Build, bundle és deploy: mi történik a forráskóddal production előtt, mit optimalizál a bundler, és mit jelent valójában egy webalkalmazás telepítése?
Röviden
A build a forráskód productionre előkészítésének folyamata: fordítás/transzformáció, modulok feldolgozása, asset optimalizálás, route generálás és framework-specifikus output készítése történhet. A bundle ennek egyik eredménye, nem maga a teljes deployment.
Mit jelent a build, bundle és deploy?
A build a forráskód productionre előkészítésének folyamata: fordítás/transzformáció, modulok feldolgozása, asset optimalizálás, route generálás és framework-specifikus output készítése történhet. A bundle ennek egyik eredménye, nem maga a teljes deployment.
Forrástól productionig
01
Git
02
Build
03
Bundle/output
04
Deploy
05
CDN/runtime
Hogyan működik a gyakorlatban?
Deploykor a build output a futtatási környezetbe kerül: statikus fájlok CDN-re, szerverfunkciók runtime-ba, konfiguráció és environment variable pedig a célkörnyezethez kapcsolódik. A CI/CD ezt ismételhető folyamattá teszi.
- Source map segíthet hibakeresésben, de érzékeny forráskezelési döntés is.
- Tree shaking csak megfelelő modulstruktúrával tud felesleges kódot kivenni.
- Code splitting csökkentheti a kezdeti klienscsomagot.
- Preview környezet production előtti ellenőrzést tesz lehetővé.
Gyakorlati fejlesztői szemlélet
Buildhibát és runtime hibát külön kezeld. Ha a build sikerült, attól production még elbukhat rossz env változó, adatbázis kapcsolat, jogosultság vagy külső API miatt; ezért kell smoke test és monitoring is.
Gyakori hibák és félreértések
- A deployt egyszerű fájlfeltöltésnek tekinteni minden modern appnál.
- Production secretet build logba írni.
- Bundle méretet egyetlen globális számmal értékelni route-szintű bontás nélkül.
Források és szabványok
A technikai részletekhez elsődleges szabványokat és karbantartott hivatalos dokumentációt használok. Frameworkök, böngészők és webes API-k idővel változhatnak, ezért implementálás előtt mindig ellenőrizd az aktuális dokumentációt is.
Kapcsolódó ByBence Academy