-
-
Notifications
You must be signed in to change notification settings - Fork 18
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Deployed a85164c to develop with MkDocs 1.6.1 and mike 2.1.3
- Loading branch information
github-actions
committed
Dec 2, 2024
1 parent
03c16c7
commit a9214be
Showing
15 changed files
with
275 additions
and
253 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -40,8 +40,7 @@ | |
| <span class=normal>16</span> | ||
| <span class=normal>17</span> | ||
| <span class=normal>18</span> | ||
| <span class=normal>19</span> | ||
| <span class=normal>20</span></pre></div></td><td class=code><div><pre><span></span><code><span class=kn>import</span> <span class=nn>os</span> | ||
| <span class=normal>19</span></pre></div></td><td class=code><div><pre><span></span><code><span class=kn>import</span> <span class=nn>os</span> | ||
|
|
||
| <span class=kn>from</span> <span class=nn>django.core.asgi</span> <span class=kn>import</span> <span class=n>get_asgi_application</span> | ||
|
|
||
|
|
@@ -53,22 +52,19 @@ | |
|
|
||
|
|
||
| <span class=kn>from</span> <span class=nn>channels.routing</span> <span class=kn>import</span> <span class=n>ProtocolTypeRouter</span><span class=p>,</span> <span class=n>URLRouter</span> <span class=c1># noqa: E402</span> | ||
|
|
||
| <span class=kn>from</span> <span class=nn>reactpy_django</span> <span class=kn>import</span> <span class=n>REACTPY_WEBSOCKET_ROUTE</span> <span class=c1># noqa: E402</span> | ||
|
|
||
| <span class=n>application</span> <span class=o>=</span> <span class=n>ProtocolTypeRouter</span><span class=p>(</span> | ||
| <span class=p>{</span> | ||
| <span class=s2>"http"</span><span class=p>:</span> <span class=n>django_asgi_app</span><span class=p>,</span> | ||
| <span class=s2>"websocket"</span><span class=p>:</span> <span class=n>URLRouter</span><span class=p>([</span><span class=n>REACTPY_WEBSOCKET_ROUTE</span><span class=p>]),</span> | ||
| <span class=p>}</span> | ||
| <span class=p>)</span> | ||
| <span class=n>application</span> <span class=o>=</span> <span class=n>ProtocolTypeRouter</span><span class=p>({</span> | ||
| <span class=s2>"http"</span><span class=p>:</span> <span class=n>django_asgi_app</span><span class=p>,</span> | ||
| <span class=s2>"websocket"</span><span class=p>:</span> <span class=n>URLRouter</span><span class=p>([</span><span class=n>REACTPY_WEBSOCKET_ROUTE</span><span class=p>]),</span> | ||
| <span class=p>})</span> | ||
| </code></pre></div></td></tr></table></div> </div> </div> </div> <details class=info> <summary>Add <code class=highlight><span class=n>AuthMiddlewareStack</span></code> (Optional)</summary> <p>There are many situations where you need to access the Django <code class=highlight><span class=n>User</span></code> or <code class=highlight><span class=n>Session</span></code> objects within ReactPy components. For example, if you want to:</p> <ol> <li>Access the <code class=highlight><span class=n>User</span></code> that is currently logged in</li> <li>Access Django's <code class=highlight><span class=n>Session</span></code> object</li> <li>Login or logout the current <code class=highlight><span class=n>User</span></code></li> </ol> <p>In these situations will need to ensure you are using <code class=highlight><span class=n>AuthMiddlewareStack</span></code>.</p> <div class=highlight><pre><span></span><code><span class=kn>from</span> <span class=nn>channels.auth</span> <span class=kn>import</span> <span class=n>AuthMiddlewareStack</span> <span class=c1># noqa: E402</span> | ||
|
|
||
| <span class=n>application</span> <span class=o>=</span> <span class=n>ProtocolTypeRouter</span><span class=p>(</span> | ||
| <span class=p>{</span> | ||
| <span class=s2>"http"</span><span class=p>:</span> <span class=n>django_asgi_app</span><span class=p>,</span> | ||
| <span class=s2>"websocket"</span><span class=p>:</span> <span class=n>AuthMiddlewareStack</span><span class=p>(</span><span class=n>URLRouter</span><span class=p>([</span><span class=n>REACTPY_WEBSOCKET_ROUTE</span><span class=p>])),</span> | ||
| <span class=p>}</span> | ||
| <span class=p>)</span> | ||
| <span class=n>application</span> <span class=o>=</span> <span class=n>ProtocolTypeRouter</span><span class=p>({</span> | ||
| <span class=s2>"http"</span><span class=p>:</span> <span class=n>django_asgi_app</span><span class=p>,</span> | ||
| <span class=s2>"websocket"</span><span class=p>:</span> <span class=n>AuthMiddlewareStack</span><span class=p>(</span><span class=n>URLRouter</span><span class=p>([</span><span class=n>REACTPY_WEBSOCKET_ROUTE</span><span class=p>])),</span> | ||
| <span class=p>})</span> | ||
| </code></pre></div> </details> <details class=question> <summary>Where is my <code>asgi.py</code>?</summary> <p>If you do not have an <code>asgi.py</code>, follow the <a href=https://channels.readthedocs.io/en/stable/installation.html><code>channels</code> installation guide</a>.</p> </details> <h2 id=step-5-run-database-migrations>Step 5: Run database migrations<a class=headerlink href=#step-5-run-database-migrations title="Permanent link">¶</a></h2> <p>Run Django's <a href=https://docs.djangoproject.com/en/stable/topics/migrations/ ><code>migrate</code> command</a> to initialize ReactPy-Django's database table.</p> <div class=highlight><pre><span></span><code>python<span class=w> </span>manage.py<span class=w> </span>migrate | ||
| </code></pre></div> <h2 id=step-6-check-your-configuration>Step 6: Check your configuration<a class=headerlink href=#step-6-check-your-configuration title="Permanent link">¶</a></h2> <p>Run Django's <a href=https://docs.djangoproject.com/en/stable/ref/django-admin/#check><code>check</code> command</a> to verify if ReactPy was set up correctly.</p> <div class=highlight><pre><span></span><code>python<span class=w> </span>manage.py<span class=w> </span>check | ||
| </code></pre></div> <h2 id=step-7-create-your-first-component>Step 7: Create your first component<a class=headerlink href=#step-7-create-your-first-component title="Permanent link">¶</a></h2> <p>The <a href=../your-first-component/ >next page</a> will show you how to create your first ReactPy component.</p> <p>Prefer a quick summary? Read the <strong>At a Glance</strong> section below.</p> <div class="admonition info"> <p class=admonition-title>At a Glance</p> <p><font size=5><strong><code>my_app/components.py</code></strong></font></p> <p>You will need a file to define your <a href=https://github.com/reactive-python/reactpy>ReactPy</a> components. We recommend creating a <code>components.py</code> file within your chosen <strong>Django app</strong> to start out. Within this file, we will create a simple <code>hello_world</code> component.</p> <p><!--py-header-end--> <!--py-code-start--></p> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal>1</span> | ||
|
|
@@ -93,4 +89,4 @@ | |
| <span class=x> </span><span class=cp>{%</span> <span class=k>component</span> <span class=s2>"example_project.my_app.components.hello_world"</span> <span class=nv>recipient</span><span class=o>=</span><span class=s2>"World"</span> <span class=cp>%}</span> | ||
| <span class=x> </body></span> | ||
| <span class=x></html></span> | ||
| </code></pre></div></td></tr></table></div> </div> <hr> <div class=md-source-file> <small> Last update: <span class="git-revision-date-localized-plugin git-revision-date-localized-plugin-date">October 22, 2024</span> </small> </div> <div class=md-source-date> <small> Authors: <span class="git-page-authors git-authors"><a href=mailto:[email protected]>Mark Bakhit</a></span> </small> </div> </article> </div> </div> <button type=button class="md-top md-icon" data-md-component=top hidden> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8v12Z"/></svg> Back to top </button> </main> <footer class=md-footer> <div class="md-footer-meta md-typeset"> <div class="md-footer-meta__inner md-grid"> <div class=md-copyright> <div class=md-copyright__highlight> © <div id=year></div> <script>document.getElementById("year").innerHTML = new Date().getFullYear();</script> Reactive Python and affiliates. <div class=legal-footer-right>This project has no affiliation to ReactJS or Meta Platforms, Inc.</div> </div> </div> </div> </div> </footer> </div> <div class=md-dialog data-md-component=dialog> <div class="md-dialog__inner md-typeset"></div> </div> <script id=__config type=application/json>{"base": "../..", "features": ["navigation.instant", "navigation.tabs", "navigation.tabs.sticky", "navigation.top", "content.code.copy", "search.highlight"], "search": "../../assets/javascripts/workers/search.a264c092.min.js", "translations": {"clipboard.copied": "Copied to clipboard", "clipboard.copy": "Copy to clipboard", "search.result.more.one": "1 more on this page", "search.result.more.other": "# more on this page", "search.result.none": "No matching documents", "search.result.one": "1 matching document", "search.result.other": "# matching documents", "search.result.placeholder": "Type to start searching", "search.result.term.missing": "Missing", "select.version": "Select version"}, "version": {"provider": "mike"}}</script> <script src=../../assets/javascripts/bundle.4e0fa4ba.min.js></script> <script src=../../assets/js/main.js></script> </body> </html> | ||
| </code></pre></div></td></tr></table></div> </div> <hr> <div class=md-source-file> <small> Last update: <span class="git-revision-date-localized-plugin git-revision-date-localized-plugin-date">December 2, 2024</span> </small> </div> <div class=md-source-date> <small> Authors: <span class="git-page-authors git-authors"><a href=mailto:[email protected]>Mark Bakhit</a></span> </small> </div> </article> </div> </div> <button type=button class="md-top md-icon" data-md-component=top hidden> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8v12Z"/></svg> Back to top </button> </main> <footer class=md-footer> <div class="md-footer-meta md-typeset"> <div class="md-footer-meta__inner md-grid"> <div class=md-copyright> <div class=md-copyright__highlight> © <div id=year></div> <script>document.getElementById("year").innerHTML = new Date().getFullYear();</script> Reactive Python and affiliates. <div class=legal-footer-right>This project has no affiliation to ReactJS or Meta Platforms, Inc.</div> </div> </div> </div> </div> </footer> </div> <div class=md-dialog data-md-component=dialog> <div class="md-dialog__inner md-typeset"></div> </div> <script id=__config type=application/json>{"base": "../..", "features": ["navigation.instant", "navigation.tabs", "navigation.tabs.sticky", "navigation.top", "content.code.copy", "search.highlight"], "search": "../../assets/javascripts/workers/search.a264c092.min.js", "translations": {"clipboard.copied": "Copied to clipboard", "clipboard.copy": "Copy to clipboard", "search.result.more.one": "1 more on this page", "search.result.more.other": "# more on this page", "search.result.none": "No matching documents", "search.result.one": "1 matching document", "search.result.other": "# matching documents", "search.result.placeholder": "Type to start searching", "search.result.term.missing": "Missing", "select.version": "Select version"}, "version": {"provider": "mike"}}</script> <script src=../../assets/javascripts/bundle.4e0fa4ba.min.js></script> <script src=../../assets/js/main.js></script> </body> </html> | ||
Oops, something went wrong.