Skip to content

Commit

Permalink
docs: update
Browse files Browse the repository at this point in the history
  • Loading branch information
@jaeh
jaeh committed Mar 4, 2021
1 parent a256b90 commit e311ac5
Show file tree
Hide file tree
Showing 5 changed files with 10 additions and 10 deletions.
2 changes: 1 addition & 1 deletion docs/404.html
View file
Original file line number Diff line number Diff line change
@@ -1 +1 @@
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width, initial-scale=1.0"/><link rel="icon" href="/db/favicon.ico"/><title>404 - not found</title><meta name="description" content="404 - not found."/><script type="application/ld+json">{"@context":"http://schema.org","@type":"website","name":"404 - not found"}</script><link rel="stylesheet" href="/db/magic.css?S6KqwlVvY/" integrity="sha384-S6KqwlVvY/KJ8U/Hv0xDEJN7IFjxy4KYbn0Z4lYLGl3T9il5udDt9owgAgDlGkLb" crossorigin="anonymous"/></head><body><a class="SkipLink" href="/db/#page">Skip to Content</a><main id="Magic"><div class="Wrapper"><header class="Header"><div><a class="Logo" href="/db/"><svg viewBox="0 0 512 444"><path d="M512 444L256 0 0 444z" fill="#663695"></path><circle cx="256" cy="294" r="130" fill="#fff"></circle><circle cx="256" cy="281" r="40" fill="#663695"></circle><path d="M256 350v44m24-44l1 13c1 27 29 27 29-7m-160-72s46-47 106-47c59 0 106 47 106 47s-47 43-106 43c-60 0-106-43-106-43zm65-75a134 134 0 0189 2" class="stroke"></path><path d="M256 81v53m184 270l-43-29M72 404l43-29" class="stroke white"></path></svg></a><p>@magic-libraries/db</p><nav class="Menu"><ul><li><a href="/db/#installation">installation</a></li><li><a href="/db/#usage">usage</a></li><li><a href="/db/#source">source</a></li></ul></nav></div></header><div class="Page" id="page"><div>404 - not found.</div></div><footer class="Footer"><div class="Container"><div class="Credits">made with a few bits of <a target="_blank" rel="noopener" href="https://magic.github.io/">magic</a></div></div></footer></div></main><script src="/db/magic.js?ZsYS0Jp+e6" integrity="sha384-ZsYS0Jp+e6/Abl6l/VX78zjXKFjcNgiVdk4JvDjuNcbGjhjmseG/rPDrjGTYbrjE" crossorigin="anonymous"></script></body></html>
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width, initial-scale=1.0"/><link rel="icon" href="/db/favicon.ico"/><title>404 - not found</title><meta name="description" content="404 - not found."/><script type="application/ld+json">{"@context":"http://schema.org","@type":"website","name":"404 - not found"}</script><link rel="stylesheet" href="/db/magic.css?S6KqwlVvY/" integrity="sha384-S6KqwlVvY/KJ8U/Hv0xDEJN7IFjxy4KYbn0Z4lYLGl3T9il5udDt9owgAgDlGkLb" crossorigin="anonymous"/></head><body><a class="SkipLink" href="/#page">Skip to Content</a><main id="Magic"><div class="Wrapper"><header class="Header"><a class="Logo" href="/db/"><svg viewBox="0 0 512 444"><path d="M512 444L256 0 0 444z" fill="#663695"></path><circle cx="256" cy="294" r="130" fill="#fff"></circle><circle cx="256" cy="281" r="40" fill="#663695"></circle><path d="M256 350v44m24-44l1 13c1 27 29 27 29-7m-160-72s46-47 106-47c59 0 106 47 106 47s-47 43-106 43c-60 0-106-43-106-43zm65-75a134 134 0 0189 2" class="stroke"></path><path d="M256 81v53m184 270l-43-29M72 404l43-29" class="stroke white"></path></svg></a><p>@magic-libraries/db</p><nav class="Menu"><ul><li><a href="/db/#installation">installation</a></li><li><a href="/db/#usage">usage</a></li><li><a href="/db/#source">source</a></li></ul></nav></header><div class="Page" id="page"><div>404 - not found.</div></div><footer class="Footer"><div class="Container"><div class="Credits">made with a few bits of <a target="_blank" rel="noopener" href="https://magic.github.io/">magic</a></div></div></footer></div></main><script src="/db/magic.js?v6NB1Z1eNf" integrity="sha384-v6NB1Z1eNfgDSacWJZlnphqGBXPrDbYVeqXFJUaVtQWNRRh83UAVcaUYf8mGPyf2" crossorigin="anonymous"></script></body></html>
4 changes: 2 additions & 2 deletions docs/index.html
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width, initial-scale=1.0"/><link rel="icon" href="/db/favicon.ico"/><title>@magic-libraries/db</title><meta name="description" content="localstorage backed browser key value database for @magic"/><script type="application/ld+json">{"@context":"http://schema.org","@type":"website","name":"@magic-libraries/db"}</script><link rel="stylesheet" href="/db/magic.css?S6KqwlVvY/" integrity="sha384-S6KqwlVvY/KJ8U/Hv0xDEJN7IFjxy4KYbn0Z4lYLGl3T9il5udDt9owgAgDlGkLb" crossorigin="anonymous"/></head><body><a class="SkipLink" href="/db/#page">Skip to Content</a><main id="Magic"><div class="Wrapper"><header class="Header"><div><a class="Logo" href="/db/"><svg viewBox="0 0 512 444"><path d="M512 444L256 0 0 444z" fill="#663695"></path><circle cx="256" cy="294" r="130" fill="#fff"></circle><circle cx="256" cy="281" r="40" fill="#663695"></circle><path d="M256 350v44m24-44l1 13c1 27 29 27 29-7m-160-72s46-47 106-47c59 0 106 47 106 47s-47 43-106 43c-60 0-106-43-106-43zm65-75a134 134 0 0189 2" class="stroke"></path><path d="M256 81v53m184 270l-43-29M72 404l43-29" class="stroke white"></path></svg></a><p>@magic-libraries/db</p><nav class="Menu"><ul><li><a href="/db/#installation">installation</a></li><li><a href="/db/#usage">usage</a></li><li><a href="/db/#source">source</a></li></ul></nav></div></header><div class="Page" id="page"><h1 id="magic-librariesdb">@magic-libraries/db</h1><p>localstorage backed browser key value database for @magic</p><ul class="GitBadges"><li><a href="https://www.npmjs.com/package/@magic-libraries/db" target="_blank" rel="noopener"><img src="https://img.shields.io/npm/v/@magic-libraries/db?color=blue" height="23" role="presentation" alt="" loading="lazy"/></a></li><li><img src="https://img.shields.io/node/v/@magic-libraries/db?color=blue" height="23" role="presentation" alt="" loading="lazy"/></li><li><img src="https://img.shields.io/npm/l/@magic-libraries/db?color=blue" height="23" role="presentation" alt="" loading="lazy"/></li><li><a href="https://travis-ci.com/magic-libraries/db" target="_blank" rel="noopener"><img src="https://img.shields.io/travis/com/magic-libraries/db/master" height="23" role="presentation" alt="" loading="lazy"/></a></li><li><a href="https://ci.appveyor.com/project/magiclibraries/db/branch/master" target="_blank" rel="noopener"><img src="https://img.shields.io/appveyor/ci/magiclibraries/db/master.svg" height="23" role="presentation" alt="" loading="lazy"/></a></li><li><a href="https://coveralls.io/github/magic-libraries/db" target="_blank" rel="noopener"><img src="https://img.shields.io/coveralls/github/magic-libraries/db/master.svg" height="23" role="presentation" alt="" loading="lazy"/></a></li><li><a href="https://snyk.io/test/github/magic-libraries/db" target="_blank" rel="noopener"><img src="https://img.shields.io/snyk/vulnerabilities/github/magic-libraries/db.svg" height="23" role="presentation" alt="" loading="lazy"/></a></li></ul><h3 id="installation">installation</h3><div class="Pre"><div class="menu"><button>copy</button></div><pre><code class="line"><span class="keyword">npm</span> <span class="keyword">install</span> --save-exact magic-libraries/db</code></pre></div><h3 id="usage">usage</h3><p>in a page/component, just use the lib.db functions, either as action or effect.</p><p>see <a href="https://github.com/magic-libraries/db/tree/master/example/assets/ExampleStore" target="_blank" rel="noopener">ExampleStore</a>
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width, initial-scale=1.0"/><link rel="icon" href="/db/favicon.ico"/><title>@magic-libraries/db</title><meta name="description" content="localstorage backed browser key value database for @magic"/><script type="application/ld+json">{"@context":"http://schema.org","@type":"website","name":"@magic-libraries/db"}</script><link rel="stylesheet" href="/db/magic.css?S6KqwlVvY/" integrity="sha384-S6KqwlVvY/KJ8U/Hv0xDEJN7IFjxy4KYbn0Z4lYLGl3T9il5udDt9owgAgDlGkLb" crossorigin="anonymous"/></head><body><a class="SkipLink" href="/#page">Skip to Content</a><main id="Magic"><div class="Wrapper"><header class="Header"><a class="Logo" href="/db/"><svg viewBox="0 0 512 444"><path d="M512 444L256 0 0 444z" fill="#663695"></path><circle cx="256" cy="294" r="130" fill="#fff"></circle><circle cx="256" cy="281" r="40" fill="#663695"></circle><path d="M256 350v44m24-44l1 13c1 27 29 27 29-7m-160-72s46-47 106-47c59 0 106 47 106 47s-47 43-106 43c-60 0-106-43-106-43zm65-75a134 134 0 0189 2" class="stroke"></path><path d="M256 81v53m184 270l-43-29M72 404l43-29" class="stroke white"></path></svg></a><p>@magic-libraries/db</p><nav class="Menu"><ul><li><a href="/db/#installation">installation</a></li><li><a href="/db/#usage">usage</a></li><li><a href="/db/#source">source</a></li></ul></nav></header><div class="Page" id="page"><h1 id="magic-librariesdb">@magic-libraries/db</h1><p>localstorage backed browser key value database for @magic</p><ul class="GitBadges"><li><a href="https://www.npmjs.com/package/@magic-libraries/db" target="_blank" rel="noopener"><img src="https://img.shields.io/npm/v/@magic-libraries/db?color=blue" height="23" role="presentation" alt="" loading="lazy"/></a></li><li><img src="https://img.shields.io/node/v/@magic-libraries/db?color=blue" height="23" role="presentation" alt="" loading="lazy"/></li><li><img src="https://img.shields.io/npm/l/@magic-libraries/db?color=blue" height="23" role="presentation" alt="" loading="lazy"/></li><li><a href="https://travis-ci.com/magic-libraries/db" target="_blank" rel="noopener"><img src="https://img.shields.io/travis/com/magic-libraries/db/master" height="23" role="presentation" alt="" loading="lazy"/></a></li><li><a href="https://ci.appveyor.com/project/magiclibraries/db/branch/master" target="_blank" rel="noopener"><img src="https://img.shields.io/appveyor/ci/magiclibraries/db/master.svg" height="23" role="presentation" alt="" loading="lazy"/></a></li><li><a href="https://coveralls.io/github/magic-libraries/db" target="_blank" rel="noopener"><img src="https://img.shields.io/coveralls/github/magic-libraries/db/master.svg" height="23" role="presentation" alt="" loading="lazy"/></a></li><li><a href="https://snyk.io/test/github/magic-libraries/db" target="_blank" rel="noopener"><img src="https://img.shields.io/snyk/vulnerabilities/github/magic-libraries/db.svg" height="23" role="presentation" alt="" loading="lazy"/></a></li></ul><h3 id="installation">installation</h3><div class="Pre"><div class="menu"><button>copy</button></div><pre><code class="line"><span class="keyword">npm</span> <span class="keyword">install</span> --save-exact magic-libraries/db</code></pre></div><h3 id="usage">usage</h3><p>in a page/component, just use the lib.db functions, either as action or effect.</p><p>see <a href="https://github.com/magic-libraries/db/blob/master/example/assets/ExampleStore.mjs" target="_blank" rel="noopener">ExampleStore</a>
for a reference implementation and
<a href="https://github.com/magic-modules/gdpr" target="_blank" rel="noopener">@magic-modules/gdpr</a>
for an actual usecase</p><div class="Pre lines"><div class="menu"><button>copy</button></div><pre><code class="line"><span class="keyword">export</span> <span class="keyword">const</span> View = ({ key, <span class="state">state</span> }) <span class="keyword">=&gt;</span></code><code class="line"> div([</code><code class="line"> div([&quot;key: key]),</code><code class="line"> div([</code><code class="line"> h4(<span class="string">&quot;controls&quot;</span>),</code><code class="line"> button({ onclick: [actions.examplestore.set, { key }] }, <span class="string">&quot;write&quot;</span>),</code><code class="line"> button({ onclick: [actions.examplestore.get, { key }] }, <span class="string">&quot;read&quot;</span>),</code><code class="line"> button({ onclick: [actions.examplestore.del, { key }] }, <span class="string">&quot;delete&quot;</span>),</code><code class="line"> ]),</code><code class="line"></code><code class="line"> div(<span class="string">&quot;value in local storage:&quot;</span>),</code><code class="line"> state[key]</code><code class="line"> ? [<span class="string">&quot;state is accessible via state[&quot;</span><span class="string">&quot; + key + &quot;</span>&quot;] div(state[key])]</code><code class="line"> : div(<span class="string">&quot;no value in db&quot;</span>),</code><code class="line"> ])</code><code class="line"></code><code class="line"><span class="keyword">export</span> <span class="keyword">const</span> <span class="actions">actions</span> = {</code><code class="line"> examplestore: {</code><code class="line"> get: (state, { key }) <span class="keyword">=&gt;</span> [</code><code class="line"> state,</code><code class="line"> [</code><code class="line"> lib.db.get,</code><code class="line"> {</code><code class="line"> key,</code><code class="line"> action: actions.examplestore.refresh,</code><code class="line"> },</code><code class="line"> ],</code><code class="line"> ],</code><code class="line"></code><code class="line"> set: (state, { key }) <span class="keyword">=&gt;</span> [</code><code class="line"> state,</code><code class="line"> [</code><code class="line"> lib.db.set,</code><code class="line"> {</code><code class="line"> key,</code><code class="line"> value: <span class="string">&quot;testing &quot;</span> + Math.ceil(Math.random() * 100000),</code><code class="line"> action: actions.examplestore.refresh,</code><code class="line"> },</code><code class="line"> ],</code><code class="line"> ],</code><code class="line"></code><code class="line"> del: (state, { key }) <span class="keyword">=&gt;</span> [</code><code class="line"> state,</code><code class="line"> [</code><code class="line"> lib.db.del,</code><code class="line"> {</code><code class="line"> key,</code><code class="line"> action: actions.examplestore.refresh,</code><code class="line"> },</code><code class="line"> ],</code><code class="line"> ],</code><code class="line"></code><code class="line"> refresh: (state, { key, value }) <span class="keyword">=&gt;</span> {</code><code class="line"> console.log(&quot;refresh { key, value })</code><code class="line"></code><code class="line"> <span class="keyword">if</span> (key) {</code><code class="line"> state[key] = value</code><code class="line"> }</code><code class="line"></code><code class="line"> <span class="keyword">return</span> {</code><code class="line"> ...state,</code><code class="line"> }</code><code class="line"> },</code><code class="line"> },</code><code class="line">}</code></pre></div><p>then use it in a page:</p><div class="Pre"><div class="menu"><button>copy</button></div><pre><code class="line">&lt;ExampleStore <span class="state">state</span> key=<span class="string">&quot;magic-examplestore&quot;</span>&gt;&lt;ExampleStore&gt;</code></pre></div><p>renders:</p><div><div>key: magic-examplestore</div><div><h4>controls</h4><button>write</button><button>read</button><button>delete</button></div><div>value in local storage:</div><div>no value in db</div></div><h3 id="source">source</h3><p>the source for this page is in the
<a href="https://github.com/magic-libraries/db/tree/master/example" target="_blank" rel="noopener">example directory</a>
and gets built and published to github using
<a href="https://github.com/magic/core" target="_blank" rel="noopener">@magic/core</a></p></div><footer class="Footer"><div class="Container"><div class="Credits">made with a few bits of <a target="_blank" rel="noopener" href="https://magic.github.io/">magic</a></div></div></footer></div></main><script src="/db/magic.js?ZsYS0Jp+e6" integrity="sha384-ZsYS0Jp+e6/Abl6l/VX78zjXKFjcNgiVdk4JvDjuNcbGjhjmseG/rPDrjGTYbrjE" crossorigin="anonymous"></script></body></html>
<a href="https://github.com/magic/core" target="_blank" rel="noopener">@magic/core</a></p></div><footer class="Footer"><div class="Container"><div class="Credits">made with a few bits of <a target="_blank" rel="noopener" href="https://magic.github.io/">magic</a></div></div></footer></div></main><script src="/db/magic.js?v6NB1Z1eNf" integrity="sha384-v6NB1Z1eNfgDSacWJZlnphqGBXPrDbYVeqXFJUaVtQWNRRh83UAVcaUYf8mGPyf2" crossorigin="anonymous"></script></body></html>
Loading

0 comments on commit e311ac5

Please sign in to comment.