帝国cms和织梦cms_妈，没有CMS！

逃离我推掉我的手 2023-02-21 15:28 48阅读 0赞

帝国cms和织梦cms

I hate complexity. And when I say *hate* I really mean it. When you build websites several years, you start realizing that the simplicity is your best friend. As simple one system is as easy is to develop and maintain it. Nowadays, every user wants to control the content in its online appearance. For me, as a blogger, is important to work with good looking, fast and reliable CMS. The writing is difficult as its own, and if the process is tough the whole experience is not very good.

我讨厌复杂性。 当我说*仇恨时，*我是真的。 当您建立网站数年后，您开始意识到简单是您最好的朋友。 简单的系统开发和维护就像它一样容易。 如今，每个用户都希望以其在线外观来控制内容。 对于我来说，作为博客作者，使用美观，快速且可靠的CMS很重要。 写作本身很难，并且如果过程艰难，则整个体验不是很好。

At the moment, if I want to publish an article on my blog I have to open the administration of my custom PHP CMS and make a new entry. However, I'm not happy with writing the content there, and I prepare the posts in [Markdown][] format. When I'm ready, I transform the Markdown to HTML and publish it to the site. All the things written by me are stored in GitHub repositories.

目前，如果要在博客上发布文章，则必须打开自定义PHP CMS的管理并输入一个新条目。 但是，我不满意在那里写内容，并且以[Markdown][]格式准备帖子。 准备好后，我将Markdown转换为HTML并将其发布到网站。 我写的所有东西都存储在GitHub存储库中。

So, as you can see, there are several steps that I have to follow before publishing something. Sometimes I'm just too lazy to do it, and I simply don't blog. Last few months I'm thinking about changing the way of how I write. I need something new and interesting that will replace the old LAMP system. I read few [articles][] about flat file content management systems, and I decided to invest some time in developing such on top of Node.js. While I was working on the documentation of [AbsurdJS][], I made a short Node.js script that uses [Gulp][] to convert Markdown to HTML. I like how everything works and decided to take this direction.

因此，如您所见，在发布内容之前，我必须遵循几个步骤。 有时我只是懒得做，而我根本不写博客。 最近几个月，我正在考虑改变写作方式。 我需要一些新的有趣的东西来代替旧的LAMP系统。 我读了[几篇][articles]有关平面文件内容管理系统的[文章][articles] ，我决定花一些时间在Node.js之上进行开发。 当我处理[AbsurdJS][]的文档时，我制作了一个简短的Node.js脚本，该脚本使用[Gulp][]将Markdown转换为HTML。 我喜欢一切正常，并决定朝这个方向发展。

## 新玩具 **(**The new toy**)** ##

Two days (and nights) later and [Techy][] was born. That's a Node.js module that have all the characteristics of a simple flat CMS which I needed.

两天(和晚上)后， [Techy][]出生了。 那是一个Node.js模块，具有我需要的简单平面CMS的所有特征。

*  Simplicity - simply drop a markdown file and execute `techy` command. The module converts all the `.md` files into `.html` pages.
    
    简单-只需放下markdown文件并执行`techy`命令。 该模块将所有`.md`文件转换为`.html`页面。
 *  Predefined design - Techy copies the needed CSS and JavaScript (if any) into the root folder of the project.
    
    预定义的设计-Techy将所需CSS和JavaScript(如果有)复制到项目的根文件夹中。
 *  Theming - of course, as every other CMS, it offers the usage of different themes. So you are able to change the main layout, the styles, the fonts, everything.
    
    主题化-当然，与其他所有CMS一样，它提供了不同主题的用法。 因此，您可以更改主要布局，样式，字体，所有内容。
 *  Partials support - along with the Markdown syntax you are able to write Techy expressions. In fact, this is just the good old JavaScript between `<%` and `%>` markers. There are some predefined methods and variables which are available. One of them is the `template` function. It accepts a relative path to HTML file.
    
    部分支持-与Markdown语法一起，您可以编写Techy表达式。 实际上，这只是`<%`和`%>`标记之间的旧JavaScript。 有一些预定义的方法和变量可用。 其中之一是`template`功能。 它接受HTML文件的相对路径。
 *  Plain HTML support - sometimes the Markdown format is not enough. In such cases, the CMS should support adding of plain HTML.
    
    纯HTML支持-有时Markdown格式是不够的。 在这种情况下，CMS应该支持添加纯HTML。
 *  Relation between the different pages - that's pretty important feature. In the popular solutions like WordPress, for example, information like date of creation or post's author is kept in the database. However, we do not have a database here. So, such information should be written directly into the pages. I found that this pretty useful approach, because it tights the characteristics of the article to its content.
    
    不同页面之间的关系-这是非常重要的功能。 例如，在诸如WordPress之类的流行解决方案中，诸如创建日期或帖子作者之类的信息被保存在数据库中。 但是，我们这里没有数据库。 因此，此类信息应直接写入页面。 我发现这是非常有用的方法，因为它可以将文章的特征与内容紧密结合。
 *  Code syntax highlighter and icon font
    
    代码语法荧光笔和图标字体

