idoc
idoc copied to clipboard
github-notetaker应用开发教程的几点补充
关于教程内容的几点补充
1.bootstrap
- 脚手架项目有
bootstrap
,而文章中的代码里面没有,因为计划把bootstrap
的引入使用放到第三章了。
2.路由
- 添加
About
容器组件,用于展示路由的功能 -
history
和react-router
的关系。React Router
是建立在history
之上的。 简而言之,一个 history 知道如何去监听浏览器地址栏的变化, 并解析这个URL
转化为location
对象, 然后 router 使用它匹配到路由,最后正确地渲染对应的组件。所以使用react-router
的时候请将history
一起下载,而且有可能会有版本问题导致的坑 -
hashHistory
和browserHistory
有什么区别hash:
它用到的是 URL 中的 hash(#)部分去创建形如example.com/#/some/path
的路由。browser:
它使用 History API 在浏览器中被创建用于处理 URL,新建一个像这样真实的URL
-
react-router
的其他用法简介:Link、NotFound、Redirect、onEnter、onLeave、IndexLink
总的来说,react-router的内容还是不少的,当前项目以部分功能跑通使用为主,详细的使用会有单独的文章讲解。
3.history-api-fallback
-
enables support for history API fallback.
4.api.github.com
- 如果不太清楚通过github API获取数据的话,没关系,请到这里看一下:
https://developer.github.com/v3
- 访问链接感受下:https://api.github.com/users/guoyongfeng
{
"login": "GuoYongfeng",
"id": 8686869,
"avatar_url": "https://avatars.githubusercontent.com/u/8686869?v=3",
"gravatar_id": "",
"url": "https://api.github.com/users/GuoYongfeng",
"html_url": "https://github.com/GuoYongfeng",
"followers_url": "https://api.github.com/users/GuoYongfeng/followers",
"following_url": "https://api.github.com/users/GuoYongfeng/following{/other_user}",
"gists_url": "https://api.github.com/users/GuoYongfeng/gists{/gist_id}",
"starred_url": "https://api.github.com/users/GuoYongfeng/starred{/owner}{/repo}",
"subscriptions_url": "https://api.github.com/users/GuoYongfeng/subscriptions",
"organizations_url": "https://api.github.com/users/GuoYongfeng/orgs",
"repos_url": "https://api.github.com/users/GuoYongfeng/repos",
"events_url": "https://api.github.com/users/GuoYongfeng/events{/privacy}",
"received_events_url": "https://api.github.com/users/GuoYongfeng/received_events",
"type": "User",
"site_admin": false,
"name": "GuoYongfeng",
"company": "Yonyon.inc",
"blog": "http://guoyongfeng.github.io/idoc/",
"location": "Beijing City, Haidian District North Road No. 68, UFIDA Software Park",
"email": "[email protected]",
"hireable": null,
"bio": null,
"public_repos": 70,
"public_gists": 0,
"followers": 57,
"following": 36,
"created_at": "2014-09-07T15:07:31Z",
"updated_at": "2016-03-26T01:01:22Z"
}
github-notetaker-app整体组件划分示意图
:+1: