Forráskód Böngészése

replaced javascript markdown with jsx.

Tomi Cvetic 8 éve
szülő
commit
323b9c9f36
1 módosított fájl, 14 hozzáadás és 14 törlés
  1. 14 14
      LearnRedux/Videos.md

+ 14 - 14
LearnRedux/Videos.md

@@ -8,16 +8,16 @@
 
 ## Video 4: Setting up React Router
 
-```javascript
+```jsx
 import { Router, Route, IndexRoute, browserHistory } from 'react-router'
 
 const router = (
     <Router history={browserHistory}>
         <Route path='/' component={Main}>
-            <IndexRoute component={} \/>
-            <Route path='/view/:postId' \/>
-        <\/Route>
-    <\/Router>
+            <IndexRoute component={} />
+            <Route path='/view/:postId' />
+        </Route>
+    </Router>
 )
 
 render(router, document.getElementById('root'))
@@ -30,7 +30,7 @@ render(router, document.getElementById('root'))
 * One giant state for all data
 * it is called `store`
 
-```javascript
+```jsx
 import { createStore, compose } from 'redux'
 import { syncHistoryWithStore } from 'react-router-redux'
 import { browserHistory } from 'react-router'
@@ -47,7 +47,7 @@ export default store
 * actions are objects with two elements: type and payload
 * action creators are functions which return actions:
 
-```javascript
+```jsx
 function increment(index) {
     return {
         type: 'INCREMENT_LIKES',
@@ -73,7 +73,7 @@ function addComment(postId, author, comment) {
 * reducers return the updated state if there is a change, or the previous state
 * always start like this and then add some conditional functionality:
 
-```javascript
+```jsx
 function posts(state = [], action) {
     if (...) {
         return nextState
@@ -86,7 +86,7 @@ export default posts
 
 * combine them in a root reducer
 
-```javascript
+```jsx
 import { combineReducers } from 'redux'
 import { routerReducer } from 'react-router-redux'
 
@@ -128,7 +128,7 @@ export default rootReducer
 * actions invoke state changes
 * reducers change the state
 * the store provides a dispatch function
-    ```javascript
+    ```jsx
     // on the console
     $r.store.dispatch({type: 'INCREMENT', index: 1})
     ```
@@ -139,7 +139,7 @@ export default rootReducer
 * in regular React, the state or parts of it are propagated via props
 * in Redux, `connect` injects the data in the components that need it
 * for that, we wrap the main component with one that has the state and dispatcher propagated
-    ```javascript
+    ```jsx
     import { bindActionCreators } from 'redux'
     import { connect } from 'react-redux'
     import * as actionCreators from './actions/actionCreators'
@@ -168,7 +168,7 @@ export default rootReducer
 ## Video 12: Updating State with Reducers
 * Once you propagate the reducer function to the component, this is how you pass arguments to the function call
     - Remember that `<button onClick={this.props.function(argument)} ...>` would call the function at document load!
-    ```javascript
+    ```jsx
     <button onClick={this.props.function.bind(null, argument)} ...>
     ```
 
@@ -176,7 +176,7 @@ export default rootReducer
     - Makes testing easier.
     - Enables Redux dev tools, time travel etc.
 * Do the same as in React state handling: Copy, modify, return copy:
-    ```javascript
+    ```jsx
     function posts(state = [], action) {
         switch(action.type) {
             const i = action.index
@@ -195,7 +195,7 @@ export default rootReducer
 ## Video 13: Displaying the Single Photo Component
 * Polyfills are new ES6 functions cross compiled for old browsers through Babel. [Example for findIndex()][1]
 * You can use `findIndex()` to get a certain element of an array
-    ```javascript
+    ```jsx
     render () {
         const { postId } = this.props.params
         const i = this.props.posts.findIndex((post) => post.code === postId)