Add Check The Password Confirmation With Yup as a javascript til

README.md

@@ -10,7 +10,7 @@ smart people at [Hashrocket](http://hashrocket.com/).
 For a steady stream of TILs from a variety of rocketeers, checkout
 [til.hashrocket.com](https://til.hashrocket.com/).
 
-_722 TILs and counting..._
+_723 TILs and counting..._
 
 ---
 
@@ -238,6 +238,7 @@ _722 TILs and counting..._
 - [Accessing Arguments To A Function](javascript/accessing-arguments-to-a-function.md)
 - [Character Codes from Keyboard Listeners](javascript/character-codes-from-keyboard-listeners.md)
 - [Check If Something Is An Array](javascript/check-if-something-is-an-array.md)
+- [Check The Password Confirmation With Yup](javascript/check-the-password-confirmation-with-yup.md)
 - [Computed Property Names In ES6](javascript/computed-property-names-in-es6.md)
 - [Configure Jest To Run A Test Setup File](javascript/configure-jest-to-run-a-test-setup-file.md)
 - [Create A Cancelable Promise With PCancelable](javascript/create-a-cancelable-promise-with-pcancelable.md)

javascript/check-the-password-confirmation-with-yup.md

@@ -0,0 +1,28 @@
+# Check The Password Confirmation With Yup
+
+The [Yup](https://github.com/jquense/yup) library makes it easy to validate
+individual values in a JavaScript object. A common situation when
+implementing a Sign Up form is asking the user to input their password twice
+and then the app can make sure they match.
+
+To do this, we need the validation of our `passwordConfirmation` value to
+reach outside of itself to make a comparison with the `password` value. This
+can be done with Yup's `ref` function.
+
+```javascript
+import * as Yup from 'yup';
+
+validationSchema: Yup.object({
+  password: Yup.string().required('Password is required'),
+  passwordConfirmation: Yup.string()
+     .oneOf([Yup.ref('password'), null], 'Passwords must match')
+});
+```
+
+We are able to reference the value of `password` with `ref`. We use the
+`oneOf` function to ensure that `passwordConfirmation` either matches
+`password` or if it is left blank and matches `null` then it passes the
+validation for the time being. The second argument to `oneOf` is a custom
+validation message when this validation fails.
+
+[source](https://github.com/jaredpalmer/formik/issues/90)