项目地址

预览地址

原文地址

记录最近做的一个 demo,前端使用 React,用 React Router 实现前端路由,Koa 2 搭建 API Server, 最后通过 Nginx 做请求转发。

这是第一篇,主要介绍下前端代码的构建、React router 使用中遇到问题,以及前端开发完成后部署相关工作。

功能介绍

GitCard 可以通过 GitHub 授权获取用户基本信息

  • 在首页模块,可以查看最近登录的用户,并点击头像查看该用户的详细信息
  • /Comment 模块中可以发表评论,并删除自己的评论
  • /Detail 模块中可以查看用户在 Github 上的基本信息(代码库,Follower、Following 以及更多开发的信息),你可以在这个基础上做更多有意思的事情,支持 Follow 和 Unfollow 操作,当然,你可以加上 Star 和 Unstar 操作,异曲同工。

    React + Node 单页应用「一」前端搭建的更多相关文章

    1. React + Node 单页应用「二」OAuth 2.0 授权认证 & GitHub 授权实践

      关于项目 项目地址 预览地址 记录最近做的一个 demo,前端使用 React,用 React Router 实现前端路由,Koa 2 搭建 API Server, 最后通过 Nginx 做请求转发. ...

    2. React构建单页应用方法与实例

      React作为目前最流行的前端框架之一,其受欢迎程度不容小觑,从这门框架上我们可以学到许多其他前端框架所缺失的东西,也是其创新性所在的地方,比如虚拟DOM.JSX等.那么接下来我们就来学习一下这门框架 ...

    3. 转载自 BotVS 「 珍藏版 」如何搭建一个完整的交易框架

      [img]http://dn-filebox.qbox.me/8c218c119046b2a25df2d9c7b00c1e0fa6899bdd.png[/img]NO:01 交易策略 ≠ 交易系统. ...

    4. 手把手教你把web应用丢到服务器上(单页应用+ 服务端渲染)

      前两篇文章中,我分别介绍了框架的搭建利用vue-cli + vant搭建一个移动端开发模板,并且把项目中axios请求和vuex的用法做了简要的介绍如何在项目里管理好axios请求与vuex.在这两篇 ...

    5. 记、基于react-router的单页应用

      现在用react写单页应用基本上都是用react-router做前端路由了吧!最近在使用react-router的过程中遇到了不少问题,在这里总结一下. 浏览器url react-router默认提供 ...

    6. 关于单页应用(SPA)的经验之谈

      时下SPA单页应用如火如荼,对前端乃至后端开发都带来不小的冲击和变革.笔者整理了下笔记,决定写一下以前基于iframe做单页博客的一些经验方法. 对于单页应用,笔者没有找到最官方的定义.在笔者看来,在 ...

    7. 「案例」让房东在 Airbnb 上展示他们的热情好客

      如何才能让房东准确的描述自己的房源,如何才能让房东充分的展示自己的房源.Airbnb 在这次更新里尝试去解决了这两个问题,让我们跟随作者的文笔去了解一下整个项目的经过. 关于本文 原文作者:Cecil ...

    8. 单页应用 cookies处理

      w Node & 单页应用 来做一个完整用户系统吧! - harryfyodor的前端专栏 - SegmentFaulthttps://segmentfault.com/a/119000000 ...

    9. Node.js + React + MongoDB 实现 TodoList 单页应用

      之前用 Ant Design 开发了一个项目,因此对 React 的特性有了一定的了解,React 使用封装组件的思想,组件各自维护自己的状态和 UI, 组件之间通过 props 传递数据和方法.当状 ...

    随机推荐

    1. 【重点突破】——Canvas技术绘制随机改变的验证码

      一.引言 本文主要是我在学习Canvas技术绘图时的一个小练习,绘制随机改变的验证码图片,虽然真正的项目里不这么做,但这个练习是一个掌握Canvas技术很好的综合练习.(真正的项目中验证码图片使用服务 ...

    2. 如何使用windows版Docker并在IntelliJ IDEA使用Docker运行Spring Cloud项目

      如何使用windows版Docker并在IntelliJ IDEA使用Docker运行Spring Cloud项目 #1:前提准备 1.1 首先请确认你的电脑是windows10专业版或企业版,只有这 ...

    3. poj2337欧拉回路要求输出路径

                           Catenyms Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 8368   Ac ...

    4. .Neter玩转Linux系列之一:初识Linux

      一.为什么要学习Linux (1)首先我们欣赏一下,曾经的微软是如何看待Linux的,是不是很惊讶,微软还是很可爱的(#^.^#) 如今的微软看待Linux的态度:有人说微软技术那么厉害,难道微软就不 ...

    5. CSS3D模型

      html部分 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> < ...

    6. mysql客户端(Navicat)远程登录操作遇到问题1142

      遇到此问题的原因是:用户user对数据库test 无权限操作. 解决方法:mysql> grant all privileges on test.* to user@'localhost' id ...

    7. 表空间tablespace,数据文件datafiles,和控制文件control files介绍

      https://docs.oracle.com/cd/B19306_01/server.102/b14220/physical.htm#i5919 本文系翻译 表空间tablespace,数据文件da ...

    8. HDU1423 LCIS

      1,先离散化,然后DP: 注意这个解法中,dp[i][j][k]代表a序列中前i个和b序列中前j个数结尾为k或小于k时的最大. 但是由于i是单增(一次1->n),而j反复变化(多次1->m ...

    9. 跨平台的 NodeJS 组件解决 .NetCore 不支持 System.Drawing图形功能的若干问题

      问题 生成缩略图 生成验证码 生成二维码 给图片加水印 外部引用 Node  不解释  https://nodejs.org/en/download/ sharp 高性能缩略图  https://gi ...

    10. tomcat 内存大小配置

      Tomcat本身不能直接在计算机上运行,需要依赖于硬件基础之上的操作系统和一个java虚拟机.JAVA程序启动时JVM都会分配一个初始内存和最大内存给这个应用程序.这个初始内存和最大内存在一定程度都会 ...