React与Koa一起打造一个仿稀土掘金全栈个人博客（技术篇）

前言

我的个人博客样式布局是仿的稀土掘金 ，个人博客线上网址为https://www.maomin.club/ ,也可以百度搜索前端历劫之路 。为了浏览体验，可以用PC浏览器浏览。

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

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.

更多请见：http://www.mark-to-win.com/tutorial/50726.html