计算机网站建设与管理是什么,网站分类查询,网站建设移交手续,html5网站框架前言“作为一个真正的码农#xff0c;不能没有自己的个人博客”#xff0c;这是我说的。惭愧的是#xff0c;入行两年多了都没搞起来#xff0c;这让我一度怀疑自己是个假程序员。昨天终于克服了心里的“犹豫”和“恐惧”#xff0c;尝试搭建了一把#xff0c;半天就搞好… 前言“作为一个真正的码农不能没有自己的个人博客”这是我说的。惭愧的是入行两年多了都没搞起来这让我一度怀疑自己是个假程序员。昨天终于克服了心里的“犹豫”和“恐惧”尝试搭建了一把半天就搞好了看着能用。搭建博客只是一个小任务为啥迟迟不能完成只能说明鄙人执行力太差。想的多做的少大多数时候我们只要开始行动之后好多问题都会迎刃而解了。引用最新网上很流行的一段话与君共勉之我们遇到什么困难也不要怕微笑着面对它消除恐惧的最好办法就是面对恐惧坚持才是胜利。加油奥利给因此干就完了。一些说明先来看下我搭建好的效果 和一般的使用Hexo、Jekyll、Hugo等博客框架搭建的博客可能有些差异。这个更像是一个Document API不过博客也是一些文章啦。使用的框架技术docsify框架基于Github Pages的站点部署我是在Windows 7下搭建的网上好些搭建博客的视频教程大部分用的是Macbook。没办法“实力确实不允许啊”我还挣扎在Windows的苦海中。等我有钱了我也要卖最好的Mac写最渣的代码。 准备工作1、要有git环境有github账号windows下安装git可以看下这篇Git简易教程之git简介及安装因为我们要使用Github Pages来部署我们的应用请先注册下github的账号。2、有node环境docsify框架需要有node环境的支持。上node.js的官网下载安装包此处下载Windows版本的点下一步一路安装下去即可。另外需要配置下环境变量。Windows下安装node环境请自行百度教程安装。3、简要说明一下步骤上docsify官网了解下里面有使用的步骤了。使用docsify命令生成文档站点在github上部署站点上docsify官网看一看地址https://docsify.js.org/#/ docsify官网 你没有看错docsify的官网就是用它自身的js框架搭建的。这种极简风我还是挺喜欢的。A magical documentation site generator 一款神奇的文档站点生成器最主要的特性是支持Markdown格式对程序员的博主们是很友好的。不用生成html文件写完MD格式的博客直接往上一放框架自己在运行时解析渲染成html页面。使用docsify命令生成文档站点安装docsify-cli 工具推荐安装 docsify-cli 工具可以方便创建及本地预览文档网站。npm i docsify-cli -g因为我们已经安装了node环境所以直接打开CMD窗口执行上面的命令就好了。初始化一个项目然后我们选择一个目录作为我们的博客站点目录。也就是项目要生成的目录。比如我在E盘下新建了一个myblogs的目录 打开CMD黑框cd到该目录执行如下命令docsify init ./docs执行完成后目录结构就会变成这样可以看到多了一个docs文件夹其实这个文件夹就是将来我们存放MD格式的博客文件的地方。与此同时docs目录下会生成几个文件。index.html 入口文件README.md 会做为主页内容渲染.nojekyll 用于阻止 GitHub Pages 会忽略掉下划线开头的文件启动项目预览效果到这里就可以启动项目然后看下效果了。使用下面命令启动项目docsify serve docs流程器输入http://localhost:3000 看着有点简陋不过框架已经搭好了接下来就是一些配置了。增加一些配置变身成真正的blogsite这里我们主要配置一下封面、左侧导航栏和首页其他的配置可以参考docsify官网。1、配置左侧导航栏在 E:\myblogs\docs目录下新建一个 _sidebar.md 的md文件内容如下- 设计模式 - [第一章节](desgin-pattern/Java面试必备手写单例模式.md) - [工厂模式](desgin-pattern/工厂模式超详解(代码示例).md) - [原型模式](desgin-pattern/设计模式之原型模式.md) - [代理模式](desgin-pattern/设计模式之代理模式.md)- Spring框架 - [初识spring框架](spring/【10分钟学Spring】(一)初识Spring框架.md) - [依赖注入及示例](spring/【10分钟学Spring】(二)一文搞懂spring依赖注入(DI).md) - [spring的条件化装配](spring/【10分钟学Spring】(三)你了解spring的高级装配吗_条件化装配bean.md)- 数据库这其实就是最基本的md文件里面写了一些链接而已。当然了我们诸如 desgin-pattern/Java面试必备手写单例模式.md 是相对路径目录下也要放 Java面试必备手写单例模式.md 文件才行。 只有上面的 _sidebar.md 文件是不行滴还需要在index.html文件中配置一下。在内嵌的js脚本中加上下面这句loadSidebar: true好了我们来看下效果。注意无需我们重新启动docsify serve保存刚才添加和修改的文件就行。2、配置个封面套路和上面配置左侧导航栏是一样的。首先新建一个 _coverpage.md 的md文件这里面的内容就是你封面的内容。# Myblogs 我要开始装逼了[CSDN](https://blog.csdn.net/m0_37965018)[滚动鼠标](#introduction)然后在index.xml文件中修改js脚本配置添加一句coverpage: true看下效果3、配置一个首页最后我们来配置下首页也就是封面完了之后第一个看到的界面。其实就是 E:\myblogs\docs 目录下 README.md 文件的内容。我们一直没有管他默认就是这个样子的 改一下放上自己牛逼的经历或者是标签。# 最迷人的二营长 [个人博客](https://blog.csdn.net/m0_37965018) [GitHub](https://github.com/Corefo/ github)看下效果部署到Github上没有域名 服务器怎么办不用担心我们有Github啊通过Github Pages的功能我们可以将个人站点托管到github上。登录github账号创建仓库登录github的官网创建一个仓库起个名字吧就叫myblogs。仓库创建好了我们使用第二种方式导入一个本地仓库(本地仓库还没有创建接下来会建一个)。创建本地仓库推送到github首先我们进入我们的本地博客站点目录也就是 E:\myblogs右键 GitBashHere 打开git命令行初始化一个仓库并提交所有的博客文件到git本地仓库。涉及命令如下git init // 初始化一个仓库git add -A // 添加所有文件到暂存区也就是交给由git管理着git commit -m myblogs first commit // 提交到git仓库-m后面是注释git remote add origin https://github.com/Corefo/myblogs.gitgit push -u origin master // 推送到远程myblogs仓库按上面的命令顺序操作不出意外的话我们的本地myblogs已经同步到了github上面了。刷新github的页面来看下。使用Github Pages功能建立站点这一步相当简单简单到令人发指在myblogs仓库下选中 Settings 选项然后鼠标一直向下滚动直到看到 GitHubPages 页签在Source下面选择 master branch/docs folder 选项。 好了ok了完美了这么简单。同时还会提示你在哪里去访问你的站点。 按照提示我们访问看看
