React与Koa一起打造一个仿稀土掘金全栈个人博客(技术篇)
本篇文章将分为前台角度与后台角度来分析我是怎么开发的。
前台角度
主要资源
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一起打造一个仿稀土掘金全栈个人博客(技术篇)的更多相关文章
- React与Koa一起打造一个功能丰富的全栈个人博客(业务篇)
前言 豆哥的个人博客又改版了,本版主要技术栈是前台用的React,后台用的Koa.博客改版的初衷是自己可以练练React(公司的项目部分要用React,我也没法啊,再说早晚得学).本文主要介绍博客的业 ...
- Netty+MUI从零打造一个仿微信的高性能聊天项目,兼容iPhone/iPad/安卓
要说到微信,我相信是个人都应该知道,几乎人人都会安装这款社交APP吧,它已经成为了我们生活中不可缺少的一份子. 我记得我上大学那会刚接触Java,做的第一个小项目就是基于J2SE的聊天室,使用Java ...
- 如何实现一个 markdown 图片粘贴上传的博客后台系统
如何实现一个 markdown 图片粘贴上传的博客后台系统 js 实现 drag & drop / copy & paste image uploader MongoDB 设计文档对象 ...
- 一个 Vue & Node 的全栈小项目
约学 - 可以寻找一起自习的小伙伴的Web APP 一个基于 Vue & Node 的移动端全栈小项目 在线演示(请使用移动端查看效果) 源码地址: https://github.com/G- ...
- 【个人博客 hexo】一个小时就搭好属于自己的博客
对于经常需要发博客的小伙伴来说,拥有一个属于自己的博客网站,听起来是不是很酷. 今天我就来告诉大家,怎么搭建一个属于自己的博客网站,我们需要的就是使用hexo+github来搭建我们自己博客系统. 你 ...
- 发起一个开源项目:基于 .NET 的博客引擎 fluss
今天我们发起一个开源项目,它的名字叫 fluss,fluss 是 river 的德语. 百川归海,每一个博客就如一条河流,输入的是文字,流出的是知识,汇入的是知识的汪洋大海. 川流不息,fluss 是 ...
- 一个关于AM335X比较全面的笔记博客
http://www.eefocus.com/marianna/blog/cate_18142_0.html
- 一个很有参考意义的unity博客
http://blog.csdn.net/lyh916/article/details/45133101
- 转发一个关于下载qq无损音乐的博客
import requests import json headers = { 'Host': 'c.y.qq.com', 'Referer': 'http://c.y.qq.com/', 'User ...
随机推荐
- Java设计模式——抽象工厂模式
抽象工厂模式也是创建模式,可以把它理解成创建工厂的工厂,这种模式也是我们经常使用的.在抽象工厂中的接口是用来创建工厂的,每个生成的工厂又都可以按照工厂模式创建其他对象. 举例说明: 创建Shape接口 ...
- golang调用海康sdk
git地址:https://gitee.com/mimo431/hcnet-sdk_golang 网络不太流畅,先传gitee上 参考链接: https://www.cnblogs.com/dust9 ...
- css 实现输入效果
<template> <h1>Pure CSS Typing animation.</h1> </template> <script> ...
- 用于激光雷达的 APD,SPAD 和 SiPM 分析
1. 术语及定义 1.1 激光雷达,Light Detection And Range, LiDAR 发射激光光束,并接收回波以获取目标三维和/或速度信息的系统: 1.2 机械旋转激光雷达,Mech ...
- java高级用法之:JNA类型映射应该注意的问题
目录 简介 String Buffers,Memory,数组和Pointer 可变参数 总结 简介 JNA提供JAVA类型和native类型的映射关系,但是这一种映射关系只是一个大概的映射,我们在实际 ...
- git 在 pull 或者合并分支的时候会遇到下图这个界面
可以不管(直接进入 3, 4 步), 如果要输入解释的话就需要 按键盘字母 i 进入 insert 模式 修改最上面那行黄色合并信息,可以不修改 // 黄色内容为默认的合并信息; 按键盘左上角 & ...
- 网络爬虫、Pandas
网络爬虫.Pandas Pandas 是 Python 语言的一个扩展程序库,用于数据分析. Pandas 是一个开放源码.BSD 许可的库,提供高性能.易于使用的数据结构和数据分析工具. Panda ...
- 配置Linux的时钟同步
公众号关注 「开源Linux」 回复「学习」,有我为您特别筛选的学习资料~ Ubuntu系统默认的时钟同步服务器是ntp.ubuntu.com,Debian则是0.debian.pool.ntp.or ...
- 北航内核操作系统-lab1
1.实验目的. 2.实验内容. 2.1Exercise 1.1 请修改 include.mk 文件,使交叉编译器的路径正确.之后执行 make指令,如果配置一切正确,则会在gxemul 目录下生成v ...
- 探索ABP基础架构-下
配置应用程序 ASP.NET Core 的配置系统提供了一个基于键值对的配置方法.它是一个可扩展的系统,可以从各种资源中读取键值对,例如 JSON 设置文件.环境变量.命令行参数等等. 设置配置值 默 ...