Darba sākšana ar Hugo: kā izveidot vienkāršu vietni

Hugo ir statisks vietņu ģenerators, kas ļauj izveidot vietni ar nelielu kodēšanas pieredzi vai bez tās. Varat izmantot iepriekš izveidotus motīvus kā vietnes dizaina pamatu. Tas ļauj vairāk koncentrēties uz vietnes aizpildīšanu ar savu saturu.

Tā kā Hugo galvenokārt izmanto statiskām vietnēm, tas ir lieliski piemērots emuāru, portfeļu vai dokumentācijas vietņu izveidei.

Varat viegli iestatīt un izveidot Hugo vietni, izmantojot iepriekš izveidotu Hugo motīvu. Veicot tikai dažas īsas darbības, varat savai vietnei pievienot saturu un lapas, izmantojot Markdown.

Kā instalēt Hugo

Jums ir jāinstalē Hugo statisko vietņu ģenerators lai izveidotu, palaistu un pārbaudītu Hugo vietni. Saskaņā ar Hugo dokumentācija, to var instalēt daudzos veidos. Tālāk ir norādītas dažas no iespējām.

Mac

Varat instalēt Hugo, izmantojot Homebrew.

1. Atveriet savu macOS termināli.
2. Instalējiet Homebrew pakotņu pārvaldnieku.

   /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

3. Instalējiet Hugo.

   brūvēt uzstādīt hugo

Windows

Jums būs nepieciešams līdzvērtīgs pakotņu pārvaldnieks operētājsistēmai Windows. Piemēram, varat izmantot Scoop pakotņu pārvaldnieks.

1. Atveriet programmu Windows PowerShell, kurai jau vajadzētu būt daļai no jūsu Windows operētājsistēmas.
2. Ja instalējat Scoop pirmo reizi, iespējams, būs jāiestata izpildes politika.

   Iestatīt-Izpildes politika RemoteSigned -darbības jomu Pašreizējais lietotājs

3. Instalējiet Scoop:

   iex (jauns-object net.webclient).downloadstring('https://get.scoop.sh')
   

4. Instalējiet Hugo:

   liekšķere uzstādīt hugo

Kā izveidot Hugo projektu

Lai izveidotu jaunu Hugo projektu, jums būs jāizmanto iebūvētais hugo jauna vietne komandu.

1. Atveriet savu termināli vai komandu uzvedni. Dodieties uz mapi, kurā vēlaties izveidot savu projektu.
2. Izpildiet hugo jauna vietne komanda:

   hugo jauns vietne jauns-hugo vietne

3. Failu pārlūkā dodieties uz sava Hugo projekta atrašanās vietu.
4. Atveriet projekta mapi. Jūs redzēsit, ka jūsu jaunajā Hugo vietnē ir faila un mapju struktūra, kas nepieciešama, lai jūsu vietne darbotos.

Kā pievienot motīvu

Pašlaik jūsu projektā ir tikai galvenās Hugo projekta bāzes mapes. Ja vietne darbotos lokāli, šajā brīdī tiktu rādīts tikai tukšs ekrāns. Tā kā jūsu vietnei vēl nav iestatīts neviens HTML, CSS vai lietotāja interfeisa dizains, jums tie būs jāpievieno.

Hugo jau nodrošina iebūvēto bibliotēku Hugo tēmas ko izveidojuši izstrādātāji.

1. Izvēlieties motīvu, kas jums patīk. Katrai tēmai var būt nedaudz atšķirīgas iestatīšanas instrukcijas, kas parādītas attiecīgajā priekšskatījuma lapā. Šajā apmācībā tiks izmantots Pasaku tēma kā piemērs.
2. Pārejiet uz sava projekta saknes mapi terminālī vai komandrindā.

   cd jauns-hugo vietne

3. Palaidiet komandu, lai pievienotu motīvu Tale. Motīvu var pievienot kā apakšmoduli, kas izveidos jaunu mapi ar nosaukumu pasaka iekšpusē tēma mapi.

   git init
   git apakšmodulis pievienojiet https://github.com/EmielH/tale-hugo.git themes/tale

   Varat arī klonēt GitHub stāstu krātuvi sava projekta motīvu mapē.

   git klons https://github.com/EmielH/tale-hugo.git themes/tale

4. Pārejiet uz savu projekta mapi. Noklikšķiniet uz tēmas mapi, lai to atvērtu. Neatkarīgi no tā, kuru komandu izmantojāt, būs jauna pasaka mapi, kurā tiek saglabāts tikko lejupielādētais motīvs.
5. Iekš config.toml failu, pievienojiet pasakas motīvu kā daļu no konfigurācijas. Tas liks Hugo izmantot HTML, CSS un citus stilus, kas ietverti motīvā Tale.

   tēma = "pasaka"

