【11】把 GitHub 当 CMS 用
把 GitHub 当 CMS 用
你的网站需要显示一些文字,但是你还不想直接放在 HTML 里面,那你可以把 GitHub 作为你储存内容的一个地方。
这样,就可以让任何一个非程序员通过修改 Markdown 来修改 HTML 网页的内容。
我的方法是:在你的 GitHub 仓库中使用 markdown 文件来保存文本。在你网站的前端用一个组件来抓取这些文本并呈现在网页上。
我是玩 React 的,这里有个组件,用以抓取,解析并呈现到 HTML 上。
class Markdown extends React.Component {
constructor(props) {
super(props);class Markdown extends React.Component {
constructor(props) {
super(props);
// replace with your URL, obviously
this.baseUrl = 'https://raw.githubusercontent.com/davidgilbertson/about-github/master/text-snippets';
this.state = {
markdown: '',
};
}
componentDidMount() {
fetch(`${this.baseUrl}/${this.props.url}`)
.then(response => response.text())
.then((markdown) => {
this.setState({markdown});
});
}
render() {
return (
<div dangerouslySetInnerHTML={{__html: marked(this.state.markdown)}} />
);
}
}
(/text-snippets 这个文件夹是储存我的 markdown)
下面这段代码是上面组件的示例:
const Page = () => (
<div className="page">
<div className="about-us">
<Markdown url="about-us.md" />
</div>
<div className="disclaimer">
<p>A very important disclaimer:</p>
<Markdown url="disclaimers/home-page-disclaimer.md" />
</div>
</div>
);
所以现在 GitHub 也是你的 CMS,无论你想要样大小的文字都可以。
**
【11】把 GitHub 当 CMS 用的更多相关文章
- 2017年11月GitHub上最热门的Java项目出炉
2017年11月GitHub上最热门的Java项目出炉~ 一起来看看这些项目你使用过哪些呢? 1分布式 RPC 服务框架 dubbohttps://github.com/alibaba/dubbo S ...
- 在线体验 Windows 11「GitHub 热点速览 v.21.30」
作者:HelloGitHub-小鱼干 有什么比无需安装系统,检测硬件兼容度,只要打开一个浏览器,输入某个神秘的地址回车,即可体验 Windows 11 更棒的呢?windows11 就是这么一个小工具 ...
- geckodriver v0.11.0 github上下载的
从 https://github.com/mozilla/geckodriver/releases 下载的.家里下载不了,selenium 3.0.1 + python 2.7.10 + firefo ...
- python+selenium自动化软件测试(第11章):持续集成jenkins和GitHub的使用
11.1 jenkins持续集成环境 相关安装包下载链接:http://pan.baidu.com/s/1qYhmlg4 密码:dcw2赠送jenkins集成selenium环境视频链接http:// ...
- GitHub 12个实用技巧-从projiect项目管理、代码链接到博客wiki全过程
1 在GitHub.com上编辑代码 2 粘贴图片 3 美化代码 4 在PRs中巧妙关闭issues 5 链接到评论 6 链接到代码 7 灵活使用GitHub地址栏 8 创建复选框列表 9 在GitH ...
- 小迪安全 Web安全 基础入门 第七天 - 资产泄漏、CMS识别、Git监控、SVN、DS_Store、备份
一.CMS指纹识别源码获取方式 1.网站特有文件.如/templets/default/style/dedecms.css-dedecms. 2.网站独有文件的MD5.如favicon.ico但是该文 ...
- github入门到上传本地项目【网上资源整合】
[在原文章的基础上,修改了描述的不够详细的地方,对内容进行了扩充,整合了网上的一些资料] [内容主要来自http://www.cnblogs.com/specter45/p/github.html#g ...
- github入门到上传本地项目
GitHub是基于git实现的代码托管.git是目前最好用的版本控制系统了,非常受欢迎,比之svn更好. GitHub可以免费使用,并且快速稳定.即使是付费帐户,每个月不超过10美刀的费用也非常便宜. ...
- TortoiseGit与github实现项目的上传
1. 下载并安装相关软件 这里主要涉及的软件包括msysgit和TortoiseGit. msysgit的下载地址:http://msysgit.googlecode.com/files/Git-1. ...
随机推荐
- ACM学习大纲(转)
1 推荐题库 •http://ace.delos.com/usaco/ 美国的OI 题库,如果是刚入门的新手,可以尝试先把它刷通,能够学到几乎全部的基础算法极其优化,全部的题解及标程还有题目翻译可以b ...
- Spring使用_进阶
概述 本文主要写了几个关于Spring Aware,多线程,计划任务(定时任务),条件注解,组合注解,元注解,Spring测试的小例子以及关于@Enable*注解的工作原理的理解. Spring Aw ...
- Java开发笔记(九十六)线程的基本用法
每启动一个程序,操作系统的内存中通常会驻留该程序的一个进程,进程包含了程序的完整代码逻辑.一旦程序退出,进程也就随之结束:反之,一旦强行结束进程,程序也会跟着退出.普通的程序代码是从上往下执行的,遇到 ...
- Spring Cloud Gateway VS Zuul 比较,怎么选择?
Spring Cloud Gateway 是 Spring Cloud Finchley 版推出来的新组件,用来代替服务网关:Zuul. 那 Spring Cloud Gateway 和 Zuul 都 ...
- 洛谷 P3853 [TJOI2007]路标设置
路标设置 二分枚举"空旷指数", 做法与跳石头类似. #include <iostream> #include <cstdio> #include < ...
- LOJ#111. 后缀排序(二分 hash)
题意 给出一个字符串,求出排名为$i$个字符串在原串中的开始位置 Sol 纪念一下这伟大的时刻qwq. 我用二分+hash把这题水过去了qwq. #include<cstdio> #inc ...
- Android - CollapsingToolbarLayout 完全解析
CollapsingToolbarLayout 是 google 在其推出的design libiary 中给出的一个新型控件.其可以实现的效果类似于: toolbar是透明的,有一个背景图片以及大标 ...
- 字符串、String等转换
(1) String 转换为字符串 例:String s = "abcde";char[] a = s.toCharArray(); (2) 字符串转换为Stringchar[] ...
- Xcode 升级后,cocoaPod 问题
当我从Xcode 6.3切换到Xcode6.4的时候,因为我是mac上安装了两个不同的版本,现在把Xcode 6.3卸掉了. 现在再次运行pod install命令的时候,提示如下错误: Upda ...
- C++拾遗(二)——初窥标准库类型
本篇博文的开始,先介绍一道书上看到的智力题:有20瓶药丸,其中19瓶装有1克/粒的药丸,余下一瓶装有1.1克/粒的药丸.有一台称重精准的天平,只是用一次天平的情况下如何找出比较重的那瓶药丸? 好了,直 ...