Public_Projects/Old_Website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

0014

Browse Source
This commit is contained in:
WickedJack99
2022-09-21 11:57:45 +02:00
parent c520008a0c
commit 2a36192acb
5 changed files with 385 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

206
docs/2022/09/20/how-to-create-githubpage.html Normal file
View File

@@ -0,0 +1,206 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>2022-09-20 How to create a static website with Jekyll and deploy it on GitHubPages</title>
<link rel="stylesheet" href="/assets/css/styles.css">
</head>
<body>
<nav>
<a href="/website/index.html" >Home</a>
<a href="/website/about.html" >About</a>
<a href="/website/blog.html" >Blog</a>
</nav>
<h1>2022-09-20 How to create a static website with Jekyll and deploy it on GitHubPages</h1>
<p>20 Sep 2022 - Aaron</p>
<section>
<p>Install <a href="https://git-scm.com/downloads" target="_blank">Git</a></p><br>
</section>
<section>
<p>Install <a href="https://www.ruby-lang.org/en/documentation/installation/" target="_blank">Ruby</a></p><br>
</section>
<section>
<p>
Install Jekyll and Bundler<br>
<code>$ gem install jekyll bundler</code><br>
</p>
</section>
<section>
<p>
<a href="https://github.com/" target="_blank">Create a GitHub-account</a><br>
<a href="https://github.com/new" target="_blank">Create a repository on GitHub</a><br>
(It has to be public if you use GitHub Free, note that your code will be visible to everyone!)<br>
</p>
</section>
<section>
<p>
Clone the repository to a local directory:<br>
<b>SSH</b><br>
<div>
$ git clone --recursive SSH_URL<br>
</div>
<b>HTTPS</b><br>
<div>
$ git -c http.sslVerify=false clone --recursive HTTPS_URL<br>
</div>
</p>
</section>
<section>
<p>
Create two directories: docs and localDev.<br>
<div>
<pre>
$ mkdir docs<br>
<br>
$ mkdir localDev<br>
</pre>
</div>
docs will contain the content of the website later on.<br>
localDev will contain our Jekyll project.<br>
</p>
</section>
<section>
<p>
Move to the localDev-directory:<br>
<div>
<pre>
$ cd localDev<br>
</pre>
</div>
</p>
</section>
<section>
<p>
Create a new Jekyll-project at localDev-directory:<br>
<div>
<pre>
$ jekyll new --skip-bundle .<br>
<br>
(make sure you got the dot)<br>
</pre>
</div>
</p>
</section>
<section>
<p>
Open the Gemfile that Jekyll created and comment out the line which starts with <b>gem "jekyll"</b><br>
Add the github-pages gem by editing the line starting with # gem "github-pages".<br>
Change this line (# gem "github-pages") to:<br>
<b>gem "github-pages", "~> GITHUB-PAGES-VERSION", group: :jekyll_plugins</b><br>
You can find the actual version of GitHub-pages <a href="https://rubygems.org/gems/github-pages" target="_blank">here</a><br>.
Now save and close the Gemfile.<br>
</p>
</section>
<section>
<p>
Now still being at the localDev-directory, install the bundle:<br>
<div>
<pre>
$ bundle install<br>
</pre>
</div>
Optionally you can make changes at the <b>_config.yml</b> file.<br>
</p>
</section>
<section>
<p>
Follow <a href="https://jekyllrb.com/docs/step-by-step/01-setup/#create-a-site" target="_blank">this</a> guide to learn Jekyll. Make sure that all files and directories you create are in the localDev-directory.<br>
Note that building locally will not work according to commenting out gem "Jekyll" at the Gemfile. (Atm I didn't check if you can let it in and bundle install to allow local building)<br>
</p>
</section>
<section>
<p>
After creating all necessary files and dirs, you can make a production build:<br>
Note that all files at _site will be cleared!
<div>
<pre>
$ JEKYLL_ENV=production bundle exec jekyll build<br>
</pre>
</div>
Your Jekyll-project was now build and stored at _site.<br>
Now move the content of the localDev/_site to docs:<br>
<div>
<pre>
$ mv /localDev/_site docs<br>
</pre>
</div>
And push your changes to your central GitHub-Repository:<br>
<div>
<pre>
</pre>
</div>
</p>
</section>
<section>
<p>
Now <a href="https://github.com/WickedJack99/website/settings/pages" target="_blank">publish your repository on GitHub Pages</a>.<br>
Select your <b>branch</b> and as <b>folder /docs</b> and hit Save.<br>
Now you have to wait, this can take up to 10 minutes.<br>
On the top of the page a box will appear with the url of your website.<br>
</p>
<h3>Happy developing!</h3>
</section>
<section>
<p>
Sources:<br>
<ul>
<li><a href="https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/creating-a-github-pages-site-with-jekyll" target="_blank">https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/creating-a-github-pages-site-with-jekyll</a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="https://jekyllrb.com/docs/structure/" target="_blank">https://jekyllrb.com/docs/structure/</a></li>
<li><a href="https://jekyllrb.com/docs/step-by-step/01-setup/" target="_blank">https://jekyllrb.com/docs/step-by-step/01-setup/</a></li>
<li><a href="https://jekyllrb.com/docs/step-by-step/10-deployment/" target="_blank">https://jekyllrb.com/docs/step-by-step/10-deployment/</a></li>
</ul>
</p>
https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/testing-your-github-pages-site-locally-with-jekyll
https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/creating-a-github-pages-site-with-jekyll
https://docs.github.com/en/get-started/quickstart/set-up-git
https://docs.github.com/en/pages/quickstart
https://github.com/WickedJack99/website/settings/pages
https://wickedjack99.github.io/website/2022/09/20/jekyll_&_github.html
https://nav.hs-offenburg.de/pflichtnavi/erklaerung-zur-barrierefreiheit
https://duckduckgo.com/?q=german+english&t=newext&atb=v330-1&ia=web
https://www.markdownguide.org/basic-syntax
https://www.w3schools.com/html/default.asp
https://www.w3schools.com/html/tryit.asp?filename=tryhtml_figcaption
https://www.w3schools.com/html/tryit.asp?filename=tryhtml5_section
</section>
<nav>
<a href="/website/terms.html" >Terms</a>
<a href="/website/privacy.html" >Privacy</a>
<a href="/website/blog.html" >Blog</a>
<a href="/website/imprint.html" >Imprint</a>
</nav>
</body>
</html>

4
docs/blog.html
View File

@@ -19,6 +19,10 @@
<ul>
<li>
<h3><a href="/website/2022/09/20/how-to-create-githubpage.html">2022-09-20 How to create a static website with Jekyll and deploy it on GitHubPages</a></h3>
</li>
</ul>
<nav>

174
docs/feed.xml
View File

@@ -1 +1,173 @@
<?xml version="1.0" encoding="utf-8"?><feed xmlns="http://www.w3.org/2005/Atom" ><generator uri="https://jekyllrb.com/" version="3.9.2">Jekyll</generator><link href="/feed.xml" rel="self" type="application/atom+xml" /><link href="/" rel="alternate" type="text/html" /><updated>2022-09-21T11:49:25+02:00</updated><id>/feed.xml</id><title type="html">Mr.</title><subtitle>Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.</subtitle></feed>
<?xml version="1.0" encoding="utf-8"?><feed xmlns="http://www.w3.org/2005/Atom" ><generator uri="https://jekyllrb.com/" version="3.9.2">Jekyll</generator><link href="/feed.xml" rel="self" type="application/atom+xml" /><link href="/" rel="alternate" type="text/html" /><updated>2022-09-21T11:56:56+02:00</updated><id>/feed.xml</id><title type="html">Mr.</title><subtitle>Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.</subtitle><entry><title type="html">2022-09-20 How to create a static website with Jekyll and deploy it on GitHubPages</title><link href="/2022/09/20/how-to-create-githubpage.html" rel="alternate" type="text/html" title="2022-09-20 How to create a static website with Jekyll and deploy it on GitHubPages" /><published>2022-09-20T00:00:00+02:00</published><updated>2022-09-20T00:00:00+02:00</updated><id>/2022/09/20/how-to-create-githubpage</id><content type="html" xml:base="/2022/09/20/how-to-create-githubpage.html">&lt;section&gt;
&lt;p&gt;Install &lt;a href=&quot;https://git-scm.com/downloads&quot; target=&quot;_blank&quot;&gt;Git&lt;/a&gt;&lt;/p&gt;&lt;br&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;Install &lt;a href=&quot;https://www.ruby-lang.org/en/documentation/installation/&quot; target=&quot;_blank&quot;&gt;Ruby&lt;/a&gt;&lt;/p&gt;&lt;br&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;
Install Jekyll and Bundler&lt;br&gt;
&lt;code&gt;$ gem install jekyll bundler&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;
&lt;a href=&quot;https://github.com/&quot; target=&quot;_blank&quot;&gt;Create a GitHub-account&lt;/a&gt;&lt;br&gt;
&lt;a href=&quot;https://github.com/new&quot; target=&quot;_blank&quot;&gt;Create a repository on GitHub&lt;/a&gt;&lt;br&gt;
(It has to be public if you use GitHub Free, note that your code will be visible to everyone!)&lt;br&gt;
&lt;/p&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;
Clone the repository to a local directory:&lt;br&gt;
&lt;b&gt;SSH&lt;/b&gt;&lt;br&gt;
&lt;div&gt;
$ git clone --recursive SSH_URL&lt;br&gt;
&lt;/div&gt;
&lt;b&gt;HTTPS&lt;/b&gt;&lt;br&gt;
&lt;div&gt;
$ git -c http.sslVerify=false clone --recursive HTTPS_URL&lt;br&gt;
&lt;/div&gt;
&lt;/p&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;
Create two directories: docs and localDev.&lt;br&gt;
&lt;div&gt;
&lt;pre&gt;
$ mkdir docs&lt;br&gt;
&lt;br&gt;
$ mkdir localDev&lt;br&gt;
&lt;/pre&gt;
&lt;/div&gt;
docs will contain the content of the website later on.&lt;br&gt;
localDev will contain our Jekyll project.&lt;br&gt;
&lt;/p&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;
Move to the localDev-directory:&lt;br&gt;
&lt;div&gt;
&lt;pre&gt;
$ cd localDev&lt;br&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;/p&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;
Create a new Jekyll-project at localDev-directory:&lt;br&gt;
&lt;div&gt;
&lt;pre&gt;
$ jekyll new --skip-bundle .&lt;br&gt;
&lt;br&gt;
(make sure you got the dot)&lt;br&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;/p&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;
Open the Gemfile that Jekyll created and comment out the line which starts with &lt;b&gt;gem &quot;jekyll&quot;&lt;/b&gt;&lt;br&gt;
Add the github-pages gem by editing the line starting with # gem &quot;github-pages&quot;.&lt;br&gt;
Change this line (# gem &quot;github-pages&quot;) to:&lt;br&gt;
&lt;b&gt;gem &quot;github-pages&quot;, &quot;~&gt; GITHUB-PAGES-VERSION&quot;, group: :jekyll_plugins&lt;/b&gt;&lt;br&gt;
You can find the actual version of GitHub-pages &lt;a href=&quot;https://rubygems.org/gems/github-pages&quot; target=&quot;_blank&quot;&gt;here&lt;/a&gt;&lt;br&gt;.
Now save and close the Gemfile.&lt;br&gt;
&lt;/p&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;
Now still being at the localDev-directory, install the bundle:&lt;br&gt;
&lt;div&gt;
&lt;pre&gt;
$ bundle install&lt;br&gt;
&lt;/pre&gt;
&lt;/div&gt;
Optionally you can make changes at the &lt;b&gt;_config.yml&lt;/b&gt; file.&lt;br&gt;
&lt;/p&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;
Follow &lt;a href=&quot;https://jekyllrb.com/docs/step-by-step/01-setup/#create-a-site&quot; target=&quot;_blank&quot;&gt;this&lt;/a&gt; guide to learn Jekyll. Make sure that all files and directories you create are in the localDev-directory.&lt;br&gt;
Note that building locally will not work according to commenting out gem &quot;Jekyll&quot; at the Gemfile. (Atm I didn&apos;t check if you can let it in and bundle install to allow local building)&lt;br&gt;
&lt;/p&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;
After creating all necessary files and dirs, you can make a production build:&lt;br&gt;
Note that all files at _site will be cleared!
&lt;div&gt;
&lt;pre&gt;
$ JEKYLL_ENV=production bundle exec jekyll build&lt;br&gt;
&lt;/pre&gt;
&lt;/div&gt;
Your Jekyll-project was now build and stored at _site.&lt;br&gt;
Now move the content of the localDev/_site to docs:&lt;br&gt;
&lt;div&gt;
&lt;pre&gt;
$ mv /localDev/_site docs&lt;br&gt;
&lt;/pre&gt;
&lt;/div&gt;
And push your changes to your central GitHub-Repository:&lt;br&gt;
&lt;div&gt;
&lt;pre&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;/p&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;
Now &lt;a href=&quot;https://github.com/WickedJack99/website/settings/pages&quot; target=&quot;_blank&quot;&gt;publish your repository on GitHub Pages&lt;/a&gt;.&lt;br&gt;
Select your &lt;b&gt;branch&lt;/b&gt; and as &lt;b&gt;folder /docs&lt;/b&gt; and hit Save.&lt;br&gt;
Now you have to wait, this can take up to 10 minutes.&lt;br&gt;
On the top of the page a box will appear with the url of your website.&lt;br&gt;
&lt;/p&gt;
&lt;h3&gt;Happy developing!&lt;/h3&gt;
&lt;/section&gt;
&lt;section&gt;
&lt;p&gt;
Sources:&lt;br&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/creating-a-github-pages-site-with-jekyll&quot; target=&quot;_blank&quot;&gt;https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/creating-a-github-pages-site-with-jekyll&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot; target=&quot;_blank&quot;&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot; target=&quot;_blank&quot;&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot; target=&quot;_blank&quot;&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot; target=&quot;_blank&quot;&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot; target=&quot;_blank&quot;&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;&quot; target=&quot;_blank&quot;&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://jekyllrb.com/docs/structure/&quot; target=&quot;_blank&quot;&gt;https://jekyllrb.com/docs/structure/&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://jekyllrb.com/docs/step-by-step/01-setup/&quot; target=&quot;_blank&quot;&gt;https://jekyllrb.com/docs/step-by-step/01-setup/&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://jekyllrb.com/docs/step-by-step/10-deployment/&quot; target=&quot;_blank&quot;&gt;https://jekyllrb.com/docs/step-by-step/10-deployment/&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/p&gt;
https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/testing-your-github-pages-site-locally-with-jekyll
https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/creating-a-github-pages-site-with-jekyll
https://docs.github.com/en/get-started/quickstart/set-up-git
https://docs.github.com/en/pages/quickstart
https://github.com/WickedJack99/website/settings/pages
https://wickedjack99.github.io/website/2022/09/20/jekyll_&amp;_github.html
https://nav.hs-offenburg.de/pflichtnavi/erklaerung-zur-barrierefreiheit
https://duckduckgo.com/?q=german+english&amp;t=newext&amp;atb=v330-1&amp;ia=web
https://www.markdownguide.org/basic-syntax
https://www.w3schools.com/html/default.asp
https://www.w3schools.com/html/tryit.asp?filename=tryhtml_figcaption
https://www.w3schools.com/html/tryit.asp?filename=tryhtml5_section
&lt;/section&gt;</content><author><name>Aaron</name></author><summary type="html">Install Git</summary></entry></feed>