介绍
如果你想快速建立一个静态的网站或博客,Jekyll可能是一个很好的解决方案。一个开源的静态网站生成器写在Ruby中,Jekyll允许快速执行指令,帮助管理你的网站从初始到生产部署,从你的命令行。Jekyll是博客意识,优先考虑类别,帖子和布局,有各种可用的导入器来导入以前的博客内容。
在本教程中,我们将安装一个Jekyll开发网站在Ubuntu 18.04上,具有自动生成的内容. 随着Jekyll安装,您将能够使用标记文件和几个Jekyll命令创建个人网站或博客。
前提条件
要遵循本教程,您将需要:
- ** 具有 sudo 特权的非 root 用户的 Ubuntu 18.04 服务器**:您可以在我们的 Ubuntu 18.04 初始服务器设置指南中了解有关如何设置具有这些特权的用户的更多信息。
一旦您完成了此前提条件,您就可以安装 Jekyll 及其依赖。
步骤1:安装Jekyll
我们将首先更新我们的包列表,以确保我们有最新版本的包和其依赖的信息:
1sudo apt update
接下来,让我们安装制造
和构建必不可少
以便Jekyll的库将编译,以及用于Ruby及其开发库。
1sudo apt -y install make build-essential ruby ruby-dev
当完成时,让我们将两个行添加到我们的 .bashrc
文件中,告诉 Ruby 的 gem
包管理器将宝石放入用户的主文件夹中,从而避免在整个系统安装中出现的问题,同时还将本地 jekyll
命令添加到用户的 PATH
。
使用您选择的编辑器打开 .bashrc
,例如 nano:
1nano .bashrc
在文件的底部,添加以下行:
1[label .bashrc]
2# Ruby exports
3
4export GEM_HOME=$HOME/gems
5export PATH=$HOME/gems/bin:$PATH
保存和关闭文件. 若要激活导出,请执行以下操作:
1source ~/.bashrc
当完成时,我们将使用珠宝
来安装Jekyll本身以及管理珠宝依赖的Bundler。
1gem install jekyll bundler
接下来,我们将确保我们的防火墙设置允许流量到达和从Jekyll的开发Web服务器。
第2步:打开防火墙
让我们检查防火墙是否已启用,如果是这样,我们将确保我们网站的流量被允许,以便我们可以在网页浏览器中查看我们的开发网站。
1sudo ufw status
如果您遇到显示不活跃
的状态,请运行以下命令。
1ufw allow OpenSSH
2sudo ufw enable
这将使您的防火墙在系统启动时运行,您可能会收到以下提示(用y
确认继续):
1Command may disrupt existing ssh connections. Proceed with operation (y|n)? y
2Firewall is active and enabled on system startup
在我们的情况下,只有通过SSH才允许:
1[secondary_label Output]
2Status: active
3To Action From
4-- ------ ----
5OpenSSH ALLOW Anywhere
6OpenSSH (v6) ALLOW Anywhere (v6)
您可能有其他规则或根本没有防火墙规则,这取决于您如何设置防火墙。由于在这种情况下只允许SSH流量,我们需要打开端口4000,这是Jekyll开发服务器的默认端口:
1sudo ufw allow 4000
现在,我们的防火墙规则应该包括以下内容:
1[secondary_label Output]
2To Action From
3-- ------ ----
4OpenSSH ALLOW Anywhere
54000 ALLOW Anywhere
6OpenSSH (v6) ALLOW Anywhere (v6)
74000 (v6) ALLOW Anywhere (v6)
现在安装了软件并打开了必要的端口,我们已经准备好创建开发网站。
步骤三:创建新开发网站
从我们的主目录中,我们使用Jekyll的新
命令来创建一个名为www
的子目录中的网站:
1cd ~
2jekyll new www
jekyll new
命令启动了bundle install
来安装所需的依赖,然后自动安装一个名为 Minima的主题。
1[secondary_label Output]
2New jekyll site installed in /home/sammy/www.
Jekyll的新
命令会创建以下目录和文件:
1...
2├── 404.html
3├── about.markdown
4├── _config.yml
5├── Gemfile
6├── Gemfile.lock
7├── index.markdown
8├── _posts
9│ └── 2020-05-29-welcome-to-jekyll.markdown
10└── _site
这些不是实际的网站文件,它们是 Jekyll 将用于 create 静态网站的源文件, Jekyll 依赖于特定名称、命名模式和目录结构来分析不同内容来源并将其组合成静态网站,重要的是使用现有结构并在添加新帖子和页面时遵循 Jekyll 的命名惯例。
<$>[note]
** 提示:** tree
是一个用于从命令行检查文件和目录结构的有用命令。
1sudo apt install tree
要使用它,请cd
进入您想要的目录并键入树
,或者提供树 /home/sammy/www
<$>
步骤 4 – 启动 Jekyll 的 Web 服务器
Jekyll 的内置轻量级 Web 服务器通过监控目录中的文件并在保存更改时自动再生静态网站来支持网站开发。
由于我们在远程服务器上工作,我们将指定主机地址,以便从本地机器上浏览网站. 如果您在本地机器上工作,您可以运行jekyll serve
而无需主机设置,并连接到http://localhost:4000
。
1cd ~/www
2jekyll serve --host=203.0.113.0
1[secondary_label Output of jekyll server]
2Configuration file: /home/sammy/www/_config.yml
3 Source: /home/sammy/www
4 Destination: /home/sammy/www/_site
5 Incremental build: disabled. Enable with --incremental
6 Generating...
7 done in 0.645 seconds.
8 Auto-regeneration: enabled for '/home/sammy/www'
9 Server address: http://203.0.113.0:4000/
10 Server running... press ctrl-c to stop.
当我们调用jekyll serve
时,Jekyll将配置和内容文件解析到一个新的目录中,名为_site
,并开始在该_site
文件夹中提供内容:
1...
2├── 404.html
3├── about.markdown
4├── _config.yml
5├── Gemfile
6├── Gemfile.lock
7├── index.markdown
8├── _posts
9│ └── 2020-05-29-welcome-to-jekyll.markdown
10└── _site
11 ├── 404.html
12 ├── about
13 │ └── index.html
14 ├── assets
15 │ ├── main.css
16 │ │ ├── main.css.map
17 │ └── minima-social-icons.svg
18 ├── feed.xml
19 ├── index.html
20 └── jekyll
21 └── update
22 └── 2020
23 └── 05
24 └── 29
25 └── welcome-to-jekyll.html
它还开始查看当前的目录www
,查看更改. 一旦保存到帖子或页面的更改,静态网站将自动重建,因此重要的是不要直接对_site
文件夹中的文件进行更改。
如果我们在我们网站上工作时把这个终端打开,开发服务器在前沿运行,我们将立即收到反馈,当我们添加页面和帖子并更改内容。
<$>[注]
注: 如果您正在与一个大网站合作,启用--增量
构建可以通过只重建被更改的文件来加速重建,但我们不需要这个小网站。
在一个网页浏览器中,我们可以访问它在服务器地址和端口显示在jekyll服务
的输出:
结论
在本教程中,我们安装了Jekyll并创建了一个开发网站,其中包含一些自动生成的内容,您可以通过阅读我们的其他教程来了解更多关于Jekyll的内容: