OrgPad logo

Hollarka - kostra webové aplikace pro závěrečnou práci

Created by Jiří Kofránek

Hollarka - kostra webové aplikace pro závěrečnou práci

Struktura kostry aplikace

image

Instalace programu ve Vue

Volba struktury aplikace

Vyčištění od zbytečností

Kostra webu závěrečné práce

UKÁZKOVÁ APLIKACE PRO KOSTRU WEBU ZÁVĚREČNÉ PRÁCE:

odkaz na aplikaci "Metabolismus železa":

https://egolem.online/ironmetabolism/#iron1intake.md

odkaz soubor data.json:

https://docs.google.com/document/d/1XlTM0QIZjWzADpJEPpxEkqF_jSQgCIsZfdJVpP1Ffgs/edit?usp=sharing

odkaz na git.hub se zdrojovým textem programu

https://github.com/kofranek/Kostra

distribuovatelná aplikace je na adrese:

https://hollarka.github.io/kostra_distribuce/

Vytvoření odkazu na aplikaci "metabolismus železa"

Router

Zdrojový kód zazipovaný

Kostra-main.zip

Naklonování a otestování hotové aplikace z githubu

Vytvoření komponenty ukázek

Dokončení vytvoření kostry ukázkové aplikace

Videonávod

Vytvoření distribuované aplikace na github pages

1. Nejprve vytvořte své nové repository na githubu

např.: kostra_distribuce

2.  Zjistěte, jestli nejste náhodou už připojeni k jinému vzdálenému repository na githubu, pokud ano, odpojte se

Připojení k repositoriu na githubu zjistíte tak, že napíšete:

git remote -v

pokud vám odpoví :

origin htpps://github.com/…zbytek adresy odkazu (fetch)

origin htpps://github.com/…zbytek adresy odkazu(push)

pak odpojte spojení pomocí příkazu

git remote rm origin

3. Ve své aplikaci v terminálu napište postupně příkazy

git init

git add .

git commit -m "first commit"

git branch -M main

git remote add origin odkaz na nové repository například

git remote add origin https://github.com/Hollarka/kostra_distribuce.git

git push -u origin main

do nového repository se načtou všechny složky a soubory z vaší aplikace

 

4. V souboru vite.config.js doplňte položku base: '/názvem vašeho projektu/' například

export default defineConfig({

base: '/kostra_distibuce/',

plugins: [vue()]

})

 

5. Vytvořte spustitelnou aplikace npm run build

ve složce dist se vytvoří hotová aplikace

 

6. Doplňte složku dist do vašeho repository - v terminálu zadejte postupně příkazy

git add dist -f

git commit -m "adding dist" 

git subtree push --prefix dist origin gh-pages

 

7. Ve své repository naleznete větev gh-pages

v horním menu vaší repository zvolte položku Settings

a v levém menu položku Pages

ukáže se  záhlavi GitHub Pagees a adresa spustitelné distribuované aplikace, např:

Your site is live at  

https://hollarka.github.io/kostra_distribuce/

How to deploy your Vite App to Githup Pages