Jak założyć bloga korzystając z Hexo?
Mam kolegę Czarka, który uczy się programowania. Spotykamy się czasami na Hangout, aby pogadać o kodzie. Poleciłem Czarkowi, aby pisał daily raporty z przebiegu swojej nauki. Ważne jest, aby on sam widział po miesiącu (kiedy przyjdą PIERWSZE chwile zwątpienia) ile już się nauczył i że nie może się poddać!
Najlepszą formą jest tworzenie notatek i publikacja ich na łamach swojego bloga. Łączy się wtedy dwie rzeczy:
przyjemne - pisanie własnego bloga pożyteczne - archiwizacja stanu nauki, np. dla potomnych / pracodawcyTeraz rodzi się pytanie: Jak szybko postawić bloga? Wordpress?
O jej…
Wordpress to kobyła. Wordpress wymaga bazy danych. Wordpress to nie wersjonuje (np. za pomocą Gita) stanu artykułów. Wordpress posiada panel administracyjny.Alternatywa? Jest ich mnóstwo: Jekyll, Gatsby, Hugo, Hexo.
Jekylla używam od 2-3 lat i jestem z niego bardzo zadowolony. Ten blog, który właśnie czytasz, jest oparty właśnie na Jekyllu.
Napisałem kiedyś bliźniaczy artykuł pt. “Jak założyć bloga korzystając z Jekyll?” o tym jak zbudować bloga w oparciu o inny silnik - Jekyll. Post pochodzi sprzed 3 lat. Zobacz jak przez ten czas rozwinąłem się pod kątem literackim - budowanie zdań itp. Zmieniłem się w ogóle?
Cel :key:W tym artykule chciałbym przedstawić Ci jak szybko - praktycznie od zera - postawić projekt z systemem blogowym (blogiem) oraz go opublikować via GitHub Pages.
:arrow_forward: Kod źródłowy powinien być dostępny pod adresem: github.com/piecioshka/moj-blog/
:arrow_forward: Strona powinna działać pod adresem: piecioshka.github.io/moj-blog/
1/6 Zbudowanie projektu (w oparciu o Hexo)Copy + Paste
npm install -g hexo-cli hexo init moj-blog cd moj-blog npm installWarto przerobić ten projekt na repozytorium Git poprzez wykonanie następujących poleceń:
Copy + Paste
git init git add . git commit -am "Initial import" 2/6 Dodanie postaDodaj jakiś plik (albo edytuj plik hello-world.md) w formacie Markdown do katalogu source/_posts.
WAŻNENie zapomnij wpisać na górze nowo-stworzonego pliku preambuły:
--- title: To jest tytuł mojego artykułu --- 3/6 Konfiguracja projektuNależy zmienić w pliku _config.yml:
title, np. Blog programistyczny author, np. Piotr Kowalski url, np. https://piecioshka.github.io/ root, np. /moj-blog/Wypadało by później utworzyć rewizję z tymi zmianami. Prawda?
Copy + Paste
git commit -am "Setup settings" 4/6 GitHub: Konfiguracja repozytoriumStworzenie repozytorium o nazwie np. moj-blog odwiedzając stronę github.com/new
Ważne!Nie wybieraj żadnego pliku z formatem pliku .gitignore ani z licencją.
“Wypchanie” kodu aplikacji na serwer:
Copy + Paste
git remote add origin [email protected]:piecioshka/moj-blog.git git push -u origin master 5/6 Przygotowanie projektu do publikacjiInstalacja paczki, która wrzuci katalog public/ do brancha gh-pages:
$ npm i gh-pages --save-devDodanie zadania do deploymentu do pliku package.json:
"scripts": { "deploy": "gh-pages -d public/" }Stworzenie rewizji w Git (po dodaniu zadania do deploymentu):
Copy + Paste
git commit -am "Add deploy task" 6/6 Publikacja projektu (via GitHub Pages)“Wypchanie” wszystkich zmian na serwer:
Copy + Paste
git pushZbudowanie STATYCZNEJ wersji bloga w katalogu public/:
UwagaAby wyeliminować wcześniejsze budowania należy uruchomić: Copy + Paste
hexo cleanTeraz można przejść do meritum, czyli do zbudowania statyczne struktury plików HTML, CSS, JavaScript wraz z obrazkami.
Copy + Paste
hexo deploy npm run deploy :tada: Demo :tada:Otwórz stronę piecioshka.github.io/moj-blog/ Twoim oczom powinien ukazać się PUSTY blog wraz z listą artykułów.
JEST TAK? Napisz o tym w komentarzu. NIE JEST TAK? Napisz tym bardziej!
Inne podejście do deploymentuDodane: 2018-06-03
W sieci znalazłem blog autora jednego z moich ulubionych tematów do Hexo - Jonathan Klughertz, który w jednym swoim wpisie pokazał inne podejście do publikacji bloga via GitHub Pages.
Zapraszam do zapoznania się z artykułem pt. Hexo deploy your blog to github pages in one command.
•
Post dedykuję Czarkowi. Powodzenia w blogowaniu!
PS. Zamieszczam link do bloga Cezarego: cezarytworzewski.github.io/blog/
Chcesz więcej? Sprawdź w oryginale!
Przejdź do artykułu