目录

  • 项目简介
  • 在线演示
  • 截图演示
  • 踩坑

项目简介(1/4)

  • Github: https://github.com/bergwhite/v2ex-react
  • 项目使用React、Reac-router、Axios、ANTD UI进行开发
  • 项目兼容移动端
  • 使用Nginx代理V2EX API并支持CORS跨域
  • 另外还写过一个Vue版V2EX项目,v2ex-vue:https://x.bw2.me/#/
  • 以及nodejs聊天室,nchat:http://y.bw2.me:8086
  • 找工作,北京。联系方式:YmVyZ3doaXRlc0BnbWFpbC5jb20=
  • 觉得对你有帮助的话,欢迎给个star,谢谢

在线演示(2/4)

截图演示(3/4)

导航页面

文章页面

分类页面

用户和主题页面

踩坑(4/4)

支持IE

在IE中的报错,TypeError: 对象不支持“startsWith”属性或方法,通过添加babel-polyfill解决


import babel-polyfill for IE9+

通过Nginx配置路由

直接访问二级路由会404,通过nginx把页面定向到inedx.html,让react-router接管页面路由


location / {
try_files $uri /index.html
}

开启Gzip

页面访问速度过慢,于是开启Gzip对数据压缩传输


gzip on; # 开启Gzip
gzip_comp_level 6; # 级别为1-9,9是最高的压缩比
gzip_types *; # 压缩所有类型文件
gzip_vary on; # 添加响应头

React 版 V2EX 社区( react & react-router & axios & antd ui)的更多相关文章

  1. [React] react+redux+router+webpack+antd环境搭建一版

    好久之前搭建的一个react执行环境,受历史影响是webpack3.10.0和webpack-dev-server2.7.1的环境,新项目准备用webpack4重新弄弄了,旧的记录就合并发布了(在没有 ...

  2. React版/Vue版都齐了,开源一套【特别】的后台管理系统...

    本项目主要基于Elux+Antd构建,包含React版本和Vue版本,旨在提供给大家一个简单基础.开箱即用的后台管理系统通用模版,主要包含运行环境.脚手架.代码风格.基本Layout.状态管理.路由管 ...

  3. React:快速上手(6)——掌握React Router

    React:快速上手(6)——掌握React Router 引入Router 安装 npm install react-router-dom 基础组件 React Router中有三种类型的组件:路由 ...

  4. react 后台(一)react + redux + react-route + webpack+ axios + antd+styled-components(替代less)

    create-react-app my-admin 项目技术栈 react + redux + react-route + webpack+ axios + antd+styled-component ...

  5. react动画难写?试试react版transformjs

    简介 transformjs在非react领域用得风生水起,那么react技术栈的同学能用上吗?答案是可以的.junexie童鞋已经造了个react版本. 动画实现方式 传统 web 动画的两种方式: ...

  6. (转)2019年 React 新手学习指南 – 从 React 学习线路图说开去

    原文:https://www.html.cn/archives/10111 注:本文根据 React 开发者学习线路图(2018) 结构编写了很多新手如何学习 React 的建议.2019 年有标题党 ...

  7. 2、手把手教React Native实战之从React到RN

    ###React简介 RN是基于React设计,了解React有助于我们开发RN应用: React希望将功能分解化,让开发变得像搭积木一样,快速而且可维护 React主要有如下3个特点: *作为UI( ...

  8. 从零开始react实战:云书签-1 react环境搭建

    总览篇:react 实战之云书签 本篇是实战系列的第一篇,主要是搭建 react 开发环境,在create-react-app的基础上加上如下功能: antd 组件库按需引入 ,支持主题定制 支持 l ...

  9. React Canvas:高性能渲染 React 组

    React Canvas 提供了使用 Canvas 渲染移动 Web App 界面的能力,替代传统的 DOM 渲染,具有更接近 Native App 的使用体验.React Canvas 提供了一组标 ...

随机推荐

  1. COGS 1507. [IOI2000]邮局

    1507. [IOI2000]邮局 ★☆   输入文件:postoffice.in   输出文件:postoffice.out   简单对比时间限制:1 s   内存限制:256 MB [题目描述] ...

  2. POJ1942

    Paths on a Grid Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 24236   Accepted: 6006 ...

  3. WCF基础之大型数据和流

    在WCF的实际应用中,有可能存在10M,100M甚至G级别的传输,这个时候我们就不得不考虑编码和传输模式,当然得选择相应的绑定(binding) 如上图所示,我可以直接使用系统提供的相应绑定,然后设置 ...

  4. WCF基础之消息协定

    通常定义消息的架构,使用数据协定就够了,但是有时必须将类型精确映射到soap消息,方法两种:1.插入自定义soap标头:2.另一种是定义消息的头和正文的安全属性.消息协定通过MessageContra ...

  5. [note]fhq_treap

    fhq_treap 这东西据说是某个叫范浩强的神仙搞出来的, 他的这种treap可以不用旋转并且资磁很多平衡树操作, 复杂度通过随机的键值来保证(树大致平衡,期望一次操作复杂度\(logn\)) 依靠 ...

  6. 我的Android进阶之旅------>MIME类型大全

    今天在实现一个安装apk的代码中看到一段代码为:application/vnd.android.package-archive,不知其意,所以百度了一下,了解到这是一种MIME的类型,代表apk类型. ...

  7. struts2中的ModelDriven使用

    http://www.cnblogs.com/Topless/archive/2012/01/17/2324980.html 例子都为struts2中的文档例子 JSP提交数据:   <s:fo ...

  8. (转)Javascript模块化编程(三):require.js的用法

    这个系列的第一部分和第二部分,介绍了Javascript模块原型和理论概念,今天介绍如何将它们用于实战. 我采用的是一个非常流行的库require.js. 一.为什么要用require.js? 最早的 ...

  9. UML建模:学习笔记(1)

    UML:学习笔记(1) 事物 结构事物 类: 接口: 协作:(定义元素之间的相互作用) 用例:(在系统外部和系统交互的人) 组件:(描述物理系统的一部分) 节点:(一个节点可以被定义为运行时存在的物理 ...

  10. 教你如何写一个 Yii2 扩展

    前言 把一系列相关联的功能使用模块开发,好处多多,维护起来很方便,模块还可以单独发布出去,让下一个项目之间使用,真是方便. 下面我就写一个开发扩展的简单教程. Gii gii 自带帮助我们生成一个基本 ...