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

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. 基于kubernetes的分布式限流

    做为一个数据上报系统,随着接入量越来越大,由于 API 接口无法控制调用方的行为,因此当遇到瞬时请求量激增时,会导致接口占用过多服务器资源,使得其他请求响应速度降低或是超时,更有甚者可能导致服务器宕机 ...

  2. 一行代码,让 VS Code 内置 PDF 阅读器变成深色模式

    使用 CSS/JS 简单实现 PDF 深色模式.

  3. Hadoop安装部署

    Hadoop伪分布式搭建 1.准备Linux环境 ①开启网络,ifconfig指令查看ip ②修改主机名为自己名字(hadoop) vim /etc/sysconfig/network NETWORK ...

  4. 改造@vue/cli项目为服务端渲染-ServerSideRender

    VUE SEO方案二 - SSR服务端渲染 在上一章中,我们分享了预渲染的方案来解决SEO问题,个人还是很中意此方案的,既简单又能解决大部分问题.但是也有着一定的缺陷,所以我们继续来看下一个方案--服 ...

  5. jointJS初使用随记

    jointJs使用随记 1.下载与安装 前提:一个健康良好且干净的vue脚手架项目. 还是普遍的安装方式 yarn:yarn add jointjs npm:npm install jointjs 还 ...

  6. Python 中删除列表元素的三种方法

    列表基本上是 Python 中最常用的数据结构之一了,并且删除操作也是经常使用的. 那到底有哪些方法可以删除列表中的元素呢?这篇文章就来总结一下. 一共有三种方法,分别是 remove,pop 和 d ...

  7. Java创建boolean型数组

    Java如何声明并初始化一个boolean型的数组? public class Main{ static boolean[] arr1 = new boolean[20]; public static ...

  8. 面试官:请用SQL模拟一个死锁

    文章首发于公众号:BiggerBoy 有读者说面试被问到怎么用SQL模拟数据库死锁? 这位读者表示对Java中的死锁还是略知一二的,但是突然用SQL写死锁的案例之前还真没遇到过,这个问题没答上来.所以 ...

  9. 华硕主板安装Ubuntu双系统无法启动解决办法

    问题描述: 在安装完Ubuntu后,开机后没有启动项可以选择,而是直接进入win10系统. 解决办法: 开机进入bios,选择 高级模式 (Advance model),进入 启动(boot)选项卡, ...

  10. 项目文章|DNA(羟)甲基化研究揭示铁离子依赖表观调控促进狼疮致病性T细胞分化|易基因

    易基因(羟)甲基化DNA免疫共沉淀测序(h)MeDIP-seq研究成果见刊<Journal of Clinical Investigation> 2022年5月2日,中南大学湘雅二医院赵明 ...