https://github.com/ericadamski/protect-a-deck

Protect an MDX deck from invaders 👾
https://github.com/ericadamski/protect-a-deck

Last synced: 3 months ago
JSON representation

Protect an MDX deck from invaders 👾

• Host: GitHub
• URL: https://github.com/ericadamski/protect-a-deck
• Owner: ericadamski
• License: mit
• Created: 2020-02-08T03:57:59.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-05T06:44:19.000Z (over 2 years ago)
• Last Synced: 2025-01-06T09:45:37.859Z (5 months ago)
• Language: JavaScript
• Size: 3.09 MB
• Stars: 2
• Watchers: 0
• Forks: 0
• Open Issues: 10
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# protect-a-deck

Protect an MDX deck from invaders 👾

![example of a protected deck](https://user-images.githubusercontent.com/6516758/74079437-79625200-4a05-11ea-9c65-5f7caf7cd6d3.png)

---

Uses https://paassword.now.sh to safely store your password and then allows a static site to check against it at will.

## Installation

`yarn add protect-a-deck`

## Usage

See details on how to extend the mdx-deck `Provider` here: https://github.com/jxnblk/mdx-deck/blob/master/docs/advanced.md#custom-provider-component

1. Go to https://paassword.now.sh and get a link that will look like: `https://svrlss.now.sh/api/get/rec3T73O3WNZk3IZj`

2. Copy the last part, the id, of the url. Which would be `rec3T73O3WNZk3IZj` from above.

3. Extend the provider for mdx-deck like the example below passing in your id from step 2.

```JavaScript

// example Provider.js

import React from 'react'

import Protection from 'protect-a-deck'

import { useDeck } from 'mdx-deck'

export default props => {

  const state = useDeck()

  return (

    

      {props.children}

    

  )

}

```

## Running the example

`yarn present` or `npm run present`

> the password for the example is `dev.to`