diff --git a/git-resources.md b/git-resources.md index 6a493d7..164fa83 100644 --- a/git-resources.md +++ b/git-resources.md @@ -93,6 +93,10 @@ - **Beginner's guide to git rebasing and squashing** https://shinglyu.github.io/web/2016/11/08/servo-rebase-and-squash-guide.html A tutorial on rebasing and squashing commits to change past history. + +- **Git Rebasing and Clean Pull Requests** + https://www.jungledisk.com/blog/2016/11/21/git-rebasing-and-clean-prs/ + Some best practices for cleaning up branches and producing readable commits. #### E-Books diff --git a/node-js-and-npm.md b/node-js-and-npm.md index 60d8d96..b55a349 100644 --- a/node-js-and-npm.md +++ b/node-js-and-npm.md @@ -34,4 +34,8 @@ NPM 3.7 or later, as that fixes a bug with the progress bar that drastically slo - **Node Hero: The Complete Node.js Tutorial** https://risingstack.com/resources/node-hero - An ebook covering a variety of topics about using Node, including basic usage, NPM, Express, and building server applications. The ebook is free, but requires email registration to download. \ No newline at end of file + An ebook covering a variety of topics about using Node, including basic usage, NPM, Express, and building server applications. The ebook is free, but requires email registration to download. + +- **Understanding NPM** + https://unpm.nodesource.com/ + An interactive visualization that is intended to help you understand the role and scope of NPM. \ No newline at end of file diff --git a/react-component-patterns.md b/react-component-patterns.md index ec9c372..2cc079f 100644 --- a/react-component-patterns.md +++ b/react-component-patterns.md @@ -37,6 +37,10 @@ - **ReactCasts #3: React's Children API** https://www.youtube.com/watch?v=DJ53-G8EbxE A screencast demonstrating how the "children" prop to compose components together + +- **React Stateless Functional Components: Nine Wins You Might Have Overlooked** + https://medium.com/@housecor/react-stateless-functional-components-nine-wins-you-might-have-overlooked-997b0d933dbc + Thoughts on reasons why you might want to write more components using the functional syntax. #### React Component Lifecycle @@ -84,9 +88,10 @@ https://www.youtube.com/watch?v=k9AhBMwj1w4 A talk on what `context` is, and how to use it safely -- **ReactCasts #4: Context (Part 1)** +- **ReactCasts #4-5: Context (Parts 1 and 2)** https://www.youtube.com/watch?v=lxq938kqIss - A two-part series explaining what React's `context` feature can be used for, and some potential concerns to be aware of when using it + https://www.youtube.com/watch?v=mwYHDXS6uSc + A two-part series explaining what React's `context` feature can be used for, and some potential concerns to be aware of when using it. #### Component Categories diff --git a/react-implementation.md b/react-implementation.md index fb21c6a..a870780 100644 --- a/react-implementation.md +++ b/react-implementation.md @@ -47,6 +47,10 @@ https://medium.com/@deathmood/write-your-virtual-dom-2-props-events-a957608f5c76 A series of articles that build up a small Virtual DOM system from scratch. +- **Write Your Own React.js!** + https://medium.com/@calebmer/write-your-own-react-js-776dbef98b8 + Some thoughts on why and how you might want to try writing your own React-alike, and some of the tradeoffs involved in writing something like React. + #### Implementation and Internals diff --git a/react-performance.md b/react-performance.md index a0e72f2..920b109 100644 --- a/react-performance.md +++ b/react-performance.md @@ -96,6 +96,14 @@ My [Redux Ecosystem Links](https://github.com/markerikson/redux-ecosystem-links) https://bvaughn.github.io/connect-tech-2016/#/ An excellent slideshow on performance topics from the author of the React-Virtualized library. Covers sources of slowness, ways to avoid re-renders, and a deep look at "windowing/virtualization" for high-performance lists. +- **React Component Profiling** + https://blog.yld.io/2016/11/25/react-component-profiling/ + Tips on using the new browser devtools integration capability in React 15.4 to track component performance. + +- **React Snippets: Debug Component performance with ES7 Annotations** + https://www.neos.io/blog/react-snippets-debug-component-performance-with-es7-annotations.html Demonstrates using a custom decorator to wrap components and log information on when and why components re-rendered + + #### Code Splitting and Progressive Apps @@ -149,6 +157,7 @@ Also see [Webpack Advanced Techniques](./webpack-advanced-techniques.md) https://www.reddit.com/r/javascript/comments/4rcqpx/dan_abramov_redux_is_not_an_architecture_or/d51g4k4?context=3 A comment discussing a number of potential negative tradeoffs when using Immutable.js, including both performance anti-patterns and API issues + #### Redux Performance - **High Performance Redux** diff --git a/react-redux-testing.md b/react-redux-testing.md index 74c63d1..6fb2a69 100644 --- a/react-redux-testing.md +++ b/react-redux-testing.md @@ -142,6 +142,13 @@ https://daveceddia.com/what-to-test-in-react-app/ General guidance on what types of tests you might want to write and what to test for. +- **Testing React Applications** + https://www.youtube.com/watch?v=59Ndb3YkLKA + A presentation by Max Stoiber, looking at what types of things to test in a React/Redux application, and ways to use tools like Jest to speed up the testing process. + +- **Good Practices for Testing React Apps** + https://medium.com/@TuckerConnelly/good-practices-for-testing-react-apps-3a64154fa3b1 + Thoughts on writing end-to-end tests, unit tests, and integration tests for Reaact applications, including treating components as "black boxes". #### General Testing, Tools, and Setup diff --git a/react-routing.md b/react-routing.md index 5727208..96b8ba2 100644 --- a/react-routing.md +++ b/react-routing.md @@ -17,4 +17,12 @@ - **Webpack code splitting with Create React App and React Router** https://www.drewbolles.com/blog/2016/11/14/webpack-code-splitting-with-create-react-app-react-router/ - A quick example of how to use React-Router's hooks to set up code splitting with Webpack \ No newline at end of file + A quick example of how to use React-Router's hooks to set up code splitting with Webpack + +- **Multifactor Authentication in your React Apps** + https://scotch.io/tutorials/multifactor-authentication-in-your-react-apps + A tutorial demonstrating how to use the Auth0 service, along with React Router, to implement multi-factor authentication for an app. + +- **How to Handle Routing in React** + https://code.tutsplus.com/tutorials/understanding-how-to-handle-routing-in-react--cms-27355 + A quick example of using React-Router v2 in a small React app \ No newline at end of file diff --git a/react-server-rendering.md b/react-server-rendering.md index d73372b..19b5d04 100644 --- a/react-server-rendering.md +++ b/react-server-rendering.md @@ -11,4 +11,8 @@ - **Build a Universal Javascript App** https://www.packtpub.com/books/content/build-universal-javascript-app-part-1 https://www.packtpub.com/books/content/build-universal-javascript-app-part-2 - A tutorial that discusses some benefits of building a universal app, and walks through building an app with Express, React, and React Router. \ No newline at end of file + A tutorial that discusses some benefits of building a universal app, and walks through building an app with Express, React, and React Router. + +- **React is gaining ground as a universal server side templating system** + https://medium.com/@velmu/react-is-gaining-ground-as-a-universal-server-side-templating-system-26fe02eebe12 + Some thoughts on using React as a template rendering engine, integrated into various server-side language stacks. \ No newline at end of file diff --git a/react-styling.md b/react-styling.md index a43f085..13da19b 100644 --- a/react-styling.md +++ b/react-styling.md @@ -66,4 +66,12 @@ - **Scalable Styles in Production JS** https://medium.com/front-end-hacking/scalable-styles-in-production-js-cde88016f357 - Some comparisons between various approaches to managing styles (plain CSS, inline styles, CSS-in-JS), and why Aphrodite can help solve some of the issues that come up. \ No newline at end of file + Some comparisons between various approaches to managing styles (plain CSS, inline styles, CSS-in-JS), and why Aphrodite can help solve some of the issues that come up. + +- **Writing Your Styles in JS != Writing Inline Styles** + http://mxstbr.blog/2016/11/inline-styles-vs-css-in-js + Max Stoiber describes the key difference between "inline styles" and "CSS-in-JS" approaches: styles applied to elements vs styles added to a