document/TranslateProject
2
0
Fork 0
mirror of https://github.com/LCTT/TranslateProject.git synced 2025-02-03 23:40:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

TSL

Browse Source
This commit is contained in:
Xiaobin.Liu 2020-09-28 23:49:59 +08:00
parent 857058664b
commit 48831df29e
2 changed files with 214 additions and 214 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

214
sources/tech/20200926 10 Open Source Static Site Generators to Create Fast and Resource-Friendly Websites.md
View File

@ -1,214 +0,0 @@
[#]: collector: (lujun9972)
[#]: translator: (lxbwolf)
[#]: reviewer: ( )
[#]: publisher: ( )
[#]: url: ( )
[#]: subject: (10 Open Source Static Site Generators to Create Fast and Resource-Friendly Websites)
[#]: via: (https://itsfoss.com/open-source-static-site-generators/)
[#]: author: (Ankush Das https://itsfoss.com/author/ankush/)
10 Open Source Static Site Generators to Create Fast and Resource-Friendly Websites
======
_**Brief: Looking to deploy a static web-page? No need to fiddle with HTML and CSS. These open source static website generators will help you deploy beautiful, functional static websites in no time.**_
### What is a static website?
Technically, a static website means the webpages are not generated on the server dynamically. The HTML, CSS, JavaScript lie on the server in the version the end user receives it. The raw source code files are already prebuilt, the source code doesn’t change with the next server request.
It’s FOSS is a dynamic website which depends on several databases and the web pages are generated and served when there’s a request from your browser. Majority of the web is powered by dynamic sites where you interact with the websites and there are plenty of content that often change.
Static websites give you a few benefits like faster loading times, less server resource requirements, and better security (debatable?).
Traditionally, static websites are more suitable for creating small websites with only a few pages and where the content doesn’t change too often.
This, however, is changing thanks to static website generator tools and you can use them to create blogs as well.
I have compiled a list of open source static site generators that can help you build a beautiful website.
### Best Open Source Static Site Generators
It’s worth noting that you will not get complex functionality on a static website. In that case, you might want to check out our list of [best open source CMS][1] for dynamic websites.
#### 1\. Jekyll
![][2]
Jekyll is one of the most popular open source static generator built using [Ruby][3]. In fact, Jekyll is the engine behind [GitHub pages][4] which lets you host websites using GitHub for free.
Setting up Jekyll is easy across multiple platforms which includes Ubuntu as well. It utilizes [Markdown][5], [Liquid][5] (for template), HTML, and CSS to generate the static site files. It is also a pretty good option if you want to build a blog without advertisements or a product page to promote your tool or service.
Also, it supports migrating your blog from popular CMSs like Ghost, WordPress, Drupal 7, and more. You get to manage permalinks, categories, pages, posts, and custom layouts, which is nice. So, even if you already have an existing website that you want to convert to a static site, Jekyll should be a perfect solution. You can learn more about it by exploring the [official documentation][6] or its [GitHub page][7].
[Jekyll][8]
#### 2\. Hugo
![][9]
Hugo is yet another popular open source framework for building static sites. It’s built using the [Go programming language][10].
It is fast, simple, and reliable. You also get some advanced theming support if you need it. It also offers some useful shortcuts to help you get things done easily. No matter whether it’s a portfolio site or a blog, Hugo is capable enough to manage a variety of content types.
To get started, you can follow its [official documentation][11] or go through its [GitHub page][12] to install it and learn more about its usage. You can also deploy Hugo on GitHub pages or any CDN if required.
[Hugo][13]
#### 3\. Hexo
![][14]
Hexo is an interesting open-source framework powered by [Node.js][15]. Similar to others, you will end up creating blazing fast websites but you will also get a good collection of themes and plugins.
You do get a powerful API here to extend functionality as per your requirements as well. If you already have a website, you can simply use its [Migrator][16] extension as well.
To get started, you can go through the [official documentation][17] or just explore their [GitHub page][18].
[Hexo][19]
#### 4\. Gatsby
![][20]
Gatsby is an increasingly open-source popular site generator framework. It utilizes [React.js][21] for creating fast and beautiful websites.
I was quite interested to give this a try for some experimental projects a few years back and it is impressive to see the availability thousands of new plugins and themes. Unlike other static site generators, you can use Gatsby to generate a site and get the benefits of static sites without losing any features.
It offers a lot of useful integrations from popular services. Of course, you can keep it simple or use it coupled with a popular CMS of your choice, which should be interesting. You can take a look at their [official documentation][22] and its [GitHub page][23] to find out more on it.
[Gatsby][24]
#### 5\. VuePress
![][25]
VuePress is a static site generator powered by [Vue.js][26] which happens to be an open-source progressive JavaScript framework.
If you know HTML, CSS, and JavaScript, you can easily get started using VuePress. You should find several useful plugins and themes to get a head start on building your site. Also, it seems like Vue.js is being actively improved and has the attention of more developers, which is a good thing.
You can learn more about it through their [official guide][27] and the [GitHub page][28].
[VuePress][29]
#### 6\. Nuxt.js
![][30]
Nuxt.js utilizes Vue.js and Node.js but it focuses on providing modularity and has the ability to rely on the server-side instead of the client-side. Not just that, it aims to provide an intuitive experience to the developers with descriptive errors, and detailed documentations among other things.
As it claims, Nuxt.js should be the best of both world with all of its features and flexibility that you get to build a static website. They also offer a [Nuxt Online sandbox][31] to let you directly test it without a lot of effort.
You can explore its [GitHub page][32] or visit the [official][33] [][33][site][33] to get more details.
#### 7\. Docusaurus
![][34]
Docusaurus is an interesting open-source static site generator tailored for building documentation websites. It happens to be a part of [Facebook’s open source initiative][35].
It is built using React. You get all the essential features like document versioning, document search, and translation mostly pre-configured. If you’re planning to build a documentation website for any of your products/services, this should be a good start.
You can learn more about it on its [GitHub page][36] and its [official website][37].
[Docusaurus][37]
#### 8\. Eleventy
![][38]
Eleventy describes itself as an alternative to Jekyll and aims for a simpler approach to make faster static websites.
It seems easy to get started and it also offers proper documentation to help you out. If you want a simple static site generator that gets the job done, Eleventy seems to be an interesting choice.
You can explore more about it on its [GitHub page][39] and visit the [official website][40] for more details.
[Eleventy][40]
#### 9\. Publii
![][41]
Publii is an impressive open-source CMS that makes it easy to generate a static site. It’s built using [Electron][42] and Vue.js. You can also migrate your posts from a WordPress site if needed. In addition to that, it offers several one-click synchronizations with GitHub Pages, Netlify, and similar services.
You also get a WYSIWYG editor if you utilize Publii to generate a static site. To get started, visit the [official website][43] to download it or explore its [GitHub page][44] for more information.
[Publii][43]
#### 10\. Primo
![][45]
An interesting open-source static site generator which is still in active development. Even though it’s not a full-fledged solution with all the features compared to other static generators, it is a unique project.
Primo aims to help you build and develop a site using a visual builder which can be easily edited and deployed to any host of your choice.
You can visit the [official website][46] or explore its [GitHub page][47] for more information.
[Primo][46]
### Wrapping Up
There are a lot of other site generators available out there. However, I’ve tried to mention the best static generators that gives you the fastest loading times, the best security, and an impressive flexibility.
Did I miss any of your favorites? Let me know in the comments below.
--------------------------------------------------------------------------------
via: https://itsfoss.com/open-source-static-site-generators/
作者：[Ankush Das][a]
选题：[lujun9972][b]
译者：[译者ID](https://github.com/译者ID)
校对：[校对者ID](https://github.com/校对者ID)
本文由 [LCTT](https://github.com/LCTT/TranslateProject) 原创编译，[Linux中国](https://linux.cn/) 荣誉推出
[a]: https://itsfoss.com/author/ankush/
[b]: https://github.com/lujun9972
[1]: https://itsfoss.com/open-source-cms/
[2]: https://i1.wp.com/itsfoss.com/wp-content/uploads/2018/01/jekyll-screenshot.jpg?resize=800%2C450&ssl=1
[3]: https://www.ruby-lang.org/en/
[4]: https://pages.github.com/
[5]: https://github.com/Shopify/liquid/wiki
[6]: https://jekyllrb.com/docs/
[7]: https://github.com/jekyll/jekyll
[8]: https://jekyllrb.com/
[9]: https://i2.wp.com/itsfoss.com/wp-content/uploads/2020/09/hugo.jpg?resize=800%2C414&ssl=1
[10]: https://golang.org/
[11]: https://gohugo.io/getting-started/
[12]: https://github.com/gohugoio/hugo
[13]: https://gohugo.io/
[14]: https://i2.wp.com/itsfoss.com/wp-content/uploads/2020/09/hexo.jpg?resize=800%2C213&ssl=1
[15]: https://nodejs.org/en/
[16]: https://hexo.io/api/migrator.html
[17]: https://hexo.io/docs/
[18]: https://github.com/hexojs/hexo
[19]: https://hexo.io/
[20]: https://i0.wp.com/itsfoss.com/wp-content/uploads/2020/09/gatsbyjs.png?resize=800%2C388&ssl=1
[21]: https://reactjs.org/
[22]: https://www.gatsbyjs.com/docs/
[23]: https://github.com/gatsbyjs/gatsby
[24]: https://www.gatsbyjs.com/
[25]: https://i0.wp.com/itsfoss.com/wp-content/uploads/2020/09/VuePress.jpg?resize=800%2C498&ssl=1
[26]: https://vuejs.org/
[27]: https://vuepress.vuejs.org/guide/
[28]: https://github.com/vuejs/vuepress
[29]: https://vuepress.vuejs.org/
[30]: https://i2.wp.com/itsfoss.com/wp-content/uploads/2020/09/nuxtjs.jpg?resize=800%2C415&ssl=1
[31]: https://template.nuxtjs.org/
[32]: https://github.com/nuxt/nuxt.js
[33]: https://nuxtjs.org/
[34]: https://i2.wp.com/itsfoss.com/wp-content/uploads/2020/09/docusaurus.jpg?resize=800%2C278&ssl=1
[35]: https://opensource.facebook.com/
[36]: https://github.com/facebook/docusaurus
[37]: https://docusaurus.io/
[38]: https://i1.wp.com/itsfoss.com/wp-content/uploads/2020/09/eleventy.png?resize=800%2C375&ssl=1
[39]: https://github.com/11ty/eleventy/
[40]: https://www.11ty.dev/
[41]: https://i0.wp.com/itsfoss.com/wp-content/uploads/2020/09/publii.jpg?resize=800%2C311&ssl=1
[42]: https://www.electronjs.org
[43]: https://getpublii.com/
[44]: https://github.com/GetPublii/Publii
[45]: https://i1.wp.com/itsfoss.com/wp-content/uploads/2020/09/primo-af.jpg?resize=800%2C394&ssl=1
[46]: https://primo.af/
[47]: https://github.com/primo-app/primo-desktop

214
translated/tech/20200926 10 Open Source Static Site Generators to Create Fast and Resource-Friendly Websites.md Normal file
View File

@ -0,0 +1,214 @@
[#]: collector: "lujun9972"
[#]: translator: "lxbwolf"
[#]: reviewer: " "
[#]: publisher: " "
[#]: url: " "
[#]: subject: "10 Open Source Static Site Generators to Create Fast and Resource-Friendly Websites"
[#]: via: "https://itsfoss.com/open-source-static-site-generators/"
[#]: author: "Ankush Das https://itsfoss.com/author/ankush/"
10 个用来创建快速和资源友好网站的静态网站生成工具
======
_**摘要：在寻找部署静态网页的方法吗？这几个开源的静态网站生成工具可以帮你迅速部署界面优美、功能强大的静态网站，无需掌握复杂的 HTML 和 CSS 技能。**_
### 静态网站是什么？
技术上来讲，一个静态网站的网页不是由服务器动态生成的。HTML、CSS 和 JavaScript 文件就静静地躺在服务器的某个路径下，它们的内容与终端用户接收到时看到的是一样的。源码文件已经提前编译好了，源码在每次请求后都不会变化。
It’s FOSS 是一个依赖多个数据库的动态网站，网页是在你的浏览器发出请求时即时生成和服务的。大部分网站是动态的，你与这些网站互动时，会有大量的内容在变化。
静态网站有一些好处，比如加载时间更短，请求的服务器资源更少，更安全（有争议？）。
传统意义上，静态网站更适合于创建只有少量网页、内容变化不频繁的小网站。
然而，当静态网站生成工具出现后，静态网站的适用范围越来越大。你还可以使用这些工具搭建博客网站。
我列出了几个开源的静态网站生成工具，这些工具可以帮你搭建界面优美的网站。
### 最好的开源静态网站生成工具
请注意，静态网站不会提供很复杂的功能。如果你需要复杂的功能，那么你可以参考适用于动态网站的[最好的开源 CMS][1]列表
#### 1\. Jekyll
![][2]
Jekyll 是用 [Ruby][3] 写的最受欢迎的开源静态生成工具之一。实际上，Jekyll 是 [GitHub 页面][4] 的引擎，它可以让你免费用 GitHub 维护自己的网站。
你可以很轻松地跨平台配置 Jekyll，包括 Ubuntu。它利用 [Markdown][5]、[Liquid][5]（模板语言）、HTML 和 CSS 来生成静态的网页文件。如果你要搭建一个没有广告或推广自己工具或服务的产品页的博客网站，它是个不错的选择。
它还支持从常见的 CMS（<ruby>内容管理系统<rt>Content management system</rt></ruby>）如 Ghost、WordPress、Drupal 7 迁移你的博客。你可以管理永久链接、类别、页面、文章，还可以自定义布局，这些功能都很强大。因此，即使你已经有了一个网站，如果你想转成静态网站，Jekyll 会是一个完美的解决方案。你可以参考[官方文档][6]或 [GitHub 页面][7]了解更多内容。
[Jekyll][8]
#### 2\. Hugo
![][9]
Hugo 是另一个很受欢迎的用于搭建静态网站的开源框架。它是用 [Go 语言][10]写的。
它运行速度快，使用简单，可靠性高。如果你需要，它也可以提供更高级的主题。它还提供了能提高你效率的实用快捷键。无论是组合展示网站还是博客网站，Hogo 都有能力管理大量的内容类型。
如果你想使用 Hugo，你可以参照它的[官方文档][11]或它的 [GitHub 页面][12]来安装以及了解更多相关的使用方法。你还可以用 Hugo 在 GitHub 页面或 CDN（如果有需要）部署网站。
[Hugo][13]
#### 3\. Hexo
![][14]
Hexo 基于 [Node.js][15] 的一个有趣的开源框架。像其他的工具一样，你可以用它搭建相当快速的网站，不仅如此，它还提供了丰富的主题和插件。
它还根据用户的每个需求提供了强大的 API 来扩展功能。如果你已经有一个网站，你可以用它的[迁移][16]扩展轻松完成迁移工作。
你可以参照[官方文档][17]或 [GitHub 页面][18] 来使用 Hexo。
[Hexo][19]
#### 4\. Gatsby
![][20]
Gatsby 是一个不断发展的流行开源网站生成框架。它使用 [React.js][21] 来生成快速、界面优美的网站。
几年前在一个实验性的项目中，我曾经非常想尝试一下这个工具，它提供的成千上万的新插件和主题的能力让我印象深刻。与其他静态网站生成工具不同的是，你可以用 Gatsby 在不损失任何功能的前提下来生成静态网站。
它提供了与很多流行的服务的整合功能。当然，你可以不使用它的复杂的功能，或选择一个流行的 CMS 与它配合使用，这也会很有趣。你可以查看他们的[官方文档][22]或它的 [GitHub 页面][23]了解更多内容。
[Gatsby][24]
#### 5\. VuePress
![][25]
VuePress 是基于 [Vue.js][26] 的静态网站生成工具，同时也是开源的渐进式 JavaScript 框架。
如果你了解 HTML、CSS 和 JavaScript，那么你可以无压力地使用 VuePress。如果你想在搭建网站时抢先别人一步，那么你应该找几个有用的插件和主题。此外，看起来 Vue.js 更新地一直很活跃，很多开发者都在关注 Vue.js，这是一件好事。
你可以参照他们的[官方文档][27]和 [GitHub 页面][28]了解更多。
[VuePress][29]
#### 6\. Nuxt.js
![][30]
Nuxt.js 使用 Vue.js 和 Node.js，但它致力于模块化，并且有能力依赖服务端而非客户端。不仅如此，它还志在通过描述详尽的错误和其他方面更详细的文档来为开发者提供直观的体验。
正如它声称的那样，在你用来搭建静态网站的所有工具中，Nuxt.js 在功能和灵活性两个方面都是佼佼者。他们还提供了一个 [Nuxt 线上沙盒][31]让你直接测试。
你可以查看它的 [GitHub 页面][32]和[官方网站][33]了解更多。
#### 7\. Docusaurus
![][34]
Docusaurus 是一个为搭建文档类网站量身定制的有趣的开源静态网站生成工具。它还是 [Facebook 开源计划][35]的一个项目。
Docusaurus 是用 React 构建的。你可以使用所有必要的功能，像文档版本管理、文档搜索，还有大部分已经预先配置好的翻译。如果你想为你的产品或服务搭建一个文档网站，那么可以试试 Docusaurus。
你可以从它的 [GitHub 页面][36]和它的[官网][37]获取更多信息。
[Docusaurus][37]
#### 8\. Eleventy
![][38]
Eleventy 自称是 Jekyll 的替代品，志在为创建更快的静态网站提供更简单的方式。
使用 Eleventy 看起来很简单，它也提供了能解决你的问题的文档。如果你想找一个简单的静态网站生成工具，Eleventy 似乎会是一个有趣的选择。
你可以参照它的 [GitHub 页面][39]和[官网][40]来了解更多的细节。
[Eleventy][40]
#### 9\. Publii
![][41]
Publii 是一个令人印象深刻的开源 CMS，它能使生成一个静态网站变得很容易。它是用 [Electron][42] 和 Vue.js 构建的。如果有需要，你也可以把你的文章从 WorkPress 网站迁移过来。此外，它还提供了与 GitHub 页面、Netlify 及其它类似服务的一键同步功能。
利用 Publii 生成的静态网站，自带所见即所得编辑器。你可以从[官网][43]下载它，或者从它的 [GitHub 页面][44]了解更多信息。
[Publii][43]
#### 10\. Primo
![][45]
一个有趣的开源静态网站生成工具，目前开发工作仍很活跃。虽然与其他的静态生成工具相比，它还不是一个成熟的解决方案，有些功能还不完善，但它是一个独一无二的项目。
Primo 志在使用可视化的构建器帮你构建和搭建网站，这样你就可以轻松编辑和部署到任意主机上。
你可以参照[官网][46]或查看它的 [GitHub 页面][47]了解更多信息。
[Primo][46]
### 结语
还有很多文章中没有列出的网站生成工具。然而，我已经尽力写出了能提供最快的加载速度、最好的安全性和令人印象最深刻的灵活性的最好的静态生成工具了。
列表中没有你最喜欢的工具？在下面的评论中告诉我。
--------------------------------------------------------------------------------
via: https://itsfoss.com/open-source-static-site-generators/
作者：[Ankush Das][a]
选题：[lujun9972][b]
译者：[lxbwolf](https://github.com/lxbwolf)
校对：[校对者ID](https://github.com/校对者ID)
本文由 [LCTT](https://github.com/LCTT/TranslateProject) 原创编译，[Linux中国](https://linux.cn/) 荣誉推出
[a]: https://itsfoss.com/author/ankush/
[b]: https://github.com/lujun9972
[1]: https://itsfoss.com/open-source-cms/
[2]: https://i1.wp.com/itsfoss.com/wp-content/uploads/2018/01/jekyll-screenshot.jpg?resize=800%2C450&ssl=1
[3]: https://www.ruby-lang.org/en/
[4]: https://pages.github.com/
[5]: https://github.com/Shopify/liquid/wiki
[6]: https://jekyllrb.com/docs/
[7]: https://github.com/jekyll/jekyll
[8]: https://jekyllrb.com/
[9]: https://i2.wp.com/itsfoss.com/wp-content/uploads/2020/09/hugo.jpg?resize=800%2C414&ssl=1
[10]: https://golang.org/
[11]: https://gohugo.io/getting-started/
[12]: https://github.com/gohugoio/hugo
[13]: https://gohugo.io/
[14]: https://i2.wp.com/itsfoss.com/wp-content/uploads/2020/09/hexo.jpg?resize=800%2C213&ssl=1
[15]: https://nodejs.org/en/
[16]: https://hexo.io/api/migrator.html
[17]: https://hexo.io/docs/
[18]: https://github.com/hexojs/hexo
[19]: https://hexo.io/
[20]: https://i0.wp.com/itsfoss.com/wp-content/uploads/2020/09/gatsbyjs.png?resize=800%2C388&ssl=1
[21]: https://reactjs.org/
[22]: https://www.gatsbyjs.com/docs/
[23]: https://github.com/gatsbyjs/gatsby
[24]: https://www.gatsbyjs.com/
[25]: https://i0.wp.com/itsfoss.com/wp-content/uploads/2020/09/VuePress.jpg?resize=800%2C498&ssl=1
[26]: https://vuejs.org/
[27]: https://vuepress.vuejs.org/guide/
[28]: https://github.com/vuejs/vuepress
[29]: https://vuepress.vuejs.org/
[30]: https://i2.wp.com/itsfoss.com/wp-content/uploads/2020/09/nuxtjs.jpg?resize=800%2C415&ssl=1
[31]: https://template.nuxtjs.org/
[32]: https://github.com/nuxt/nuxt.js
[33]: https://nuxtjs.org/
[34]: https://i2.wp.com/itsfoss.com/wp-content/uploads/2020/09/docusaurus.jpg?resize=800%2C278&ssl=1
[35]: https://opensource.facebook.com/
[36]: https://github.com/facebook/docusaurus
[37]: https://docusaurus.io/
[38]: https://i1.wp.com/itsfoss.com/wp-content/uploads/2020/09/eleventy.png?resize=800%2C375&ssl=1
[39]: https://github.com/11ty/eleventy/
[40]: https://www.11ty.dev/
[41]: https://i0.wp.com/itsfoss.com/wp-content/uploads/2020/09/publii.jpg?resize=800%2C311&ssl=1
[42]: https://www.electronjs.org
[43]: https://getpublii.com/
[44]: https://github.com/GetPublii/Publii
[45]: https://i1.wp.com/itsfoss.com/wp-content/uploads/2020/09/primo-af.jpg?resize=800%2C394&ssl=1
[46]: https://primo.af/
[47]: https://github.com/primo-app/primo-desktop