## 试试看 **(**Let's try it**)** ##

Before to start using [Techy][], you need to install it.

在开始使用[Techy][]之前，您需要先安装它。

npm install -g techy

The command will setup the library as a global command line tool. Create a new folder somewhere and add the following `page.md` file:

该命令会将库设置为全局命令行工具。 在某处创建一个新文件夹，并添加以下`page.md`文件：

# That's a test page
    
    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
    Autem, maiores, ipsa, quos ratione consectetur facilis.

Navigate to the same directory, type `techy` and press *Enter*. You should see the following screen.

导航到同一目录，输入`techy`并按*Enter* 。 您应该看到以下屏幕。

![Techy][Techy 1]

Techy generates `page.html` next to your `page.md` file. Along with that it brings new folder `themes`. It contains the main HTML layout, the CSS styles and the JavaScript (if any) code needed for your page. Techy has [Prism][] and [FontAwesome][] integrated. So you are able to publish code and use cool icons without additional setup. And because the CMS uses Gulp it automatically starts listening for changes in your Markdown files.

Techy会在`page.md`文件旁边生成`page.html` 。 随之带来了新的文件夹`themes` 。 它包含页面所需的主要HTML布局，CSS样式和JavaScript(如果有)代码。 Techy已将[Prism][]和[FontAwesome][]集成在一起。 因此，您无需进行其他设置即可发布代码并使用很酷的图标。 并且由于CMS使用Gulp，它会自动开始侦听Markdown文件中的更改。

The content of `page.html` should be:

`page.html`的内容应为：

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Techy</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="themes/default/public/font-awesome-4.0.3/css/font-awesome.min.css">
        <link rel="stylesheet" href="themes/default/public/styles.css">
        <link rel="stylesheet" href="themes/default/public/prism/prism.css" />
        <link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Open+Sans:400,800,700' type='text/css'>
    </head>
    <body>
        <div class="content">
            <h1 id="that-s-a-test-page">That's a test page</h1>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem, maiores, ipsa, quos ratione consectetur facilis.</p>
        </div>
        <script src="themes/default/public/prism/prism.js"></script>
        <script src="themes/default/public/scripts.js"></script>
    </body>
    </html>

Techy takes care for the boring stuff and leaves your file clean. The HTML that your content is put in is defined in `themes/default/tpl/layouts/basic.html`. You may change it to something else by using the following expression:

Techy会照顾那些无聊的东西，并使您的文件整洁。 放置内容HTML在`themes/default/tpl/layouts/basic.html` 。 您可以使用以下表达式将其更改为其他内容：

// it's looking in 
    // themes/[theme name]/tpl directory
    <% set('layout', 'layouts/mylayout.html') %>

You could even use your own theme. Just call the `techy` command with the following parameter:

您甚至可以使用自己的主题。 只需使用以下参数调用`techy`命令：

techy --theme mythemename

Have in mind that the module is dealing with the paths in your files. Even if you have a deeply nested files the URLs of the CSS styles and JavaScript files will be set properly.

请记住，该模块正在处理文件中的路径。 即使您具有深层嵌套的文件，也将正确设置CSS样式和JavaScript文件的URL。

Now, to make the things a little bit more interesting, let's create a custom Techy function which returns a setting defined in another page. In order to do this, we need a new Markdown file. Create `profile.md` and put the following text inside:

现在，为了使事情变得更加有趣，让我们创建一个自定义的Techy函数，该函数返回另一个页面中定义的设置。 为此，我们需要一个新的Markdown文件。 创建`profile.md`并将以下文本放入其中：

