--- title: Where to go tagline: presenting data analysis projects date: 2022-03-28 00:00:00 description: > The package nbinteract aims to enable authors and educators to create and share interactive web pages easily. Interactive explanations of concepts are useful for communicating and explaining tricky concepts. keywords: > opensource, free, load, download, start, starter, example, high, easy, use, secure, encrypt, standard, popular, generate, create, learn, distribute, publish, deploy, beginner, advanced, expert, student, learner, educator, writer, reader, visitor, framework, toolkit, integration, extension, module, api, dynamic, static, generator, client, server, internet, local, localhost, page, web, website, webdesign, material, design, responsive, javascript, nodejs, ruby, windows, linux, osx, mac, os, http, https, html, html5, css, scss, style, browser, firefox, chrome, edge, opera, safari, configuration, generator, navigation, menu, dropdown, fab, action, button, application, interface, provider, api, repository, cookie, language, translation, gdpr, dsgvo, privacy, asciidoc, aciidoctor, bootstrap, jekyll, liquid, hyvor, disqus, git, github, netlify, heroku, apple, microsoft, provider, service, internet, support, google, analytics, advertising, search, console, silverlight, score, j1, nbi, j1-nbinteract, nbinteract, template, integration, python, jupyter, notebook, textbook, api, app, binder, binderhub, jupyterhub categories: [ Software, Python ] tags: [ Binder, Jupyter, Notebooks ] scrollbar: false fab_menu_id: page_ctrl_simple personalization: true permalink: /pages/public/jupyter/where-to-go/ regenerate: false resources: [ animate, clipboard, rouge ] resource_options: - attic: opacity: 0.3 slides: - url: /assets/images/modules/attics/tldr-1920x800.jpg alt: Photo by Alexander Redl on Unsplash badge: type: unsplash author: Alexander Redl href: https://unsplash.com/@alexanderredl # slides: # - url: /assets/images/modules/attics/yellow-cactus-1920x1280.jpg # alt: Photo by Yellow Cactus on Unsplash # badge: # type: unsplash # author: Yellow Cactus # href: https://unsplash.com/@yellowcactus --- // Page Initializer // ============================================================================= // Enable the Liquid Preprocessor :page-liquid: // Set (local) page attributes here // ----------------------------------------------------------------------------- // :page--attr: // :binder-badges-enabled: false :url-j1-notebook--times-tables: /pages/public/jupyter/examples/distributed/j1-circular-times-table/ :url-j1-notebook--climate-change: /pages/public/jupyter/examples/localized/climate-change-forecast/ // Load Liquid procedures // ----------------------------------------------------------------------------- {% capture load_attributes %}themes/{{site.template.name}}/procedures/global/attributes_loader.proc{%endcapture%} // Load page attributes // ----------------------------------------------------------------------------- {% include {{load_attributes}} scope="global" %} // Page content // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ // image:/assets/images/badges/myBinder.png[Binder, link="https://mybinder.org/", {browser-window--new}] // image:/assets/images/badges/docsBinder.png[Binder, link="https://mybinder.readthedocs.io/en/latest/", {browser-window--new}] // See: https://towardsdatascience.com/ordinal-differential-equation-ode-in-python-8dc1de21323b ifeval::[{binder-badges-enabled} == true] image:https://mybinder.org/badge_logo.svg[Binder, link="{url-binder-app-launch--lab}", {browser-window--new}] endif::[] Jupyter Notebook (JN) is an open source web application based on the programming language _Python_ that allows data scientists to create and share documents that include explanatory text, live code, equations, and other multimedia resources like images or videos. To understand the technical terms of Jupyter (JN) better, below you find a brief description the base components. Jupyter Notebook App:: The Jupyter Notebook *App* is a server-client application that allows editing and running notebook documents via a web browser. The Notebook App can be executed on a local desktop requiring no internet access or can be installed on a remote server and accessed through the internet in a cloud. Notebook documents:: Notebook documents (or *notebooks* for short) are documents created by the Notebook App, and both computer code (e.g., Python) and rich text may contain elements (paragraphs, equations, figures, links, etc.). Notebook documents are human-readable documents, alongside code descriptions and results like figures, tables, etc. == The J1 Module NBI The _Python_ package `nbinteract` allows authors to convert Jupyter Notebooks into standalone HTML text pages: the *Textbooks*. The containing elements can include arbitrary Python code to generate output as well as Python libraries like _NumPy_ and _Pandas_ and libraries that create data visualisation like _Matplotlib_, _Plotly_, _Altair_ or _Bokeh_. *Anyone* with a modern web browser can use the resulting web pages even if *no* Python or Jupyter installed on their computer. To make this possible, the J1 module *NBI* uses the freely available cloud service _Binder_. The built-in Starter Web of the template comes with a suitable NBI configuration and notebook documents for testing. You can find examples of pages that contain interactive textbooks under the menu `Lern` underneath the submenu `Experimental|Distributed Notebooks` or `Experimental|Localized Notebooks`. === Notebooks vs. Textbooks Jupyter Notebook documents with the extension `.ipynb` are *data* files in the JSON format and can only be run using the *App* of Jupyter Notebook. On the other hand, Textbooks are HTML exports of Jupyter Notebooks with the extension `.html` to be viewed in a web browser without *no* the need using a locally installed Jupyter App to be displayed. For integrating textbooks in webpages, the notebooks with the extension `.ipynb` are to be *exported* to HTML (text) files using the Python program `nbinteract`. Textbooks that have already been exported can be found for the *Starter Web* in the folder `~/pages/public/jupyter/notebooks` in the subfolder `textbooks`. === Distributed vs. Localized Textbooks The Python program `nbinteract` can export all types of containing elements of a Jupyter Notebook including embedded Javascript code that all modern web browsers can run. Important components of Jupyter notebooks are data visualizations to make sense of the data presented to the readers. Another important feature of Notebooks is *interactivity* which allows to change or select specific data elements to vary the output of data visualizations. The most flexible solution for interactive Notebooks are elements based on native Python code. To run the Python code as part of an HTML page, a computation engine is required for its execution. To run arbitrary Python code for generating output, the services at _Binder_ come into the game. The J1 module *NBI* process Textbooks that contain Python code by connecting a running Jupyter Notebook instance (JN) in the cloud. Many modern visualization libraries used for Jupyter Notebooks are based on pure Javascript code that web browsers can process without the need of an additional (external) computation engine. Distributed Textbooks:: Distributed Textbooks use embedded Python code that requires an additional computation engine. The module NBI of J1 Template connects via the _Binder_ service for execution to process and display those notebooks. This remote execution allows *all* sorts of data visualization and interactivity Jupyter Notebooks can offer. Localized Textbooks:: If the module NBI detects localized Textbooks, the module interface does *not* execute embedded Python code but displays those elements as *static* text sections. Data visualization elements are embedded as images or, depending on the visualization library used, as Javascript code that can be executed natively by a web browser. Available data visualization and interactivity depend on the visualization libraries used. == Where to go To get an impression of what exported Textbooks by the NBI module are and what can be achieved for static websites embedding and presenting Jupyter Notebooks the reader should first visit the already prepared Textbooks. Distributed Notebooks:: Distributed Notebooks demonstrate the full power of the NBI module. An interesting example may be the interactive visualization of well-known *Time Tables*. This notebook is fun but shows some magic of mathematics. You find this fun notebook link:{url-j1-notebook--times-tables}[from here, {browser-window--new}]. Localized Notebooks:: An example of a simple localized notebook is shown by link:{url-j1-notebook--climate-change}[Climate Change Forecast, {browser-window--new}]. The HTML export contains all text, code and graphical elements but is completely static, because no interactive elements are provided. // For a Starter Web, Altair and Bokeh examples are available only from // remote (jekyll.one) // Localized Notebooks are in general limited in terms of interactivity and data visualization but can achieve *similar* results if a powerful Javascript-based visualization the library is used. Excellent examples of such a powerful Javascript-based visualization libraries are demonstrated with the tour through the graphic elements of: * link:{url-j1-altair-visualizations--remote}[Altair, {browser-window--new}] * link:{url-j1-bokeh-visualizations--remote}[Bokeh, {browser-window--new}] // For a Starter Web, NBI Docs and NBI APIs are available only from // remote (jekyll.one) // NBI Documentation:: Find more about how the NBI module works and what resources are used in this section. More about the module configuration and how it is used for static web pages can be found in this section: link:{url-j1-nbi-module-docs--remote}[NBI Docs, {browser-window--new}]. NBI APIs:: More about the backgrounds of the NBI module and what are APIs are used under the hood can be found in this section. As the _Binder_ service is intensively used for distributed notebooks, more about these background service is provided at the link:{url-j1-nbi-apis-binder--remote}[Binder API, {browser-window--new}]. Having fun exploring the world of *Data Science* and *Analysis*.