163 lines
14 KiB
HTML
163 lines
14 KiB
HTML
<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta name="X-UA-Compatible" content="IE=edge"><meta name="author" content="溦雨yu"><title>光速搭建个人博客网站！ · Mars之路</title><meta name="description" content="授课笔记怎么样制作一个公开的网站工具
|
||
网站的源代码
|
||
IP地址&#x2F;域名
|
||
维护方式
|
||
现成的框架与开源的社区
|
||
Wordpress
|
||
Typecho
|
||
Hexo
|
||
Docsify
|
||
|
||
|
||
|
||
最简单公开：生成一个二维码（理工男的浪漫）
|
||
草料二维码 科技的终点是人文。
|
||
妈妈我爱你
|
||
|
||
公开平台- 短文字（微博、知乎"><meta name="keywords"><meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"><meta content="yes" name="apple-mobile-web-app-capable"><meta content="black" name="apple-mobile-web-app-status-bar-style"><meta content="telephone=no" name="format-detection"><meta name="renderer" content="webkit"><link rel="stylesheet" href="/css/style.css"><link rel="stylesheet" href="/css/blog_basic.css"><link rel="stylesheet" href="/css/font-awesome.min.css"><link rel="alternate" type="application/atom+xml" title="ATOM 1.0" href="/atom.xml"><script src="/js/jquery.js"></script><meta name="generator" content="Hexo 6.3.0"></head><body><div class="sidebar animated fadeInDown"><div class="logo-title"><div class="title"><img src="/images/logo@2x.png" style="width:127px;"><h3 title=""><a href="/">Mars之路</a></h3><div class="description"><p>没有销声匿迹 我在热爱生活</p></div></div></div><ul class="social-links"><li><a target="_blank" rel="noopener" href="https://github.com/lwvvvvv"><i class="fa fa-github"></i></a></li><li><a href="mailto:liwei.vv@88.com"><i class="fa fa-envelope"></i></a></li></ul><div class="footer"><div class="p"> <span>© 2022 - 2023 </span><i class="fa fa-star"></i><span> 溦雨yu</span></div><div class="by_farbox"><span>Powered by </span><a href="https://hexo.io/zh-cn/" target="_blank">Hexo </a><span> & </span><a href="https://github.com/mrcore/hexo-theme-Anatole-Core" target="_blank">Anatole-Core </a></div><div class="beian"><a href="http://beian.miit.gov.cn/" target="_blank">晋ICP备2024046352号</a><span style="height:10px;margin-left: 10px;">|</span><img src="/images/gongan.png" style="height:10px;margin-left: 10px;position: relative;top: 1px;"><span style="margin-left: 2px;"></span></div></div></div><div class="main"><div class="page-top animated fadeInDown"><div class="nav"><li><a href="/">首页</a></li><li><a href="/archives">归档</a></li><li><a href="/tags">标签</a></li><li><a href="/about">关于</a></li><li><a href="/guestbook">留言</a></li></div><div class="information"><div class="back_btn"><li><a class="fa fa-chevron-left" onclick="window.history.go(-1)"> </a></li></div></div></div><div class="autopagerize_page_element"><div class="content"><div class="post-page"><div class="post animated fadeInDown"><div class="post-title"><h3><a>光速搭建个人博客网站！</a></h3></div><div class="post-content"><hr>
|
||
<h1 id="授课笔记"><a href="#授课笔记" class="headerlink" title="授课笔记"></a>授课笔记</h1><h2 id="怎么样制作一个公开的网站"><a href="#怎么样制作一个公开的网站" class="headerlink" title="怎么样制作一个公开的网站"></a>怎么样制作一个公开的网站</h2><h3 id="工具"><a href="#工具" class="headerlink" title="工具"></a>工具</h3><ul>
|
||
<li>网站的源代码</li>
|
||
<li>IP地址/域名</li>
|
||
<li>维护方式</li>
|
||
<li>现成的框架与开源的社区<ul>
|
||
<li>Wordpress</li>
|
||
<li>Typecho</li>
|
||
<li>Hexo</li>
|
||
<li>Docsify</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
<h3 id="最简单公开：生成一个二维码（理工男的浪漫）"><a href="#最简单公开：生成一个二维码（理工男的浪漫）" class="headerlink" title="最简单公开：生成一个二维码（理工男的浪漫）"></a>最简单公开：生成一个二维码（理工男的浪漫）</h3><ul>
|
||
<li><a target="_blank" rel="noopener" href="https://cli.im/">草料二维码</a> 科技的终点是人文。</li>
|
||
<li>妈妈我爱你</li>
|
||
</ul>
|
||
<h3 id="公开平台"><a href="#公开平台" class="headerlink" title="公开平台"></a>公开平台</h3><pre><code>- 短文字（微博、知乎）
|
||
- 短视频（抖音、快手)
|
||
- 长视频（B站 yyds）
|
||
- 长文（知乎、简书）
|
||
- 生活资讯（小红书）
|
||
- 最大的个人IP平台（微信公众号）
|
||
</code></pre>
|
||
<h3 id="个人公众号的制作"><a href="#个人公众号的制作" class="headerlink" title="个人公众号的制作"></a>个人公众号的制作</h3><h3 id="网站制作"><a href="#网站制作" class="headerlink" title="网站制作"></a>网站制作</h3><pre><code>1. 部署网站框架（Github、Gitee 码云）
|
||
2. 托管后，与域名链接
|
||
3. 域名访问
|
||
</code></pre>
|
||
<hr>
|
||
<h1 id="网站部署工具I-利用Docsify展示MD文件"><a href="#网站部署工具I-利用Docsify展示MD文件" class="headerlink" title="网站部署工具I - 利用Docsify展示MD文件"></a>网站部署工具I - 利用Docsify展示MD文件</h1><h2 id="准备工作"><a href="#准备工作" class="headerlink" title="准备工作"></a>准备工作</h2><ul>
|
||
<li>包管理器 Node.js（npm） nodejs package manager</li>
|
||
<li>开源框架 Docsify</li>
|
||
<li>内容 Markdown （Typora）</li>
|
||
</ul>
|
||
<h2 id="开始安装"><a href="#开始安装" class="headerlink" title="开始安装"></a>开始安装</h2><h3 id="安装包管理器-npm"><a href="#安装包管理器-npm" class="headerlink" title="安装包管理器 npm"></a>安装包管理器 npm</h3><p><a href="nodejs.cn">Node.JS 官网</a> 根据平台下载 LTS 版本。 </p>
|
||
<p>验证是否安装成功：Windows 系统下打开命令行，快捷键<code>Win+R</code>，输入 cmd 回车<code>(即Command)</code><br>输入 <code>npm --version</code> ，如有结果则正确</p>
|
||
<h3 id="安装-Docsify"><a href="#安装-Docsify" class="headerlink" title="安装 Docsify"></a>安装 Docsify</h3><ol>
|
||
<li><code>npm i docsify-cli -g</code> 安装 Docsify 包 （i = install）</li>
|
||
<li>找一个顺眼的文件夹存储目录，在 cmd 中打开（见下方技巧）</li>
|
||
<li><a target="_blank" rel="noopener" href="https://docsify.js.org/#/zh-cn/quickstart?id=%E5%88%9D%E5%A7%8B%E5%8C%96%E9%A1%B9%E7%9B%AE">初始化项目</a> <code>docsify init</code> init (initialize) 初始化， 输入Y</li>
|
||
<li>预览网页 <code>docsify serve</code> serve 即服务</li>
|
||
</ol>
|
||
<h3 id="制作网页"><a href="#制作网页" class="headerlink" title="制作网页"></a>制作网页</h3><p>更改初始化完的目录中的<code>README.md</code>文件即可，可用 Typora 打开。</p>
|
||
<h3 id="部署方式"><a href="#部署方式" class="headerlink" title="部署方式"></a>部署方式</h3><ol>
|
||
<li>打开Gitee.com，进行注册</li>
|
||
<li>新建一个仓库，仓库名与个人空间地址相同。选择设置模板——readme文件。</li>
|
||
<li>点击服务——Gitee Pages，进行实名认证。</li>
|
||
<li>点回代码页，点击文件——新建文件夹。</li>
|
||
<li>在新建文件夹中上传 Docsify 文件。</li>
|
||
<li>再次打开Gitee Pages，分支不变，目录填新建的文件夹。点击启动即可。</li>
|
||
<li>更改 README.md 即可更改内容，更新即可。</li>
|
||
</ol>
|
||
<hr>
|
||
<h3 id="Markdown-语法"><a href="#Markdown-语法" class="headerlink" title="Markdown 语法"></a>Markdown 语法</h3><ul>
|
||
<li><p><code>### </code> 标题</p>
|
||
</li>
|
||
<li><p><code>*内容*</code>斜体 <code>**内容**</code> 粗体</p>
|
||
</li>
|
||
<li><p><code>代码``` </code> 行内 </p>
|
||
</li>
|
||
<li><p>列表</p>
|
||
<ul>
|
||
<li>无序列表<ul>
|
||
<li>*-+</li>
|
||
</ul>
|
||
</li>
|
||
<li>有序列表<ul>
|
||
<li><ol>
|
||
<li></li>
|
||
</ol>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li><p>分割线 <code>---</code></p>
|
||
</li>
|
||
</ul>
|
||
<h2 id="cmd-技巧"><a href="#cmd-技巧" class="headerlink" title="cmd 技巧"></a>cmd 技巧</h2><ol>
|
||
<li>工作目录 输入盘符 : 切换磁盘</li>
|
||
<li><code>cd</code> (change directory) + 要切换的目录</li>
|
||
<li><code>cd..</code> .. 表示上一级目录 . 表示当前目录</li>
|
||
<li><code>dir</code>显示当前目录的文件</li>
|
||
</ol>
|
||
<hr>
|
||
<h1 id="网站部署工具-II-利用Hexo制作静态博客"><a href="#网站部署工具-II-利用Hexo制作静态博客" class="headerlink" title="网站部署工具 II - 利用Hexo制作静态博客"></a>网站部署工具 II - 利用Hexo制作静态博客</h1><h2 id="准备工作-1"><a href="#准备工作-1" class="headerlink" title="准备工作"></a>准备工作</h2><ul>
|
||
<li>了解开源：热爱共享 和 开放自由（黑客->极客）<ul>
|
||
<li>史蒂夫·乔布斯、沃兹尼克 APPLE Ｉ红皮书的故事</li>
|
||
<li>最出名的开源社区：Github.com / OpenResty / OpenSSL</li>
|
||
<li>国内开源社区：Gitee.com 码云 / Coding.net / OSCHINA</li>
|
||
</ul>
|
||
</li>
|
||
<li>安装 NPM 管理器 <a target="_blank" rel="noopener" href="https://nodejs.cn/">https://nodejs.cn</a> 一路下一步，不要更改任何东西<ul>
|
||
<li>验证是否装好：<code>npm --version</code></li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
<h2 id="使用Hexo"><a href="#使用Hexo" class="headerlink" title="使用Hexo"></a>使用Hexo</h2><h3 id="初始化步骤（只需运行一次）"><a href="#初始化步骤（只需运行一次）" class="headerlink" title="初始化步骤（只需运行一次）"></a>初始化步骤（只需运行一次）</h3><ol>
|
||
<li><p>安装 Hexo 管理器，直接在cmd中运行<code>npm install -g hexo-cli </code> 验证是否装好： <code>hexo</code></p>
|
||
</li>
|
||
<li><p>安装 Git：<a target="_blank" rel="noopener" href="https://registry.npmmirror.com/binary.html?path=git-for-windows/v2.35.1.windows.2/">https://registry.npmmirror.com/binary.html?path=git-for-windows/v2.35.1.windows.2/</a></p>
|
||
</li>
|
||
</ol>
|
||
<p> 下载 Git-2.35.1.2-64-bit.exe，一路下一步啥都别管 </p>
|
||
<ol start="3">
|
||
<li>找一个顺眼的文件夹，右键在此处打开Git Bash Here，输入<code>hexo init</code>运行</li>
|
||
<li>运行 <code>npm install</code> , 初始化完成</li>
|
||
</ol>
|
||
<h3 id="配置网站"><a href="#配置网站" class="headerlink" title="配置网站"></a>配置网站</h3><ol>
|
||
<li><p>预览效果 <code>hexo s</code></p>
|
||
</li>
|
||
<li><p>写内容，新建一个网页 <code>hexo new 网页名字</code></p>
|
||
</li>
|
||
<li><p>找到 md 文件，<code>/source/_posts/</code>目录里找到新建的文件，改动后保存即可，刷新即看效果</p>
|
||
</li>
|
||
</ol>
|
||
<h3 id="更换主题"><a href="#更换主题" class="headerlink" title="更换主题"></a>更换主题</h3><ol>
|
||
<li>打开官网：<a target="_blank" rel="noopener" href="https://hexo.io/zh-cn/docs%EF%BC%8C%E7%82%B9%E5%87%BB%E4%B8%8A%E6%96%B9%E7%9A%84">https://hexo.io/zh-cn/docs，点击上方的</a> Themes，可以找到许多主题，选择一个</li>
|
||
<li>跟随文档说明进行安装，通常是打开本地的hexo目录，进行 Git Clone 操作.</li>
|
||
</ol>
|
||
<h2 id="部署网站"><a href="#部署网站" class="headerlink" title="部署网站"></a>部署网站</h2><ol>
|
||
<li>安装 <a target="_blank" rel="noopener" href="https://github.com/hexojs/hexo-deployer-git">hexo-deployer-git</a>. 命令为<code>npm install --save hexo-deployer-git</code></li>
|
||
<li>在 <strong>_config.yml</strong>（如果有已存在的请删除）添加如下配置：</li>
|
||
</ol>
|
||
<p> repo 网址在个人仓库中 - 克隆/下载 - 复制，注意空格</p>
|
||
<p><code>deploy: type: git repo: https://gitee.com/fallcityv/fallcityv.git branch: master</code></p>
|
||
<ol start="3">
|
||
<li><p>运行 <code>hexo clean && hexo deploy |代替：（hexo d）</code> 。如出现<code>deploy done</code>则表示成功</p>
|
||
<p>注意：用户名填邮箱或手机号，输密码不会显示，输完回车即可。</p>
|
||
</li>
|
||
<li><p>打开 Gitee Pages 服务，部署目录空，直接更新或启动。</p>
|
||
</li>
|
||
</ol>
|
||
<h2 id="作业"><a href="#作业" class="headerlink" title="作业"></a>作业</h2><p>注册<code>gitee.com</code> ， 完成实名认证，将网站部署到公网</p>
|
||
</div><div class="post-footer"><div class="meta"><div class="info"><i class="fa fa-sun-o"></i><span class="date">2023-01-22</span><i class="fa fa-tag"></i><a class="tag" href="/categories/技术分享/" title="技术分享">技术分享 </a><span class="leancloud_visitors"></span></div></div></div></div><div class="share"><div class="evernote"><a class="fa fa-bookmark" href="" onclick="javascript:join_favorite()" ref="sidebar"></a></div><div class="weibo"><a class="fa fa-weibo" href="javascript:void((function(s,d,e){try{}catch(e){}var f='http://service.weibo.com/share/share.php?',u=d.location.href,p=['url=',e(u),'&title=',e(d.title),'&appkey=2924220432'].join('');function a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=620,height=450,left=',(s.width-620)/2,',top=',(s.height-450)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent)){setTimeout(a,0)}else{a()}})(screen,document,encodeURIComponent));"></a></div><div class="twitter"><a class="fa fa-twitter" target="_blank" rel="noopener" href="http://twitter.com/home?status=,http://www.marsway.red/2023/01/22/光速搭建个人博客网站！/,Mars之路,光速搭建个人博客网站！,;"></a></div></div><div class="pagination"><ul class="clearfix"></ul></div><script src="/js/visitors.js"></script><a id="comments"></a><div id="vcomments" style="margin:0 30px;"></div><script src="//cdn1.lncld.net/static/js/3.0.4/av-min.js"></script><script src="//cdn.jsdelivr.net/gh/xcss/valine@latest/dist/Valine.min.js"></script><script>var valine = new Valine({
|
||
el:'#vcomments',
|
||
notify:false || false,
|
||
verify:false|| false,
|
||
app_id:'',
|
||
app_key:'',
|
||
placeholder:'念念不忘，必有回响...',
|
||
path: window.location.pathname,
|
||
serverURLs: '',
|
||
visitor:true,
|
||
recordIP:true,
|
||
avatar:'mp'
|
||
})</script></div></div></div></div><script src="/js/jquery-migrate-1.2.1.min.js"></script><script src="/js/jquery.appear.js"></script><script src="/js/add-bookmark.js"></script><script src="/js/baidu-tongji.js"></script><script src="/live2dw/lib/L2Dwidget.min.js?094cbace49a39548bed64abff5988b05"></script><script>L2Dwidget.init({"pluginRootPath":"live2dw/","pluginJsPath":"lib/","pluginModelPath":"assets/","tagMode":false,"debug":false,"model":{"jsonPath":"/live2dw/assets/tororo.model.json"},"display":{"position":"left","width":200,"height":400,"hOffset":5,"vOffset":-38},"mobile":{"show":false,"scale":0.2},"react":{"opacityDefault":0.8,"opacityOnHover":0.2},"log":false});</script></body></html> |