Visualizing and Learning Programming, Data Structures and Algorithms.

This post bookmarks resources for visualizing and learning programming, data structures and algorithms.

• The CS Unplugged project
• The OpenDSA project
• The Runestone Interactive project.
  • Problem Solving with Algorithms and Data Structures using Python
• Python Tutor. Visualizing programs in a number of programming languages, such as, Python, Java, JavaScript, TypeScript, Ruby, C, and C++.

Web-based Intergrated Development Environments (IDEs)

A number of Web-based IDEs have been made available. Although they are not as sophisticated as desktop IDEs, such as Microsoft Visual Studio and Eclipse, they are quite convenient to share some code. This post serves as a bookmark for a few Web-based IDEs that I came across. 

• Cloud 9. You may sign up a free account; however, a credit information must be provided. It supports many popular languages.
• Repl.It. Free accounts are available. It also supports multiple programming languages. It is simpler and not as sophisticated as Cloud 9. 

Rendering Jupyter Notebooks (IPython Notebook) on Github Pages Sites

There are a number of solutions to render Jupyter notebooks on Github Pages sites.

• Convert Jupyter notebooks to static html pages using nbconvert. For example, we have a Jupyter notebook file, my_example.ipynb. We run nbconvert as follows,

  
    jupyter nbconvert --to html --template full 2017-02-01-112657.ipynb 

  
  The above produce a whole HTML document including HTML header. If you wish to embed the notebook into your own page, you may use option basic as follows,

  
    jupyter nbconvert --to html --template basic 2017-02-01-112657.ipynb 

• Another method is to use a Pelican extension, see ipynb_reader.
• You can also use Jupyter's nbviewer service. See the following example and examine the URL.
  
  Example using nbviewer

Note that Github can now render a Jupyter notebook from its repository view. However, that is different from viewing a Jupyter notebook on a Github Pages site.