自己动手搭建一个博客发布系统之环境初始化

seo优化, 免费网站, 网站搭建   2018年06月27日 18:39  

现今常见的博客搭建多依靠GitHub载体,但是归根结底不管用的什么配置,需要的就是把已经编译好的系统部署到GitHub上面,以Hexo上为例,这样可以帮助节省不少复杂的操作,自己要做仅仅是上传博客内容就OK了。

在push代码到GitHub上,还需要注意,新建一个io后缀的项目(注意每账号只可以有一个io项目),当每次把已经编译好的代码push到github上之后,github就会自动部署,再一次访问改地址,就得到一个博客项目了。

这样它会实现自动部署。

本次文章重点不是博客搭建的流程,而是通过这个项目来学习前端的一些技术:

利用create-react-app跑通项目

webpack的配置详解

nodejs的文件操作以及命令行操作

一些React本身的知识,比如生命周期,组件书写,路由等

数据管理中心,mobx/redux的使用

一些babel的配置与使用

初始化create-react-app

首先需要安装一下node环境,node本身带有npm工具,所以安装好node之后就可以是用npm命令了。个人习惯原因,我更喜欢是用yarn,这是个和npm一样的包管理工具,可以直接npm通过命令来安装yarn。

安装命令如下npm install -g yarn,-g标识全局安装,这样就可以在任何一个路径下面使用了。

好了,node和yarn就是前期要准备的安装环境了。

第一步,全局安装create-react-app

任何一个路径键入yarn global add create-react-app

第二步,创建本地的create-react-app

接下来,在一个你希望存储代码的文件夹下输入如下命令,他会自动帮你创建好程序。

create-react-app blog,然后在当前路径进入到,创建的文件夹,cd blog

第三步,初始化开发环境

首先安装依赖包,yanr install,然后create-react-app默认是把配置项给隐藏掉的,所以还要键入如下命令。yarn run eject然后他会问你yes or no,你输入y就好了。声明一下,这是个单项操作,eject之后就回不去了。

现在看一下开发的目录:

最后简单说明一下项目中的几个基本文件都是什么。

在crc目录下的是我们前端的代码;

package.json中则是我们依赖包的引入文件,在这里边添加的文件就是我们依赖包中的文件;

install命令就是下载依赖包;

node_modules是下载依赖报的存放地址;

public顾名思义就是存放的一些公共文件;

scripts中测试运行脚本,当我们执行yarn start命令的时候,就是执行start.js文件中的内容;

在了解了以上这些知识后是不是感觉代码也不至于叫人却步,当然在强调一次的是这仅仅是对前端的一个基础操作、代码的了解,如果真正涉及项目中去解决问题,还是需要很大的代码量,才可以应对。这部分内容除了帮助我们学习和了解前端代码、思想,以及帮我们搭建博客,对于前端开发的就不要多想了。

您或许对下面这些文章有兴趣:                    本月吐槽辛苦排行榜

看贴要回贴有N种理由!看帖不回贴的后果你懂得的!


评论内容 (*必填):
(Ctrl + Enter提交)   

部落快速搜索栏

各类专题梳理

网站导航栏

X
?
返回顶部
  • 喀喇昆仑深处的壮美 中国国家地理网 2019-06-19
  • 吴舜泽:环保产业高质量发展非常重要 2019-06-19
  • 一语惊坛(6月5日):担当新使命,展现新作为。 2019-05-23
  • 国家发改委官员:完成全年降电价目标很有信心 2019-05-23
  • 以保法治反腐公信力,以保中国社会普正义。 2019-05-18
  • 端午假期 广州旅游业吸金37亿 2019-05-18
  • 高清:俄罗斯世界杯揭幕战即将打响 球馆外戒备森严 2019-05-04
  • 我国社会组织正成为全球治理体系中的新生力量 2019-05-04
  • 印度网友很吃惊中国全年24小时不断电 除了台湾 2019-05-03
  • 乌鲁木齐市文庙特色活动庆端午 2019-04-27
  • 中国公民出入境排队将不超半小时--旅游频道 2019-04-27
  • 庄聪生:企业应正确处理“义”与“利”的关系 2019-04-22
  • 北京市场监管总局:网络促销不得先涨再折 2019-04-22
  • 从副科开始,即使没有贪污、索贿、受贿的勾当,也有行贿买官的勾当。 2019-04-18
  • 2017全国“创新社会治理典型案例”征集函 2019-04-18
  • 网球比赛 女生脱内衣真人游戏 万州区福彩中心 吉林11选5前三位跨度遗漏值尾走势图 今天内蒙古快3开奖结果查询 总进球数推荐 七星彩808彩票论坛网站 海南体彩app合法吗 款4吉林时时彩彩票查询 大乐透彩票开奖查询 qq三张牌注册 浙江体彩6+1中奖规则 排列3和值遗漏值尾 双色球杀号彩客网 湖北11选5走势图牛