13、探索非 React 的同构应用构建方案

探索非 React 的同构应用构建方案

1. 博客示例项目概述

在构建同构应用的探索中，我们以一个博客示例项目为基础展开。该博客应用有两个主要路由：主页路由（/）和文章详情路由（/post）。主页包含一个简单的头部和文章列表，点击文章可进入详情页查看文章正文和评论。

项目代码存于 GitHub 仓库： https://github.com/isomorphic-dev-js/chapter12-frameworks ，可通过以下命令克隆：

git clone https://github.com/isomorphic-dev-js/chapter12-frameworks

仓库结构如下：
- angular2 ：Angular 应用代码。
- ember-universal ：Ember 应用代码。
- nextjs ：基于 Next.js 构建的同构 React 应用代码。
- server ：运行简单数据 API 的代码。

1.1 UI 与组件分析

博客应用的 UI 较为清晰。主页头部有“Posts”链接可返回主页，下方是文章列表。点击文章后，应用加载对应的文章详情页，显示文章正文和评论列表。

1.2 共享模拟数据