Skip to content

Commit

Permalink
docs: update
Browse files Browse the repository at this point in the history
  • Loading branch information
@jaeh
jaeh committed Jan 31, 2020
1 parent b1f307e commit 597777a
Show file tree
Hide file tree
Showing 20 changed files with 56 additions and 56 deletions.
2 changes: 1 addition & 1 deletion docs/404.html
View file
@@ -1 +1 @@
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><link rel="stylesheet" href="/core/magic.css?m4rPAhvYi1" integrity="sha384-m4rPAhvYi1frpBjPnriFCxiQd3tCxnWzh6IK6yQYapQCEe5l5oD5vNag8dxUIxBJ" crossorigin="anonymous"/><link rel="icon" href="/core/favicon.ico"/><script type="application/ld+json">{"@context":"http://schema.org","@type":"website"}</script></head><body><a class="SkipLink" href="/core/#page">Skip to Content</a><main id="Magic"><div class="Wrapper"><header class="Header"><a class="Logo" href="/core/"><img src="/core/logo.png" role="presentation" alt=""/><span>@magic</span></a><nav class="Menu"><ul><li><a href="/core/concepts/">concepts</a></li><li><a href="/core/files/">files &amp; directories</a></li><li><a href="/core/modules/">modules</a></li><li><a href="/core/themes/">themes</a></li><li><a href="/core/libraries/">libraries</a></li><li><a href="/core/news/">news</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://github.com/magic/core">magic</a></div></div></footer></div></main><script src="/core/magic.js?gD+80UP8FN" integrity="sha384-gD+80UP8FNQQGwzJrxe7LzOfky9F1sdPC9/au9PhH0qoESg1nVJV5Lnbo3QGrA12" 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="/core/favicon.ico"/><script type="application/ld+json">{"@context":"http://schema.org","@type":"website"}</script><link rel="stylesheet" href="/core/magic.css?qJmLEunig2" integrity="sha384-qJmLEunig2gIFkJia3YQO8rfs86FkHW0/yxDA8JQ6m3G/dgUM2MSrtE8WgM6hSSC" crossorigin="anonymous"/></head><body><a class="SkipLink" href="/core/#page">Skip to Content</a><main id="Magic"><div class="Wrapper"><header class="Header"><a class="Logo" href="/core/"><img src="/core/logo.png" role="presentation" alt=""/><span>@magic</span></a><nav class="Menu"><ul><li><a href="/core/concepts/">concepts</a></li><li><a href="/core/files/">files &amp; directories</a></li><li><a href="/core/modules/">modules</a></li><li><a href="/core/themes/">themes</a></li><li><a href="/core/libraries/">libraries</a></li><li><a href="/core/news/">news</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://github.com/magic/core">magic</a></div></div></footer></div></main><script src="/core/magic.js?N4mgBMMLQK" integrity="sha384-N4mgBMMLQKUEa5sBLtlxwtTy0IErHPYCzs2zyWdynh2x2H6JAV4VYMjWSAYixKJ7" crossorigin="anonymous"></script></body></html>
2 changes: 1 addition & 1 deletion docs/concepts/index.html
View file
@@ -1 +1 @@
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><link rel="stylesheet" href="/core/magic.css?m4rPAhvYi1" integrity="sha384-m4rPAhvYi1frpBjPnriFCxiQd3tCxnWzh6IK6yQYapQCEe5l5oD5vNag8dxUIxBJ" crossorigin="anonymous"/><link rel="icon" href="/core/favicon.ico"/><title>@magic/core concepts</title><meta name="description" content="@magic/core conceptual information. explains the main concepts that make the @magic work."/><script type="application/ld+json">{"@context":"http://schema.org","@type":"website","name":"@magic/core concepts"}</script></head><body><a class="SkipLink" href="/core/#page">Skip to Content</a><main id="Magic"><div class="Wrapper"><header class="Header"><a class="Logo" href="/core/"><img src="/core/logo.png" role="presentation" alt=""/><span>@magic</span></a><nav class="Menu"><ul><li class="active"><a href="/core/concepts/">concepts</a><ul><li><a href="/core/concepts/#modules">modules</a></li><li><a href="/core/concepts/#state">state</a></li><li><a href="/core/concepts/#actions">actions</a></li><li><a href="/core/concepts/#views">views</a></li><li><a href="/core/concepts/#styles">styles</a></li><li><a href="/core/concepts/#globals">global</a></li><li><a href="/core/concepts/#lambdas">server lambdas</a></li></ul></li><li><a href="/core/files/">files &amp; directories</a></li><li><a href="/core/modules/">modules</a></li><li><a href="/core/themes/">themes</a></li><li><a href="/core/libraries/">libraries</a></li><li><a href="/core/news/">news</a></li></ul></nav></header><div class="Page" id="page"><h1>@magic/core concepts</h1><p>magic concepts. These are the building blocks of every module in a magic app</p><div><h2 id="modules">@magic-modules</h2><p>modules are the main building block of magic.</p><p>a page is a module, a button is a module, a link is a module, an image is a module. a @magic app contains modules containing modules that contain modules. this can lead to inception.</p></div><h2>module building blocks</h2><div><h2 id="state">state</h2><div><p>state is a javascript object.</p><p>state can be mutated by actions or effects.</p><p>every rendering step, the state determines the output of the views</p></div></div><div><h2 id="actions">actions</h2><p>actions are an object containing functions</p><p>those functions get the state and their props and may return a new full, but changed, state.</p></div><div><h2 id="effects">effects</h2><p>effects are an object containing functions, just like actions.</p><p>they behave like actions, get a state and props and may return a new full, but changed, state.</p><p>the big difference? effects may be impure and trigger sideeffects outside of hyperapp.</p></div><div><h2 id="views">views</h2><p>views render the state to html</p><p>whenever an action triggers a change in the state, this then triggers a view change.</p></div><div><h2 id="styles">styles</h2><p>every module can have a style object attached to it.</p><p>magic will automagically merge all styles into one global css file.</p><p>in the future, it will also remove unused styles for you.</p><p>style merge order from lowest to highest, last overwrites first:</p><p>module.style &lt; page.style &lt; app.style &lt; theme.style</p><h3 id="styles-magic-css">@magic/css</h3><p>internally, magic uses it&#39;s own css-in-js library.</p><p>to find out more, click the following link:</p><a href="https://magic.github.io/css/" target="_blank" rel="noopener">@magic/css</a></div><div><h2 id="globals">global</h2><p>every module can set a global object, containing state and action properties.</p><p>every state and/or action name in the global object with a value that equals true gets merged into the main app state/actions.</p></div><div><h2 id="lambdas">server lambdas</h2><p>this is the serverside magic.</p><p>you can define functions that get transpiled into serverside lambdas.</p><p>server side lambdas will be available for GET and/or POST requests.</p><p>the server side function signature is (req, res) =&gt; {}, as in any nodejs http server, with the addition of req.body being async =&gt; awaited before execution of the lambda.</p></div></div><footer class="Footer"><div class="Container"><div class="Credits">made with a few bits of <a target="_blank" rel="noopener" href="https://github.com/magic/core">magic</a></div></div></footer></div></main><script src="/core/magic.js?gD+80UP8FN" integrity="sha384-gD+80UP8FNQQGwzJrxe7LzOfky9F1sdPC9/au9PhH0qoESg1nVJV5Lnbo3QGrA12" 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="/core/favicon.ico"/><title>@magic/core concepts</title><meta name="description" content="@magic/core conceptual information. explains the main concepts that make the @magic work."/><script type="application/ld+json">{"@context":"http://schema.org","@type":"website","name":"@magic/core concepts"}</script><link rel="stylesheet" href="/core/magic.css?qJmLEunig2" integrity="sha384-qJmLEunig2gIFkJia3YQO8rfs86FkHW0/yxDA8JQ6m3G/dgUM2MSrtE8WgM6hSSC" crossorigin="anonymous"/></head><body><a class="SkipLink" href="/core/#page">Skip to Content</a><main id="Magic"><div class="Wrapper"><header class="Header"><a class="Logo" href="/core/"><img src="/core/logo.png" role="presentation" alt=""/><span>@magic</span></a><nav class="Menu"><ul><li class="active"><a href="/core/concepts/">concepts</a><ul><li><a href="/core/concepts/#modules">modules</a></li><li><a href="/core/concepts/#state">state</a></li><li><a href="/core/concepts/#actions">actions</a></li><li><a href="/core/concepts/#views">views</a></li><li><a href="/core/concepts/#styles">styles</a></li><li><a href="/core/concepts/#globals">global</a></li><li><a href="/core/concepts/#lambdas">server lambdas</a></li></ul></li><li><a href="/core/files/">files &amp; directories</a></li><li><a href="/core/modules/">modules</a></li><li><a href="/core/themes/">themes</a></li><li><a href="/core/libraries/">libraries</a></li><li><a href="/core/news/">news</a></li></ul></nav></header><div class="Page" id="page"><h1>@magic/core concepts</h1><p>magic concepts. These are the building blocks of every module in a magic app</p><div><h2 id="modules">@magic-modules</h2><p>modules are the main building block of magic.</p><p>a page is a module, a button is a module, a link is a module, an image is a module. a @magic app contains modules containing modules that contain modules. this can lead to inception.</p></div><h2>module building blocks</h2><div><h2 id="state">state</h2><div><p>state is a javascript object.</p><p>state can be mutated by actions or effects.</p><p>every rendering step, the state determines the output of the views</p></div></div><div><h2 id="actions">actions</h2><p>actions are an object containing functions</p><p>those functions get the state and their props and may return a new full, but changed, state.</p></div><div><h2 id="effects">effects</h2><p>effects are an object containing functions, just like actions.</p><p>they behave like actions, get a state and props and may return a new full, but changed, state.</p><p>the big difference? effects may be impure and trigger sideeffects outside of hyperapp.</p></div><div><h2 id="views">views</h2><p>views render the state to html</p><p>whenever an action triggers a change in the state, this then triggers a view change.</p></div><div><h2 id="styles">styles</h2><p>every module can have a style object attached to it.</p><p>magic will automagically merge all styles into one global css file.</p><p>in the future, it will also remove unused styles for you.</p><p>style merge order from lowest to highest, last overwrites first:</p><p>module.style &lt; page.style &lt; app.style &lt; theme.style</p><h3 id="styles-magic-css">@magic/css</h3><p>internally, magic uses it&#39;s own css-in-js library.</p><p>to find out more, click the following link:</p><a href="https://magic.github.io/css/" target="_blank" rel="noopener">@magic/css</a></div><div><h2 id="globals">global</h2><p>every module can set a global object, containing state and action properties.</p><p>every state and/or action name in the global object with a value that equals true gets merged into the main app state/actions.</p></div><div><h2 id="lambdas">server lambdas</h2><p>this is the serverside magic.</p><p>you can define functions that get transpiled into serverside lambdas.</p><p>server side lambdas will be available for GET and/or POST requests.</p><p>the server side function signature is (req, res) =&gt; {}, as in any nodejs http server, with the addition of req.body being async =&gt; awaited before execution of the lambda.</p></div></div><footer class="Footer"><div class="Container"><div class="Credits">made with a few bits of <a target="_blank" rel="noopener" href="https://github.com/magic/core">magic</a></div></div></footer></div></main><script src="/core/magic.js?N4mgBMMLQK" integrity="sha384-N4mgBMMLQKUEa5sBLtlxwtTy0IErHPYCzs2zyWdynh2x2H6JAV4VYMjWSAYixKJ7" crossorigin="anonymous"></script></body></html>

0 comments on commit 597777a

Please sign in to comment.