Index
A
- application design
- about / Three aspects of a SPA design, The application design
- wireframes, creating / Creating wireframes
- data entities / Main data entities and the API
- API / Main data entities and the API
- main views / Main views, site map, and routes
- site map / Main views, site map, and routes
- routes / Main views, site map, and routes
- application design, blog application
- wireframes, creating / Creating wireframes
- data entities / Data entities
- main views / Main views and the sitemap
- sitemap / Main views and the sitemap
- application header
- about / The application header
- asynchronous module definition (AMD)
- about / Choosing a build system, AMD
B
- Babel / Compiling the modern JS syntax and JSX templates
- Babel tool
- URL / Decompiling JSX
- base styles
- about / Base styles
- BasicInput component
- about / The BasicInput component
- blog application
- application design / Application design
- development environment, preparing / Preparing the development environment
- starting / Starting the app
- directory structure / The directory structure
- mock database / The mock database
- index.html file / index.html
- js/app.jsx / js/app.jsx
- main views / Main views
- views, linking with React Router / Linking views with React Router
- enhancements / Final thoughts, Level up the blog app
- improvements / Suggested improvements
- blog application, considerations
- about / Considerations before starting
- React render function, defining / React and rendering
- browser support / Browser support
- form validation / Form validation
- Bootstrap
- build system
- about / Three aspects of a SPA design, Build systems
- selecting / Choosing a build system
- module systems / Module systems
C
- C.R.U.D. (create, read, update, and delete) / Main data entities and the API
- cardflipanimation.zip file
- clockanimation.zip file
- URL / Clock animation
- code
- listings / Code manifest
- CommonJS
- about / Choosing a build system, CommonJS
- component composition
- simple components, composing / How to compose simple components
- with behavior / Composing components with behavior
- with behavior, working / How it works
- children, accessing / Accessing a component's children
- component lifecycle
- about / Component lifecycle - mounting and unmounting
- mounting / Component lifecycle - mounting and unmounting
- unmounting / Component lifecycle - mounting and unmounting
- events, updating / Component lifecycle – updating events
- working / How it works
- controlled components
- with read-only input / Controlled components - the read-only input
- with read and write input / Controlled components - the read and write input, How it works
- one-way data flow model / Isn't that harder than it needs to be?
- used, for creating simple form / Controlled components – a simple form, How it works
- best practices / But what about the best practices?
- cookies
- reading / Reading and writing cookies
- writing / Reading and writing cookies
- create user view
- about / The create user view
- mixins / Mixins and lifecycle methods
- life cycle methods / Mixins and lifecycle methods
- user profile image / The user profile image
- form validation / Form validation and submission
- form submission / Form validation and submission
- CSS preprocessors
- about / CSS preprocessors
- LESS / CSS preprocessors
- SASS / CSS preprocessors
- CSS transitions
- with class switching / CSS transitions using class switching
- JavaScript code / JavaScript code
- CSS source / CSS source
D
- Data Access Objects (DAO)
- about / Validation types
- DELETE / Main data entities and the API
- dependencies
- installing / Installing Node and its dependencies
- dependency injection (DI)
- about / Choosing a build system
- development environment, blog application
- preparing / Preparing the development environment
- Node, installing / Installing Node and its dependencies
- dependencies, installing / Installing Node and its dependencies
- Webpack, installing / Installing and configuring Webpack
- Domain Specific Language (DSL)
- working / How to compose simple components
- DOM enter and exit
- animating / Animating DOM enter and exit
- popover menu / Popover menus
- JavaScript source / JavaScript source, JavaScript source
- CSS source / CSS source, CSS source
- list, filtering / List filtering
- Dumb components
- dynamic components
- about / Dynamic components
- UserRow component / How it works
- UserList component / How it works
E
- easing
- about / Animation terms
- ECMAScript 6 (ES6)
F
- Fiddle
- Flexbox
- about / CSS source
- Flux
- about / Front-end models
- dispatcher / Front-end models
- stores / Front-end models
- actions / Front-end models
- forms
- about / Forms
- controlled components / Controlled components - the read-only input
- creating, with controlled components / Controlled components – a simple form, How it works
- refactoring / Refactoring the form to be data driven, How it works
- form submission
- handling / Form submission
- form utilities mixin
- about / The form utilities mixin
- front-end architecture components
- about / Three aspects of a SPA design, Front-end architecture components
- front-end router / The front-end router
- front-end models / Front-end models
- views / Views, view models, and view controllers
- view models / Views, view models, and view controllers
- view controllers / Views, view models, and view controllers
- messaging / Messaging and eventing
- eventing / Messaging and eventing
- utilities, requisites / Other utility needs
G
- GET / Main data entities and the API
- GitHub repository
- URL / Getting the code
- Graphics Processing Unit (GPU)
- about / React and rendering
- Grunt
- Gulp
H
- Hello React example
- about / Hello React
- source code, URL / Hello React
I
- immediately invoking function expression (IIFE)
- about / AMD
- infinite scroll
- loading / Infinite scroll loading
- code manifest / Infinite scroll code manifest
- posts store, modifying / Modifying the posts store
- post list component, modifying / Modifying the post list component
J
- JsFiddle
- URL / How it works
- JS syntax
- compiling / Compiling the modern JS syntax and JSX templates
- JSX
- about / JSX
- working with / How it works, Decompiling JSX
- decompiling / Decompiling JSX
- render result, structure / Structure of render result
- JSX templates
- compiling / Compiling the modern JS syntax and JSX templates
K
- keyframes
- about / Animation terms
L
- LASS
- about / CSS preprocessors
- lifecycle methods
- about / Mixins and lifecycle methods
- listfilteranimation.zip file
- URL / List filtering
- loader component
- loaders
- log in view
- about / The log in view
M
- mixins
- about / Mixins, Mixins and dependencies, Mixins and lifecycle methods
- implementing / How it works
- cookies, writing / Reading and writing cookies
- cookies, reading / Reading and writing cookies
- form utilities mixin / The form utilities mixin
- module systems
- about / Module systems
- CommonJS / CommonJS
- AMD (Asynchronous Module Definition ) / AMD
- selecting / Our module choice
- Mozilla Developer Network (MDN) cookies
N
- Node
- installing / Installing Node and its dependencies
- URL / Installing Node and its dependencies
- Node Package Manager (NPM)
- about / Getting the code
P
- polyfills / Compiling the modern JS syntax and JSX templates
- about / Browser support
- popoveranimation.zip file
- URL / Popover menus
- popover menus
- creating / Popover menus
- POST / Main data entities and the API
- post create/edit view
- about / Post create/edit
- mixins / Mixins and lifecycle methods
- lifecycle methods / Mixins and lifecycle methods
- form submission / Form submission
- post list component
- about / The post list component
- adding, to user view / The user view
- post list view / The post list view
- posts store
- about / The posts store
- post views
- about / Post views
- post create/edit / Post create/edit
- summary view mode / The post view
- full view mode / The post view
- post list component / The post list component
- post list view / The post list view
- presets
- about / The module section
- props
- about / props
- working with / How it works
- propTypes, using / propTypes
- getDefaultProps method, defining / getDefaultProps
- PUT / Main data entities and the API
R
- React-Motion animation library
- using / Using the React-Motion animation library
- working with / How React-Motion works
- used, for animating clock / Clock animation
- JavaScript source / JavaScript source
- CSS source / CSS source
- react-validation-mixin example
- code, obtaining / Getting the code, Getting the code
- code, running / Running the code
- React Router
- about / The front-end router
- views, linking with / Linking views with React Router
- Reflux
- about / Front-end models
- Reflux actions
- about / Reflux actions
- reference link / Reflux actions
- reusable components
- about / Reusable components and base styles
- loader component / Inputs and loading indicator, The loader component
- BasicInput component / The BasicInput component
- application header / The application header
- routes
- about / js/app.jsx
S
- SASS
- about / CSS preprocessors
- Search Engine Optimization (SEO)
- about / Main views, site map, and routes
- search feature
- implementing, for searching posts / Searching posts
- code manifest / Search feature code manifest
- search store, handling / The search store
- posts store, modifying / Modifying the posts store
- application header, modifying / Modifying the application header
- post list component, modifying / Modifying the post list component
- semver
- session context store
- about / The session context store
- single-page application (SPA)
- Slush
- about / Choosing a build system
- Smart components
- source code
- SPA design
- build system / Three aspects of a SPA design
- frontend architecture components / Three aspects of a SPA design
- application design / Three aspects of a SPA design
- spring
- about / How React-Motion works
- state
- about / state
- working with / How it works
T
- tweening
- about / Animation terms
U
- user-related stores
- about / User-related stores
- session context store / The session context store
- user store / The user store
- user management
- code manifest / Code manifest
- application runtime configuration / Application runtime configuration
- with mixins / Mixins and dependencies
- with dependencies / Mixins and dependencies
- user store
- about / The user store
- user view
- post list component, adding / The user view
- user views
- about / User views
- log in view / The log in view
- create user view / The create user view
- user view component / The user view component
- user list view / The user list view
- user profile page / The user view
- app header / The app header
V
- validation
- handling / Validation
- types / Validation types
- field-level validation / Field-level validation
- form-level validation / Form-level validation
- react-validation-mixin example / The react-validation-mixin example
- views, blog application
- linking, with React Router / Linking views with React Router
- js/views/appHeader.jsx / js/views/appHeader.jsx
- js/views/login.jsx / js/views/login.jsx
- virtual DOM
- about / How it works
- URL / How it works
- Von Neumann model
W
- Webpack
- configuring / Installing and configuring Webpack
- installing / Installing and configuring Webpack
- WebPack
- about / Choosing a build system
- Webpack configuration file
- about / The Webpack configuration
- output section / Entry and output sections
- entry section / Entry and output sections
- plugins section / The plugins section
- resolve section / The resolve section
- module section / The module section
- wireframes
- creating / Creating wireframes
- wireframes, blog application
- creating / Creating wireframes
- user-related views / User-related views
- post-related views / Post-related views
Y
- Yeoman
- about / Choosing a build system