Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add MyST-NB for rendering notebooks, and JupySQL for running SQL #566

Merged
merged 3 commits into from
Jan 24, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,8 @@
.installed.cfg
.style
.utils
*.csv
*.db
*.egg-info
*.lint
*.pyc
Expand Down
7 changes: 7 additions & 0 deletions CHANGES.rst
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,13 @@ CHANGES

Unreleased
----------
- Added `MyST-NB`_, for rendering Jupyter notebooks
- Added `JupySQL`_, for running SQL in Jupyter/IPython
- MyST-NB: Fixed dark mode for tables in Jupyter Notebooks.
Thank you, @surister and @msbt.

.. _JupySQL: https://jupysql.ploomber.io/
.. _MyST-NB: https://myst-nb.readthedocs.io/

2024/12/13 0.37.2
-----------------
Expand Down
79 changes: 79 additions & 0 deletions docs/myst/cell.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,79 @@
---
# A Jupyter Notebook written in Markdown.
# https://myst-nb.readthedocs.io/
jupytext:
text_representation:
format_name: myst
---

(cell)=
(cells)=

# Cells

Widget elements that are like "editors with output".

:::{note}
_**Status:** Just written down, no special styling per CSS
has been applied yet. Contributions are welcome._
:::


## Sphinx

Those are solely based on vanilla [docutils]/[Sphinx] directives
`code` and `csv-table`, written down in MyST Markdown instead
of reStructuredText.

:::{code} sql
SELECT * FROM sometable
:::
:::{csv-table}
:header: >
: "schema_name", "table_name", "sum(num_docs)"
:widths: 15, 10, 30

"doc", "taxi_january", 5929248
"doc", "taxi_january_bestcompression", 5929248
"doc", "taxi_january_nocolumnstore_bestcompression", 5929248
"doc", "taxi_january_nocolumnstore_noindex_bestcompression", 5929248
"doc", "taxi_january_noindex_bestcompression", 5929248
"doc", "taxi_january_nocolumnstore", 5929248
:::

:::{code} bash
antrl4
:::
:::{code} text
Downloading antlr4-4.13.2-complete.jar
ANTLR tool needs Java to run; install Java JRE 11 yes/no (default yes)? yes
Installed Java in /root/.jre/jdk-11.0.24+8-jre; remove that dir to uninstall
ANTLR Parser Generator Version 4.13.2
:::

## IPython

Those are using [MyST-NB],
actually executing Python code,
like [doctest] is doing it.

```{code-cell} ipython3
import sys
print("this is some stdout")
print("this is some stderr", file=sys.stderr)
```

:::{important}
This actually means the documentation can include Jupyter Notebooks
now, both using the traditional .ipynb JSON file format, but also
using the .md file format, enabling [text-based notebooks].
Enjoy {ref}`notebook-text`.
:::



[docutils]: https://www.docutils.org/
[doctest]: https://docs.python.org/3/library/doctest.html
[MyST-NB]: https://myst-nb.readthedocs.io/
[Sphinx]: https://www.sphinx-doc.org/
[text-based notebooks]: https://myst-nb.readthedocs.io/en/latest/authoring/text-notebooks.html
61 changes: 61 additions & 0 deletions docs/myst/notebook-text.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
---
# A Jupyter Notebook written in Markdown.
# https://myst-nb.readthedocs.io/
file_format: mystnb
---

(notebook-text)=

# Notebook (text-based)

The documentation can include [text-based notebooks] using [MyST-NB],
effectively bringing Jupyter technologies to Markdown.

## Basics

```{code-cell} ipython3
import sys
print("this is some stdout")
print("this is some stderr", file=sys.stderr)
```

:::{tip}
See also {ref}`notebook-traditional` and {ref}`cells`.
:::

## SQL Magics

[JupySQL], the successor of [ipython-sql], enables running SQL in Jupyter/IPython
via `%sql` and `%%sql` magics.

```{code-cell} ipython3
# Acquire data.
!pip --quiet install csvkit
!curl -s -L -O https://github.com/wireservice/csvkit/raw/refs/heads/master/examples/realdata/acs2012_5yr_population.csv
!rm -f population.db
!csvsql --db sqlite:///population.db --insert acs2012_5yr_population.csv
```
```{code-cell} ipython3
# Run query using JupySQL.
%reload_ext sql
%sql sqlite:///population.db
%sql SELECT * FROM acs2012_5yr_population ORDER BY total_population DESC LIMIT 10;
```
Comment on lines +38 to +43
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for spotting the dark mode bug here, @surister.

image

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks to @msbt's excellent suggestion, submitting the fix 6221203 was easy, and it solves the problem perfectly well. Thank you very much. 💯

image

Copy link
Member Author

@amotl amotl Jan 23, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

To conclude this, filing an issue with MyST-NB about it would be perfectly sensible, sharing @msbt's CSS snippet which fixes the problem for us.

/*
Fix dark mode for tables in Jupyter Notebooks rendered by MyST-NB.
https://github.com/crate/crate-docs-theme/pull/566
*/
div.cell_output table {
  color: var(--color-content-foreground);
}
div.cell_output tbody tr:nth-child(2n+1) {
  background: var(--color-background-hover);
}

Copy link
Member Author

@amotl amotl Jan 23, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[...] filing an issue with MyST-NB about it would be perfectly sensible [...]

In the spirit of upstreaming changes, let me share a few pointers to existing issues about dark mode already (I haven't digested them, so it's really just for reference and information sharing).

Also having backlinks on them can help others to resolve the problem in an ad hoc manner, and evaluate our fix, possibly also on other spots than just tables, until a new release of MyST-NB will include a relevant fix. Those have been picked up in the same way:


:::{note}
Here, we are using SQLite, in order not to make `sqlalchemy-cratedb` a
dependency of the documentation theme. An example using CrateDB can be
explored at [CrateDB Examples: notebook/jupyter].
:::

:::{todo}
Rendering the result table has unfortunate output when using dark mode.
Please switch to light mode instead.
:::


[CrateDB Examples: notebook/jupyter]: https://github.com/crate/cratedb-examples/tree/main/notebook/jupyter
[ipython-sql]: https://github.com/catherinedevlin/ipython-sql
[JupySQL]: https://jupysql.ploomber.io/
[MyST-NB]: https://myst-nb.readthedocs.io/
[text-based notebooks]: https://myst-nb.readthedocs.io/en/latest/authoring/text-notebooks.html
Loading
Loading