Add react object proptypes blog

blog_posts/react-proptypes-objectof-vs-shape.md

@@ -0,0 +1,52 @@
+---
+title: React PropTypes - objectOf vs shape
+type: story
+tags: react,components,proptypes
+authors: chalarangelo
+cover: blog_images/shapes.jpg
+excerpt: Learn the differences between `PropTypes.objectOf()` and `PropTypes.shape()` and where to use each one with this quick guide.
+---
+
+The `prop-types` package is used by millions of React developers every day in order to type check the props passed to their components. Most of us are probably familiar with a variety of its built-in validators, but many a developer seems to fall short when dealing with object props. Luckily, the `PropTypes.objectOf()` and `PropTypes.shape()` validators are here to help.
+
+### PropTypes.shape()
+
+The `PropTypes.shape()` validator can be used when describing an object whose keys are known ahead of time, and may represent different types. For example:
+
+```js
+import PropTypes from 'prop-types';
+// Expected prop object - keys known ahead of time
+const myProp = {
+  name: 'John',
+  surname: 'Smith',
+  age: 27
+};
+// PropTypes validation for the prop object
+MyComponent.propTypes = {
+  myProp: PropTypes.shape({
+    name: PropTypes.string,
+    surname: PropTypes.string,
+    age: PropTypes.number
+  })
+};
+```
+
+### PropTypes.objectOf()
+
+The `PropTypes.objectOf()` validator is used when describing an object whose keys might not be known ahead of time, and often represent the same type. For example:
+
+```js
+import PropTypes from 'prop-types';
+// Expected prop object - dynamic keys (i.e. user ids)
+const myProp = {
+  25891102: 'johnsmith',
+  34712915: 'ducklord',
+  76912999: 'mrquacks'
+};
+// PropTypes validation for the prop object
+MyComponent.propTypes = {
+  myProp: PropTypes.objectOf(PropTypes.number)
+};
+```
+
+**Image credit:** [Martin Sanchez](https://unsplash.com/@martinsanchez?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText)