Skip to content

Commit 351165f

Browse files
committed
Move notes about Jupyter Notebooks to a separate file
1 parent 565a786 commit 351165f

2 files changed

Lines changed: 114 additions & 106 deletions

File tree

_extras/jupyter_notebooks.md

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
---
2+
layout: page
3+
title: "Overview of Jupyter Notebooks"
4+
permalink: /jupyter_notebooks/
5+
---
6+
7+
![Example Jupyter Notebook](../fig/00_0_jupyter_notebook_example.jpg)
8+
*Screenshot of a [Jupyter Notebook on quantum mechanics](https://github.com/jrjohansson/qutip-lectures) by Robert Johansson*
9+
10+
### How the Jupyter notebook works
11+
12+
After typing the command `jupyter notebook`, the following happens:
13+
14+
* A Jupyter Notebook server is automatically created on your local machine.
15+
* The Jupyter Notebook server runs locally on your machine only and does not
16+
use an internet connection.
17+
* The Jupyter Notebook server opens the Jupyter notebook client, also known
18+
as the notebook user interface, in your default web browser.
19+
20+
![Jupyter notebook file browser](../fig/00_1_jupyter_file_browser.png)
21+
*The Jupyter notebook file browser*
22+
23+
* To create a new Python notebook select the "New" dropdown on the upper
24+
right of the screen.
25+
26+
![Jupyter notebook file browser](../fig/00_2_jupyter_new_notebook.png)
27+
*The Jupyter notebook file browser*
28+
29+
* When you can create a new notebook and type code into the browser, the web
30+
browser and the Jupyter notebook server communicate with each other.
31+
32+
![new Jupyter notebook](../fig/00_3_jupyter_blank_notebook.png)
33+
*A new, blank Jupyter notebook*
34+
35+
* Under the "help" menu, take a quick interactive tour of how to
36+
use the notebook. Help on Jupyter and key workshop packages is
37+
available here too.
38+
39+
![Jupyter tour and help](../fig/00_4_jupyter_tour_help.png)
40+
*User interface tour and Help*
41+
42+
* The Jupyter Notebook server does the work and calculations, and the web
43+
browser renders the notebook.
44+
* The web browser then displays the updated notebook to you.
45+
46+
* For example, click in the first cell and type some Python code.
47+
48+
![Code cell](../fig/00_5_jupyter_code_before.png)
49+
*A Code cell*
50+
51+
* This is a **Code** cell (see the cell type dropdown with the word **Code**).
52+
To run the cell, type Shift-Enter.
53+
54+
![Code cell and its output](../fig/00_6_jupyter_code_after.png)
55+
*A Code cell and its output*
56+
57+
* Let's look at a **Markdown** cell. Markdown is a text manipulation
58+
language that is readable yet offers additional formatting. Don't forget
59+
to select **Markdown** from the cell type dropdown. Click in the cell and
60+
enter the markdown text.
61+
62+
![markdown input cell](../fig/00_7_jupyter_markdown_before.png)
63+
*A markdown input cell*
64+
65+
* To run the cell, type Shift-Enter.
66+
67+
![rendered markdown cell](../fig/00_8_jupyter_markdown_after.png)
68+
*A rendered markdown cell*
69+
70+
71+
This workflow has several advantages:
72+
73+
- You can easily type, edit, and copy and paste blocks of code.
74+
- Tab completion allows you to easily access the names of things you are using
75+
and learn more about them.
76+
- It allows you to annotate your code with links, different sized text,
77+
bullets, etc. to make information more accessible to you and your
78+
collaborators.
79+
- It allows you to display figures next to the code that produces them
80+
to tell a complete story of the analysis.
81+
82+
### How the notebook is stored
83+
84+
* The notebook file is stored in a format called JSON and has the suffix
85+
`.ipynb`.
86+
* Just like HTML for a webpage, what's saved in a notebook file looks
87+
different from what you see in your browser.
88+
* But this format allows Jupyter to mix software (in several languages) with
89+
documentation and graphics, all in one file.
90+
91+
### Notebook modes: Control and Edit
92+
93+
The notebook has two modes of operation: Control and Edit. Control mode lets
94+
you edit notebook level features; while, Edit mode lets you change the
95+
contents of a notebook cell. Remember a notebook is made up of a number of
96+
cells which can contain code, markdown, html, visualizations, and more.
97+
98+
### Help and more information
99+
100+
Use the **Help** menu and its options when needed.

setup.md

Lines changed: 14 additions & 106 deletions
Original file line numberDiff line numberDiff line change
@@ -61,9 +61,10 @@ Remember to download and install the installer for Python 3.x.
6161
The plotting package plotnine is not installed by default. From the terminal,
6262
type:
6363

64-
```
64+
~~~
6565
conda install -c conda-forge plotnine
66-
```
66+
~~~
67+
{: .language-python}
6768

6869
### Miniconda installation
6970

@@ -80,126 +81,33 @@ Python 3.x.
8081

8182
From the terminal, type:
8283

83-
```
84+
~~~
8485
conda list
85-
```
86+
~~~
87+
{: .language-bash}
8688

8789
### Install the required workshop packages with conda
8890

8991
From the terminal, type:
9092

91-
```
93+
~~~
9294
conda install -y numpy pandas matplotlib jupyter
9395
conda install -c conda-forge plotnine
94-
```
96+
~~~
97+
{: .language-bash}
9598

9699
## Launch a Jupyter notebook
97100

98101
After installing either Anaconda or Miniconda and the workshop packages,
99102
launch a Jupyter notebook by typing this command from the terminal:
100103

101-
```
104+
~~~
102105
jupyter notebook
103-
```
106+
~~~
107+
{: .language-bash}
104108

105109
The notebook should open automatically in your browser. If it does not or you
106110
wish to use a different browser, open this link: <http://localhost:8888>.
107111

108-
---
109-
110-
## Overview of the Jupyter notebook (Optional)
111-
112-
![Example Jupyter Notebook](../fig/00_0_jupyter_notebook_example.jpg)
113-
*Screenshot of a [Jupyter Notebook on quantum mechanics](https://github.com/jrjohansson/qutip-lectures) by Robert Johansson*
114-
115-
### How the Jupyter notebook works
116-
117-
After typing the command `jupyter notebook`, the following happens:
118-
119-
* A Jupyter Notebook server is automatically created on your local machine.
120-
* The Jupyter Notebook server runs locally on your machine only and does not
121-
use an internet connection.
122-
* The Jupyter Notebook server opens the Jupyter notebook client, also known
123-
as the notebook user interface, in your default web browser.
124-
125-
![Jupyter notebook file browser](../fig/00_1_jupyter_file_browser.png)
126-
*The Jupyter notebook file browser*
127-
128-
* To create a new Python notebook select the "New" dropdown on the upper
129-
right of the screen.
130-
131-
![Jupyter notebook file browser](../fig/00_2_jupyter_new_notebook.png)
132-
*The Jupyter notebook file browser*
133-
134-
* When you can create a new notebook and type code into the browser, the web
135-
browser and the Jupyter notebook server communicate with each other.
136-
137-
![new Jupyter notebook](../fig/00_3_jupyter_blank_notebook.png)
138-
*A new, blank Jupyter notebook*
139-
140-
* Under the "help" menu, take a quick interactive tour of how to
141-
use the notebook. Help on Jupyter and key workshop packages is
142-
available here too.
143-
144-
![Jupyter tour and help](../fig/00_4_jupyter_tour_help.png)
145-
*User interface tour and Help*
146-
147-
* The Jupyter Notebook server does the work and calculations, and the web
148-
browser renders the notebook.
149-
* The web browser then displays the updated notebook to you.
150-
151-
* For example, click in the first cell and type some Python code.
152-
153-
![Code cell](../fig/00_5_jupyter_code_before.png)
154-
*A Code cell*
155-
156-
* This is a **Code** cell (see the cell type dropdown with the word **Code**).
157-
To run the cell, type Shift-Enter.
158-
159-
![Code cell and its output](../fig/00_6_jupyter_code_after.png)
160-
*A Code cell and its output*
161-
162-
* Let's look at a **Markdown** cell. Markdown is a text manipulation
163-
language that is readable yet offers additional formatting. Don't forget
164-
to select **Markdown** from the cell type dropdown. Click in the cell and
165-
enter the markdown text.
166-
167-
![markdown input cell](../fig/00_7_jupyter_markdown_before.png)
168-
*A markdown input cell*
169-
170-
* To run the cell, type Shift-Enter.
171-
172-
![rendered markdown cell](../fig/00_8_jupyter_markdown_after.png)
173-
*A rendered markdown cell*
174-
175-
176-
This workflow has several advantages:
177-
178-
- You can easily type, edit, and copy and paste blocks of code.
179-
- Tab completion allows you to easily access the names of things you are using
180-
and learn more about them.
181-
- It allows you to annotate your code with links, different sized text,
182-
bullets, etc. to make information more accessible to you and your
183-
collaborators.
184-
- It allows you to display figures next to the code that produces them
185-
to tell a complete story of the analysis.
186-
187-
### How the notebook is stored
188-
189-
* The notebook file is stored in a format called JSON and has the suffix
190-
`.ipynb`.
191-
* Just like HTML for a webpage, what's saved in a notebook file looks
192-
different from what you see in your browser.
193-
* But this format allows Jupyter to mix software (in several languages) with
194-
documentation and graphics, all in one file.
195-
196-
### Notebook modes: Control and Edit
197-
198-
The notebook has two modes of operation: Control and Edit. Control mode lets
199-
you edit notebook level features; while, Edit mode lets you change the
200-
contents of a notebook cell. Remember a notebook is made up of a number of
201-
cells which can contain code, markdown, html, visualizations, and more.
202-
203-
### Help and more information
204-
205-
Use the **Help** menu and its options when needed.
112+
For a bried introduction to Jupyter Notebooks, please consult with our
113+
[Introduction to Jupyter Notebooks](/jupyter_notebooks/) page.

0 commit comments

Comments
 (0)