Customizing Jupyter Notebook appearance with the custom.css file

Jupyter Notebooks, previously IPython Notebook, is a smooth interface for exploratory programming. It allows for line by line execution with the addition of some great visualization of results.   It is not a great default IDE but serves its niche well. There are many kernels supported, including Python, R, Scala, C++.

To get started with Jupyter notebooks follow the  installation instructions here.

This post is focused on changing the aesthetics of your notebook. When I was starting with IPython I was working long hours through the Data Incubator‘s course work. My eyes seemed to suffer from the white screens for so many hours.  Example below:

jupyter_example_white

We can customize the custom.css file at ~/.jupyter/custom/custom.css to get an appearance in line with our preferences.

I prefer snagging the great themes other’s skilled in CSS have been kind enough to provide. I’m currently using a Oceans16.css created by Kyle Dunovan. Example Below:

jupyter_example_dark

Searching ‘jupyter css themes’ offers a good selection of alternative styles.

If you’re using IPython, Damian Avila‘s 48-themes-for-your-ipython-notebook post was a great resource but the commands seem to be dated and require digging into the comments to address some things.

It is also possible to customize the key bindings in Jupyter Notebooks, very useful for say adding a hotkey for moving cells up and down. I haven’t dug into this yet  but hope to post about it soon.

Please leave a comment below if you feel this post is lacking in some way. I’m always learning myself and happy to learn from others.

Web Development Crash Course Resources

Jumping on the dev/programming train.

Bootcamps

If you’re interested in an in-person intensive bootcamp Course Report has a pretty comprehensive list with reviews:

Online Dev “Comprehensive” Courses:
Freecodecamp is a decent flyby. It seemed pretty comprehensive at the early levels. They give a “full stack” certificate but my impression is the front end is fairly good but the back end is still being fleshed out. It is Javscript-centric which I think is a very good thing as it’s base just keeps growing and growing in web dev.
The Odin Project is another similar “course”. It’s a bit less hand holding. It uses Ruby in addition to Javascript for the scripting.
Full Stack Python is another one that I came across but haven’t looked too deeply into

Some helpful sites for programming (free):

khanacademy.com: I didn’t like their programming content when I tried it out years ago but It looks like they’ve revised it since then. I usually really like their content. Specifically, I think their math content is exceptional.
codecademy.com: Can be a nice place to start. I did their python course a while back and that was pretty short but it looks like their web dev is a bit more comprehensive.
hackerrank.com: The main purpose being challenges but they have more educational challenges that offer a lot of learning on broad programming topics
geeksforgeeks.org: expansive resource

Some other helpful sites (paid, or paid past intro stuff):

codeschool.com (now owned by Pluralsight): Fine
pluralsight.com: a lot of content but I haven’t checked it out yet

In person resources:

These can be invaluable. Making connections with other people also learning or actually do what you want to do can help keep you motivated as well as make the process more fun.

Meetup: There are groups for all dev types and many tech specific groups. I highly recommend attending any meetups related to her interests or even go see a few and see what looks interesting.

In the Salt Lake City, Utah area (where I’m located) I have some more specific suggestions-
Utah Geek Events: A great local resource. Semiannual free (sponsored by local companies) conferences across a lot of developer domains and topics. I highly recommend signing up for the newsletter for upcoming events.
Open West: yearly conference coming up in July. I haven’t attended one yet but it looks similar to the events hosted by Utah Geek Events

MOOCs:

They can be helpful but be careful of watching/listening and not using or building enough
Coursera is great depending on the instructor but I have never felt the assignments or quizzes really pushed very hard.
Udacity, much industry focus opposed to academic, actually has some pretty good courses and I was pushed on the quizzes in the “advanced” level program design course I took. That course was taught by Peter Norvig, brilliant guy, director of Research at Google. Had decent coverage of program design, algorithms, and data structures.
edX also has some great content
Udemy is another but I haven’t tried it out

Some other stuff:

Finding a good IDE is helpful. Everyone has their preferences. Many are so customizable that it doesn’t matter much. Some IDEs are much more friendly for certain tech. I use Atom. It seems a lot are adopting Visual Studio Code. Others really like Sublime Text. More environment and larger project type IDEs include Visual Studio and Eclipse. Hotkeys are your friend. Memorize your chosen IDEs hotkeys as quickly as possible as it will benefit you immensely.
Stack Overflow Developer Survey 2016 has a lot of interesting information related to the field.
Free code camp recently released the results of a similar survey they conducted.
Signing up on topics of interest with Quora and Stack Overflow newsletters and/or apps can provide a great stream of knowledge.
I think Carlos Matias La Borde’s answer on Quora gives a good overview of what’s involved in web development:
Getting familiar with Git and GitHub early will help with debugging and feeling safe trying things out and not having to worry about breaking anything. Revision control is a necessary skill to have when working with any team. Github has some good beginner tutorials. This is a good graphic based tutorial to get beyond the basics but should be done after the Github ones so it has more meaning.
Not for the beginner:
Once someone has a bit of coding and some Python experience thisFlask tutorial  gave me better incite in how a dynamic page works and even web page development in general.
Digital Ocean hosts cloud computing and has some great tutorials to say build a stack. This can offer some deeper incite when building something from nearly scratch and having a server to test things on. Check out my Spin Up A Server to WordPress: How This Got Here post if you’re interested in that.

I have not gone through all of this content from end to end so please let me know if something needs to be revised or if you you know of some great resource you’d like me to add.
Leave a comment below if you feel this post is lacking in some way. I’m always learning myself and happy to learn from others.

Spin Up A Server to WordPress: How This Got Here

With a desire to share some of the projects I work on and little tidbits of knowledge I learn along the way that might benefit others I have created this site. This post will describe  the resources and link to the tutorials used to get it up and running.


TL;DR:

Follow these great tutorials provided by Digital Ocean to build the WordPress stack from Ubuntu up:

If you just want WordPress up and running and don’t care about building the stack you can follow:

How to use the WordPress One-Click Install on DigitalOcean


Prerequisites

Familiarity with the command line – These tutorials seemed pretty fool proof even if you were to blindly copy commands but some familiarity with the command line (navigating file systems, using terminal-based text editors) would help you not get lost.

Getting Started

I chose DigitalOcean to host my cloud server. They provide very quick setup of instances and I really like their many helpful tutorials. Some other options include: Amazon Web Services, Microsoft’s Azure, and Google’s Cloud.

The pricing seems pretty consistent across the suppliers for the same specs. Some have options that may more closely fit what sort of needs you may have for your server. For example, AWS offers their T-type instances as burstable performance instances. These are great if you expect lulls and burst activity for say a web server.

Once you’ve chosen a provider, choosing your instance specs comes next. The server hosting this page is has 512 MB memory, 20 GB HD and runs Ubuntu 14.04 x64.  That is their smallest instance size as I don’t plan on demanding much out of this instance. The 512 MB level costs $5/month or $0.007/hour.

It is possible to use their one-click apps instances and there you go you’ve got WordPress, MondgoDB, or Redis. I wanted to get more familiar with building the necessary stack so did not use the one-click apps option.

Getting started with your new server

The Initial Server Setup with Ubuntu 14.04 tutorial walks through the initial connection and securing the server for access only by you or those you allow to access the server.

 

The Additional Recommended Steps for New Ubuntu 14.04 Servers tutorial was helpful but not necessary. It walked through:

  • setting up a firewall,
  • selecting the time zone (“will help prevent some inconsistent behavior that can arise from out-of-sync clocks”),
  • and creating the swap file (virtual memory file for extension of RAM).
Installing LAMP

LAMP stands for Linux operating system, Apache web server, MySql database, and PHP. This is a common “stack” of software infrastructure for the web.  Each component can be subbed out with alternatives say if you have a preferences e.g. python instead of PHP or a different data storage subbed for MySql.  How To Install Linux, Apache, MySQL, PHP (LAMP) stack on Ubuntu 14.04 walks through the basic set up of the AMP portion of the stack.

Installing WordPress

Lastly, the How To Install WordPress on Ubuntu 14.04 walks through the WordPress install and setup.

You now have a WordPress site.

Setting up a domain name

Lastly, we will connect a Domain name. From the steps above you will have an ip location for your content and people are able to navigate to say 999.999.999.99 if you’re using IPv4 or  2001:0db8:0000:0042:0000:8a2e:0370:7334  using IPv6 but a domain name is what people tend to use to navigate to sites.

Digital Ocean also had some great content explaining how ip’s and domain names fit together:  An Introduction to DNS Terminology, Components, and Concepts. The quick take away is an ip look up takes place for a domain name. This lookup can occur on your computer or through a network of name servers. We need to notify the name servers of our ip’s domain (which we still may need to buy).

Sites like GoDaddy or NameCheap allow you to purchase your domain name. The domain can be alone can be very cheap especially if you go with non-generic top-level domains e. g. sethcapaul.futbol instead of sethcpual.com. Hosting (which we’re doing through our our server is usually the more expensive part.

Once you have an awesome www.your-domain.ninja domain you can walk through How To Set Up a Host Name with DigitalOcean if you used Digital Ocean. If you’ve decided, on another option the concept will is the same.

You should now have a great blog hopefully at your-domain.tatoo.

 

If you have some suggestions  or improvements on the above content, also please leave a comment below.  If you experience any problems with this content, the Digital Ocean forum is a great resource.