Kā savai vietnei pievienot lapas

Jūs varat rakstīt savu saturu jebkurā formātā, ko Hugo pieņem. Pēc tam Hugo automātiski pārveidos jūsu failus HTML failos, kad tie tiek rādīti lietotājam. Tas ļauj ātri izveidot un izvietot. Šis piemērs tiks izmantots Markdown, vienkārša vienkārša teksta valoda, kā jūsu satura formātu.

Varat rakstīt Markdown galvenokārt vienkāršā angļu valodā ar dažiem pievienotiem simboliem, lai norādītu jebkādu formatējumu. Tas ietver simbolu pievienošanu, lai attēlotu virsrakstus, kuri vārdi ir treknrakstā, vai jebkuru citu pamata formatējumu, kas jums var būt nepieciešams.

Lai savai vietnei pievienotu jaunu apakšlapu vai ziņu, jums būs jāpievieno jauns Markdown fails saturu mapi. Katrai ziņai vai lapai būs ar to saistīts savs Markdown fails.

1. Atveriet saturu mapi savā Hugo projektā. Izveidojiet jaunu Markdown failu ar nosaukumu myFirstPost.md.
2. Atveriet failu jebkurā teksta redaktorā, piemēram, Notepad++ vai Visual Studio Code.
3. Faila augšdaļā pievienojiet dažus metadatus. Tajā būs iekļauta svarīga informācija par ziņu. Motīvs, kuru izmantojat, šo informāciju formatēs noteiktā veidā lapā.

   
   autors: "Tavs vārds"
   virsraksts: "Mans pirmais ieraksts"
   datums: "2022-05-17"
   

4. Kad esat pievienojis metadatus, varat sākt pievienot saturu, izmantojot Markdown.

   Šis ir mans pats pirmais ieraksts manā Hugo vietnē!
   Tiek izmantota Hugo tēma priekššis vietni sauc Tale.
   Tas ir ļoti vienkārši uzstādāms un konfigurēt.
   # Apakšvirsraksts
   Šis ir kāds saturs.
   # Vēl viens apakšvirsraksts
   Šis ir vairāk satura.

5. Jūtieties brīvi pievienot citus atzīmes failus, lai savai vietnei pievienotu vairāk lapu.

Kā lokāli palaist un pārbaudīt savu Hugo vietni

Lai palaistu vietni, izmantojiet hugo kalpo komandu.

1. Atveriet termināli vai komandrindu.
2. Dodieties uz sava Hugo projekta saknes mapi.
3. Palaidiet hugo kalpo komanda:

   hugo kalpo

4. Pagaidiet, līdz vietne pabeigs startēšanas procesu. Kad tas būs pabeigts, terminālis izdrukās ziņojumu, kurā norādīts, no kuras vietējās adreses varat piekļūt vietnei. Parasti tas ir http://localhost: 1313/.
5. Atveriet tīmekļa pārlūkprogrammu un ievadiet http://localhost: 1313/vai jebkuru adresi, kuru terminālis jums sniedza. Jūs redzēsit savas Hugo vietnes galveno lapu.
6. Lapā būs ziņu saraksts katram jūsu rīcībā esošajam atzīmes failam. Šajā gadījumā ir divi atzīmes faili, kas aizpildīti ar saturu. Tas ietver lapu myFirstPost.md, kuru izveidojāt iepriekš. Tajā ir arī jauna ziņa ar nosaukumu bananaCakeRecipe.md.
7. Noklikšķiniet uz virsraksta saites vienā no priekšskatījumiem. Tas aizvedīs uz visu konkrētās ziņas lapu.

Jūsu Hugo vietnes mitināšana

Statiskas vietnes izveide un darbība ar Hugo ir vienkārša un ātra. Varat izmantot un konfigurēt iepriekš izveidotos motīvus un palaist savu Hugo vietni lokāli testēšanai. Varat arī savai vietnei pievienot satura lapas, izmantojot Markdown.

Kad esat izveidojis savu Hugo vietni, varat sākt uzzināt vairāk par tās mitināšanu. Ir pieejamas daudzas bezmaksas vietņu mitināšanas iespējas, piemēram, Dropbox, Google disks vai OneDrive.

Kā iegūt bezmaksas vietnes mitināšanu, izmantojot Dropbox, Google disku vai OneDrive

Lasiet Tālāk