<% set('name', 'profile') %>
    <% set('profile', { name: 'John Black', job: 'web developer'}) %>
    
    Hello, I'm <% get('profile').name %> and 
    I'm working as <% get('profile').job %>.
    This is my profile page.

`set` creates property in the current page and assigns a value to it. The same value could be fetched with the `get` method. Now, to define a new method like `get` or `set` we have to create a JavaScript file which name ends on `techy.js`. For example `getprofile.techy.js`.

`set`在当前页面中创建属性并为其分配值。 可以使用`get`方法获取相同的值。 现在，要定义一个类似`get`或`set`的新方法，我们必须创建一个名称以`techy.js`结尾JavaScript文件。 例如`getprofile.techy.js` 。

module.exports = function() {
        var profilePage = this.page('profile');
        return profilePage.get('profile');
    }

The `this` keyword inside the function's body points to the page that is running the method. `this.page` is a predefined function which accepts a name of the page. And because we defined `profile` property in `profile.md` we are now able to get its value and return it. If we update `page.md` with the following code:

函数体内的`this`关键字指向运行该方法的页面。 `this.page`是一个预定义的函数，它接受页面的名称。 并且因为我们在`profile.md`定义了`profile`属性，所以我们现在能够获取它的值并返回它。 如果我们使用以下代码更新`page.md` ：

# That's a test page
    
    * Name: <% getprofile().name %>
    * Job: <% getprofile().job %>

the result will be:

结果将是：

<h1 id="that-s-a-test-page">That's a test page</h1>
    <ul>
        <li>Name: John Black</li>
        <li>Job: web developer</li>
    </ul>

There is also `pages` function that returns and array of all the pages in the project. So, in theory we are able to implement whatever we need, because we have access to every single page and its defined properties.

还有`pages`函数可以返回项目中所有页面的数组。 因此，从理论上讲，我们能够实现所需的任何内容，因为我们可以访问每个页面及其定义的属性。

## 为什么您应该考虑使用Techy等平面文件CMS **(**Why you should consider the usage of flat file CMS like Techy**)** ##

I could see three big benefits:

我可以看到三大好处：

*  No database - this means that the overall page load will be reduced dramatically. You are serving only static HTML files.
    
    没有数据库-这意味着整体页面负载将大大减少。 您只提供静态HTML文件。
 *  No additional setup - you just need the files uploaded. There is no back-end technology involved. You may generate the HTML locally.
    
    无需其他设置-您只需要上传文件即可。 不涉及后端技术。 您可以在本地生成HTML。
 *  Super fast and easy migration - there are no configurations or database dumps for importing
    
    超级快速且轻松的迁移-无需导入任何配置或数据库转储

## 摘要 **(**Summary**)** ##

Techy is an open source project available at GitHub. Its repository is located [here][]. Feel free to fork it and make modifications, new functions or themes. I'll be happy to push the module forward.

Techy是可从GitHub获得的开源项目。 它的存储库位于[此处][here] 。 随意分叉并进行修改，新功能或主题。 我很乐意将模块向前推进。

The official page of the tool [krasimir.github.io/techy][Techy] is also generated with Techy. The code could be seen [here][here 1].

该工具的官方页面[krasimir.github.io/techy][Techy]也与易怒的产生。 该代码可以在[这里][here 1]看到。

> 翻译自: [https://davidwalsh.name/techy][https_davidwalsh.name_techy]

帝国cms和织梦cms

[Markdown]: https://daringfireball.net/projects/markdown/
[articles]: http://www.ostraining.com/blog/general/2014-static-websites/
[AbsurdJS]: http://absurdjs.com
[Gulp]: http://gulpjs.com/
[Techy]: http://krasimir.github.io/techy/
[Techy 1]: http://imgconvert.csdnimg.cn/aHR0cHM6Ly9kYXZpZHdhbHNoLm5hbWUvZGVtby90ZWNoeS1zY3JlZW4uanBn?x-oss-process=image/format,png
[Prism]: http://prismjs.com/
[FontAwesome]: http://fortawesome.github.io/Font-Awesome/
[here]: https://github.com/krasimir/techy
[here 1]: https://github.com/krasimir/techy/tree/gh-pages
[https_davidwalsh.name_techy]: https://davidwalsh.name/techy