本篇文章将分为前台角度与后台角度来分析我是怎么开发的。
前台角度
主要资源

react.js
ant Design
for-editor
axios
craco-less
immutable
react-loadable
react-redux
react-router-dom
react-transition-group
redux
redux-immutable
redux-thunk
styled-components

模块页面

首页

登录注册

文章详情

文章评论

圈子

写圈子

搜索页

权限页

写文章

项目配置
项目目录

前台搭建项目步骤
一、使用稳定依赖管理工具

推荐你使用淘宝源

npm config set registry https://registry.npm.taobao.org

还有就是搭配依赖管理工具yarn
二、使用官方React脚手架

create-react-app my-project

三、精简项目文件夹

使用脚手架搭建的初始文件夹是这样的。

那么我们需要精简一下。注意原来的App.js我改成App.jsx。因为 React 使用 JSX 来替代常规的 JavaScript,所以用JSX比较好。

下面我们将要编辑几个文件:
src/index.js

// index.js
import React from ‘react’;
import ReactDOM from ‘react-dom’;
import App from ‘./App.jsx’;

ReactDOM.render(
,
document.getElementById(‘root’)
);

public/index.html

You need to enable JavaScript to run this app.

 
 

更多内容请见原文,原文转载自:https://blog.csdn.net/weixin_44519496/article/details/118668872

React与Koa一起打造一个仿稀土掘金全栈个人博客(技术篇)的更多相关文章

  1. React与Koa一起打造一个功能丰富的全栈个人博客(业务篇)

    前言 豆哥的个人博客又改版了,本版主要技术栈是前台用的React,后台用的Koa.博客改版的初衷是自己可以练练React(公司的项目部分要用React,我也没法啊,再说早晚得学).本文主要介绍博客的业 ...

  2. Netty+MUI从零打造一个仿微信的高性能聊天项目,兼容iPhone/iPad/安卓

    要说到微信,我相信是个人都应该知道,几乎人人都会安装这款社交APP吧,它已经成为了我们生活中不可缺少的一份子. 我记得我上大学那会刚接触Java,做的第一个小项目就是基于J2SE的聊天室,使用Java ...

  3. 如何实现一个 markdown 图片粘贴上传的博客后台系统

    如何实现一个 markdown 图片粘贴上传的博客后台系统 js 实现 drag & drop / copy & paste image uploader MongoDB 设计文档对象 ...

  4. 一个 Vue & Node 的全栈小项目

    约学 - 可以寻找一起自习的小伙伴的Web APP 一个基于 Vue & Node 的移动端全栈小项目 在线演示(请使用移动端查看效果) 源码地址: https://github.com/G- ...

  5. 【个人博客 hexo】一个小时就搭好属于自己的博客

    对于经常需要发博客的小伙伴来说,拥有一个属于自己的博客网站,听起来是不是很酷. 今天我就来告诉大家,怎么搭建一个属于自己的博客网站,我们需要的就是使用hexo+github来搭建我们自己博客系统. 你 ...

  6. 发起一个开源项目:基于 .NET 的博客引擎 fluss

    今天我们发起一个开源项目,它的名字叫 fluss,fluss 是 river 的德语. 百川归海,每一个博客就如一条河流,输入的是文字,流出的是知识,汇入的是知识的汪洋大海. 川流不息,fluss 是 ...

  7. 一个关于AM335X比较全面的笔记博客

    http://www.eefocus.com/marianna/blog/cate_18142_0.html

  8. 一个很有参考意义的unity博客

    http://blog.csdn.net/lyh916/article/details/45133101

  9. 转发一个关于下载qq无损音乐的博客

    import requests import json headers = { 'Host': 'c.y.qq.com', 'Referer': 'http://c.y.qq.com/', 'User ...

随机推荐

  1. 面试官:请分析一条SQL的执行

    最近一直在写<手撕MySQL系列>文章,我发现自己的切入点有一些问题,虽尝试深入探究MySQL中的一些关键特性,但对于MySQL的知识掌握不太能够形成较好的体系化的知识网络.我感到在对全局 ...

  2. DOM的事件传播机制

    在dom传播的过程中,一个事件有触发到响应,经历了三个过程: 1,目标的挖洞过程,先有html标签触发事件,然后向子标签一层一层传播,但未执行,,直到找到事件目标为止,这个过程叫做挖洞过程, 2,目标 ...

  3. partOne当堂测试代码

    /* ScoreInformation类*/public class ScoreInformation { private String stunumber;//学号 private String n ...

  4. 事务的隔离级别与MVCC

    提到数据库,你多半会联想到事务,进而还可能想起曾经背得滚瓜乱熟的ACID,不知道你有没有想过这个问题,事务有原子性.隔离性.一致性和持久性四大特性,为什么偏偏给隔离性设置了级别? 一切还得从事务说起. ...

  5. XCTF练习题---MISC---Training-Stegano-1

    XCTF练习题---MISC---Training-Stegano-1 flag:steganoI 解题步骤: 1.观察题目,下载附件 2.打开下载的图片文件,发现就是一个点,修改文件扩展名,还是说查 ...

  6. 基础学习:社会工程学---利用Kali下的setoolkit进行钓鱼网站制作

    利用Kali下的setoolkit进行钓鱼网站制作 1.打开kali2019,输入setoolkit,打开setoolkit模块 2.输入命令1,进入钓鱼攻击页面 3.输入命令2,进入web钓鱼攻击页 ...

  7. vue 设置动态标题

    在 router/index.js 文件中设置 meta:{title:'标题'} 和 router.beforeEach,即可实现功能, 代码如下: import { createRouter, c ...

  8. netty系列之:netty中的frame解码器

    目录 简介 LineBasedFrameDecoder DelimiterBasedFrameDecoder FixedLengthFrameDecoder LengthFieldBasedFrame ...

  9. 超全!华为交换机端口vlan详解~

    关注「开源Linux」,选择"设为星标" 回复「学习」,有我为您特别筛选的学习资料~ 华为交换机和其他品牌的交换机在端口的vlan划分上有一些区别,今天就和大家详细说说华为交换机的 ...

  10. 嵌入:CAN

    说下我的学习过程.刚到公司的时候我根本不知道什么是CAN,甚至连以太网和串口通讯都不懂.领导把USBCAN分析仪拿给我,把铜线短接上,用软件在CAN1窗口点下发送,CAN2窗口马上接收到了发送出来的数 ...