7.25日学习记录

1.html+css+js (基本) js(没掌握好)
2.简单的框架：bootstarp jq 插件 （百度） 一些效果插件（跟着文档教程很容易上手的） 好比移动端有一个(swiper) 轮播插件
3.原来的MVC架构( 把咱们前端分为3层 M 是数据层 V 视图层 C 控制层 中间层 )
4. 先后端分离以后， 前端在不会有任何后端代码的参与(MVVM VUE react augular avloan )
5.开发的思想 模块化，工程化，（前端应该页面复杂后，多人协做开发会很困难，因此就出来了模块化, 就是说每个人负责一个模块，sea.js require.js 好比这些工具都是基于几个标准进行开发，(AMD common,js)
）

6.工程化，咱们的工程化理解就是说把咱们开发应用当成一个工程去作，那么一个工程（把每一部分的应用单独抽离出来，可是最后又是须要咱们进行整合的） (webpack，grunt,glup)
7.优化(如何去减小用户的带宽量，减少咱们页面的开发体积，以及咱们须要加载业务的大小)(最重要的，也是最难的) (css+js+img+http+cdn+dns)
8.如何提升咱们代码质量的一些工具(开发的思想，函数式编程，一些优化算法，一些架构)
9.总结来讲（前端都是在基于咱们的页面开发 围绕的就是咱们页面以及用户体验（流畅度）)
10。为了去解决问题

 

7.25 22-23:30: 跟着一块儿看下react 一块儿的技术栈是什么样子的； （react-router,redux,react-redux）

一：读react-router文档的记录以及理解:

1.基本用法：    

<Router> <Route path="/" component={App}> <Route path="about" component={About} /> <Route path="inbox" component={Inbox}> <Route path="messages/:id" component={Message} /> </Route> </Route> </Router>

2.如何配置路由：、
组件式的配置：

const routes = (

<Route>

<Route path="/" component={App}>

<Route path="/houseCheck" getComponent={houseCheck1} />

<Route path="/houseManage" getComponent={houseManage1} />

<Route path="/houseDetail/:houseId" getComponent={houseDetail1} />

<Route path="/roomDetail/:houseId/:roomId" getComponent={roomDetail1} />

<Route path="/popCheck" getComponent={popCheck1} />

<Route path="/map" getComponent={map} />

<Route path="/test" getComponent={test} query={{'name': 'dupi'}} />

</Route>

<Route path="/login" getComponent={Login1}></Route>

</Route>

);

 

字面量的配置：

const routeConfig = [ { path: '/', component: App, indexRoute: { component: Dashboard }, childRoutes: [ { path: 'about', component: About }, { path: 'inbox', component: Inbox, childRoutes: [ { path: '/messages/:id', component: Message }, { path: 'messages/:id', onEnter: function (nextState, replaceState) { replaceState(null, '/messages/' + nextState.params.id) } } ] } ] } ] 

 

配置完成如何利用路由进行跳转：

React.render(<Router routes={routeConfig} />, document.body)


默认会有一个路由匹配机制：
 history：具体看文档