index.ipynb

{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Hugo\n",
    "## Hugo in your browser\n",
    "\n",
    "Welcome. Work through [the Quick Start](https://gohugo.io/getting-started/quick-start/) as a demo. (Some extras from [here](https://www.digitalocean.com/community/tutorials/how-to-install-and-use-hugo-a-static-site-generator-on-ubuntu-14-04) have been added.) \n",
    "\n",
    "Note for running in the notebook, the cells running the shell commands have the first line bing `%%bash`. This is an example of cell magic, see [here](https://ipython.readthedocs.io/en/stable/interactive/magics.html), and in this case runs the contents on the command line. Alternatively, we could have pre-appended the shell comamnds with an exclamation mark.\n",
    "\n",
    "\n",
    "## Quick start\n",
    "\n",
    "#### Verify installed."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Hugo Static Site Generator v0.71.1-A301F6B2/extended linux/amd64 BuildDate: 2020-05-25T09:18:12Z\n"
     ]
    }
   ],
   "source": [
    "%%bash\n",
    "hugo version"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "#### Create a new site"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 2,
   "metadata": {
    "scrolled": true
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Congratulations! Your new Hugo site is created in /home/jovyan/quickstart.\n",
      "\n",
      "Just a few more steps and you're ready to go:\n",
      "\n",
      "1. Download a theme into the same-named folder.\n",
      "   Choose a theme from https://themes.gohugo.io/ or\n",
      "   create your own with the \"hugo new theme <THEMENAME>\" command.\n",
      "2. Perhaps you want to add some content. You can add single files\n",
      "   with \"hugo new <SECTIONNAME>/<FILENAME>.<FORMAT>\".\n",
      "3. Start the built-in live server via \"hugo server\".\n",
      "\n",
      "Visit https://gohugo.io/ for quickstart guide and full documentation.\n"
     ]
    }
   ],
   "source": [
    "%%bash\n",
    "hugo new site quickstart"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "#### Add a theme\n",
    "\n",
    "We'll use Jupyter's line magic `%cd` command to change to the `quickstart` directory for this first. The `quickstart` directory created by the `new site` command is to become 'our working directory' for subsequent cells in this notebook.\n",
    "\n",
    "Note that you use Jupyter's `%cd` command when you want to change working directories for more than one cell. If we simply used the typical `cd` to switch directories a part of commands listed with `%% bash` cell magic, we'd only be specifying to run the commands following the `cd` command in that notebook cell in the new directory. This is because although the `%% bash` cell magic says to run that cell as if it was on the command line, the process in which it gets run is ephemeral, and so upon running the last line in that cell, the running process is destroyed by the Jupyter notebook machinery. The next cell that would be run has no memory of that change of directory command."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "/home/jovyan/quickstart\n"
     ]
    }
   ],
   "source": [
    "%cd quickstart"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Initialized empty Git repository in /home/jovyan/quickstart/.git/\n"
     ]
    },
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      "Cloning into '/home/jovyan/quickstart/themes/ananke'...\n"
     ]
    }
   ],
   "source": [
    "%%bash\n",
    "git init\n",
    "git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Add the theme to the site configuration."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "metadata": {},
   "outputs": [],
   "source": [
    "%%bash\n",
    "echo 'theme = \"ananke\"' >> config.toml"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "#### Install the Pygments Syntax Highlighter\n",
    "\n",
    "This will already be installed if you are using this site via a `launch binder` button and so when the next cell is run, we'll see `Requirement already satisfied`."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Requirement already satisfied: Pygments in /srv/conda/envs/notebook/lib/python3.7/site-packages (2.6.1)\n"
     ]
    }
   ],
   "source": [
    "%%bash\n",
    "pip install Pygments"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "We can view the available styles of code highlighting."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 7,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/plain": [
       "['default',\n",
       " 'emacs',\n",
       " 'friendly',\n",
       " 'colorful',\n",
       " 'autumn',\n",
       " 'murphy',\n",
       " 'manni',\n",
       " 'monokai',\n",
       " 'perldoc',\n",
       " 'pastie',\n",
       " 'borland',\n",
       " 'trac',\n",
       " 'native',\n",
       " 'fruity',\n",
       " 'bw',\n",
       " 'vim',\n",
       " 'vs',\n",
       " 'tango',\n",
       " 'rrt',\n",
       " 'xcode',\n",
       " 'igor',\n",
       " 'paraiso-light',\n",
       " 'paraiso-dark',\n",
       " 'lovelace',\n",
       " 'algol',\n",
       " 'algol_nu',\n",
       " 'arduino',\n",
       " 'rainbow_dash',\n",
       " 'abap',\n",
       " 'solarized-dark',\n",
       " 'solarized-light',\n",
       " 'sas',\n",
       " 'stata',\n",
       " 'stata-light',\n",
       " 'stata-dark',\n",
       " 'inkpot']"
      ]
     },
     "execution_count": 7,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "from pygments.styles import get_all_styles\n",
    "styles = list(get_all_styles()) #based on https://pygments.org/docs/styles/#getting-a-list-of-available-styles\n",
    "styles"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "You can try out styles [here](https://pygments.org/demo/)."
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "#### Add some content"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 8,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "/home/jovyan/quickstart/content/posts/my-first-post.md created\n"
     ]
    }
   ],
   "source": [
    "%%bash\n",
    "hugo new posts/my-first-post.md"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "We can verify that happened by running the next cell to see the content of the created post."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 9,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "---\n",
      "title: \"My First Post\"\n",
      "date: 2020-09-18T20:28:33Z\n",
      "draft: true\n",
      "---\n",
      "\n"
     ]
    }
   ],
   "source": [
    "%%bash\n",
    "cat /home/jovyan/quickstart/content/posts/my-first-post.md "
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "#### Add some more content"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 10,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "/home/jovyan/quickstart/content/about.md created\n"
     ]
    }
   ],
   "source": [
    "%%bash\n",
    "hugo new about.md"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 11,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "\u001b[K25lBuilding sites … \u001b[?25h\n",
      "                   | EN  \n",
      "-------------------+-----\n",
      "  Pages            | 11  \n",
      "  Paginator pages  |  0  \n",
      "  Non-page files   |  0  \n",
      "  Static files     |  6  \n",
      "  Processed images |  0  \n",
      "  Aliases          |  1  \n",
      "  Sitemaps         |  1  \n",
      "  Cleaned          |  0  \n",
      "\n",
      "Built in 162 ms\n",
      "Watching for changes in /home/jovyan/quickstart/{archetypes,content,data,layouts,static,themes}\n",
      "Watching for config changes in /home/jovyan/quickstart/config.toml\n",
      "Environment: \"development\"\n",
      "Serving pages from memory\n",
      "Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender\n",
      "Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)\n",
      "Press Ctrl+C to stop\n",
      "^C\n"
     ]
    }
   ],
   "source": [
    "!hugo server -D"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Click following link to open & preview content on development server: \n",
    "\n",
    "[the running development server](../proxy/1313)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "**Note the rendering for the development serve is very basic because it doesn't render css right now.** But it shows the site index file has been made\n",
    "\n",
    "You can see the first post you made by appending `/posts/my-first-post/` after the link to the running development server. The URL will then resemble `https://hub.gke.mybinder.org/user/fomightez-gohugo-binder-gvlmulew/proxy/1313/posts/my-first-post/`.\n",
    "\n",
    "Stop the cell above from continuing to run and then try below.\n",
    "\n",
    "## Make static content that can be used elsewhere\n",
    "\n",
    "In order to get the new pages to render as static pages, update the header of the post to say `draft: false`."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "!rm -rf public\n",
    "!sed -i 's/draft: true/draft: false/g' content/posts/my-first-post.md \n",
    "!sed -i 's/draft: true/draft: false/g' content/about.md\n",
    "!hugo"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "import IPython\n",
    "url = \"quickstart/public/index.html\"\n",
    "iframe = '<iframe src=' + url + ' width=700 height=350></iframe>'\n",
    "IPython.display.HTML(iframe)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "import IPython\n",
    "url = \"quickstart/public/posts/my-first-post/index.html\"\n",
    "iframe = '<iframe src=' + url + ' width=700 height=350></iframe>'\n",
    "IPython.display.HTML(iframe)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "import IPython\n",
    "url = \"quickstart/public/about/index.html\"\n",
    "iframe = '<iframe src=' + url + ' width=700 height=350></iframe>'\n",
    "IPython.display.HTML(iframe)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Note that result looks better than what the following gives:\n",
    "  \n",
    "```python\n",
    "import IPython\n",
    "IPython.display.HTML(filename='public/posts/my-first-post/index.html')\n",
    "```\n",
    "But above results in a similar rudimentary look that shows the file has been at least made.\n",
    "\n",
    "The following also gives rudimentary look but without the border:\n",
    "\n",
    "```python\n",
    "#based on https://forum.humanbrainproject.eu/t/problem-with-iframe-in-jupyter-notebook/528/2\n",
    "import os\n",
    "base_url = !jupyter notebook list --json | python3 -c 'import json; import sys; print(json.load(sys.stdin)[\"base_url\"])' # based on https://discourse.jupyter.org/t/collaborating-on-one-binder-instance/407/8?u=fomightez\n",
    "report_path = f\"https://hub.gke.mybinder.org/{base_url[0][1:-1]}/view/quickstart/public/posts/my-first-post/index.html\"\n",
    "rel_report_path = os.path.relpath(report_path)\n",
    "rel_report_path = report_path\n",
    "from IPython.display import IFrame    \n",
    "display(IFrame(rel_report_path, width=900, height=650))\n",
    "```\n",
    "\n",
    "Let's try that version:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "#based on https://forum.humanbrainproject.eu/t/problem-with-iframe-in-jupyter-notebook/528/2\n",
    "import os\n",
    "base_url = !jupyter notebook list --json | python3 -c 'import json; import sys; print(json.load(sys.stdin)[\"base_url\"])' # based on https://discourse.jupyter.org/t/collaborating-on-one-binder-instance/407/8?u=fomightez\n",
    "report_path = f\"https://hub.gke.mybinder.org/{base_url[0][1:-1]}/view/quickstart/public/posts/my-first-post/index.html\"\n",
    "rel_report_path = os.path.relpath(report_path)\n",
    "rel_report_path = report_path\n",
    "from IPython.display import IFrame    \n",
    "display(IFrame(rel_report_path, width=900, height=650))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Another display iFrame variation I saw:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "import os\n",
    "report_path = \"quickstart/public/posts/my-first-post/index.html\"\n",
    "rel_report_path = os.path.relpath(report_path)\n",
    "rel_report_path = report_path\n",
    "from IPython.display import IFrame    \n",
    "display(IFrame(rel_report_path, width=900, height=650))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "import time\n",
    "\n",
    "def executeSomething():\n",
    "    #code here\n",
    "    print ('.')\n",
    "    time.sleep(480) #60 seconds times 8 minutes\n",
    "\n",
    "while True:\n",
    "    executeSomething()"
   ]
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.7.8"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}