blog images

Author: ShMcK

_includes/blog/head.html

@@ -29,4 +29,5 @@
   <script async src="/js/jquery-1.11.0.js"></script>
   <script async src="https://cdn.ampproject.org/v0.js"></script>
   <script async src="/js/bootstrap.min.js"></script>
+  <script async src="/js/png2gif.min.js"></script>
 </head>

_posts/blog/2016-03-15-better-coding-education.md

@@ -1,25 +1,25 @@
 ---
 layout: post
-title: Better Coding < Education />
+title: Better Coding <Education />
 categories:
 - blog
 ---
 
-The road to better coding education becomes less bumpy each year; but the speed limit hasn't changed much. Online education schools such as *Codecademy* & *CodeSchool* provide an effective and efficient learning experience often referred to as **interactive learning**:
+The road to better coding education becomes less bumpy each year; but the speed limit hasn't changed much. Online education schools such as *Codecademy* & *CodeSchool* provide an effective and efficient learning experience often referred to as **interactive learning**. Students take on a more hands on role, essentially teaching themselves. Interactive learning often involves:
 
-* step by step tasks
 * quick feedback on success and failures
+* step by step goals and instructions
 * helpful hints
 * gamification
 
 Interactive learning doesn't replace the classroom. Most beginner Bootcamp’s actually make *Codecademy* a large part of the curriculum, with teachers on hand to help. That's right, students are paying for Bootcamps like Galvanize where students do free online courses. Interactive learning doesn't replace teachers - it empowers them.
 
 But sites like *Codecademy* leave room for improvement. How so? They could:
 
-- Accelerate Content Development
-- Make Tutorials Improvable
+- Accelerate content development
+- Make tutorials that get better with time
 - Move from the browser to offline
-- Lower the cost
+- Eliminate costs
 
 I've created a free service, [*CodeRoad*](https://coderoad.github.io), which I believe offers several improvements over what's out there. I think it's pretty awesome, and I hope you will, too.
 
@@ -47,41 +47,41 @@ There are no restrictions on:
 
 ##### 1. The number of creators or contributors
 
-As any open-source project, there can be any number of creators or contributors. In fact, a state-wide high school curriculum could be developed in tandem by it's many coding teachers.
+As any open-source project, there can be any number of creators or contributors. In fact, a state-wide high school curriculum could be developed in tandem by its many coding teachers.
 
 ##### 2. The programming language
 
 *CodeRoad* can make tutorials for any number of programming languages, provided the language has an available testing framework. Just create a new [test runner](https://coderoad.github.io/docs/#test-runner), which gets called through a command-line process behind the scenes.
 
 ##### 3. The size of your project
 
-Since *CodeRoad* runs in the Atom editor, it can be used to teach users how to create large projects. How large? Consider the kind of projects that go beyond what would crash a browser-based editor.
+Since *CodeRoad* runs in the Atom editor, it can be used to teach users how to create large projects. How large? Consider the kind of projects that go beyond what would crash a browser-based editor. Hypothetically, you could create a year long course tracing students through the step by step creation of entire sites or applications, such as the creation of a search engine or social networking platform.
 
 
 ## Improving Tutorials
 
-Video & most interactive tutorials face the same issue: they are static.
+Video & most interactive tutorials face the same issue: the cost of change is too high. They often remain static.
 
 > Most online learning content becomes a snapshot in time of a dynamic and evolving system of technologies.
 
-These lessons don’t take pull requests or issues; they don’t update with software or APIs. It's hard to fix errors or add updates or changes. Courses should get better with time.
+These lessons don’t take pull requests or issues; they don’t update with software or APIs. They rarely fix errors or add updates, instead choosing to completing redo courses for the next release. Courses need to iterate to get better with time.
 
 ##### 1. Versioned tutorials
 
 CodeRoad tutorials are version controlled, with new versions published to NPM.
 
 ##### 2. Issues & Pull Requests
 
-Open source software works on a spirit of collaboration. See a problem, post an **issue**. Want to fix something? Submit a **pull request**.
+Open-source software works on a spirit of collaboration. See a problem, post an **issue**. Want to fix something? Submit a **pull request**.
 
 ##### 3. Student edits & issues
 
-*CodeRoad* provides optional one-click access for students post issues or submit reviewable edits. After all, they better learn about git somewhere.
+*CodeRoad* provides optional one-click access for students to post issues or submit reviewable edits. After all, they better learn about git somewhere.
 
 
 ## Moving Tutorials Offline
 
-During the weekend of March 4-6th, *CodeSchool* generously offered it’s courses for free. Unfortunately, increased demand led to peak time network issues & slow performance.
+During the weekend of March 4-6th, *CodeSchool* generously offered it’s courses for free. Unfortunately, increased demand led to peak-time network issues & slower performance.
 
 Putting tutorials online not only increases server costs, but also creates unnecessary issues. *CodeRoad*, on the other hand, downloads tutorials in their entirety and runs them locally on your computer.
 
@@ -103,9 +103,9 @@ Even when I taught coding in South Korea, internet connectivity on campus was an
 
 At the end of the day, online education companies have to pay the bills. There are server costs, salaries, investors, etc.
 
-*CodeRoad*'s only cost is my time. It is hosted on Github & distributed via NPM. The editor and tutorial building tools are open-source and will remain free.
+*CodeRoad* is hosted on Github & distributed via NPM. The editor and tutorial building tools are open-source and will remain free. Any tutorials built are the work of the creators.
 
-Any tutorials built are the work of the creators. If the project becomes popular, I'll create a marketplace for tutorial creators who wish to charge for their efforts. However, if there isn't much interest, I'll just have to get a real job.
+If *CodeRoad* becomes popular, I'll create a marketplace for tutorial creators who can charge whatever they'd like for their efforts.
 
 ---
 
@@ -115,4 +115,4 @@ I developed *CodeRoad* out of a love for online education that inspired me not j
 
 *CodeRoad* doesn't aim to compete with *Codecademy* or *CodeSchool*, but rather to supplement their great lessons with a greater variety of interactive content.
 
-There is a long road ahead.
+We know how people learn best. Interactive learning is not just more fun - its a better use of student time with better results. Coding education can get better. There is a long road ahead.

_posts/blog/2016-03-15-building-atom-plugins-with-react.md

@@ -1,4 +1,4 @@
-# Outline
+# The Future of Editor Plugins
 
 Ask a coder where he or she works, and you'll hear a variety of answers: at home, a coffeeshop, in an office. The reality: location isn't important, programmers work in an editor. You can customize your editor just as you might customize your workspace.
 
@@ -10,15 +10,31 @@ What if you could use modern javascript tools & frameworks to create plugins and
 
 There is a lot of untapped potential in the area of plugin development. A lot of this is due to the learning curve involved in creating a plugin.
 
-Let's look at some interesting UI dependent plugins in Atom:
+## UI Plugins
+
+Let's look at some interesting plugins that rethink UI in Atom:
 
-* [Regex Railroad Diagram](https://atom.io/packages/regex-railroad-diagram) - regex visualizer
 * [Color Picker](https://atom.io/packages/color-picker) - select Hex colors
+
+![Color Picker plugin](/img/blog/gif/color-picker.png){: .gif}
+
+* [Regex Railroad Diagram](https://atom.io/packages/regex-railroad-diagram) - regex visualizer
+
+![Regex Railroad plugin](/img/blog/gif/regex-railroad.png)
+
 * [Git Time Machine](https://atom.io/packages/git-time-machine) - visualize your Git history
+
+![Git Time Machine plugin](/img/blog/gif/git-time-machine.png){: gif}
+
 * [Floobits](https://atom.io/packages/floobits) - video chat in Atom
-* [IMDone](https://atom.io/packages/imdone-atom) - Trello style TODO lists
 
-What kind of renaissance might happen when simple & modern UI comes to Atom? Here's to the future.
+![Floobits screen share plugin](/img/blog/gif/floo-bits){: gif}
+
+
+> What kind of renaissance might happen when simple & modern UI comes to Atom?
+
+You can build Atom plugins using *React*, *Angular 2*, or your favorite UI framework. But first you have to understand Atom.
+
 
 ## Fixing Some Atom Misconceptions
 
@@ -28,21 +44,21 @@ Atom utilizes [Electron](https://github.com/atom/electron), a cross-platform des
 
 Recognize the dev tools in the image above? Yes, Electron is built on top of Chromium using Chrome's V8 Engine. In other words, you can check Atom's ES2015 support by finding:
 
-* [Atom's Electron version](https://github.com/atom/atom/blob/master/package.json) (currently 0.36.8)
-* [Electron's Chrome version](https://github.com/atom/electron/releases/tag/v0.36.0) (currently Chrome 47)
+* [Atom's Electron version](https://github.com/atom/atom/blob/master/package.json) (0.36.8)
+* [Electron's Chrome version](https://github.com/atom/electron/releases/tag/v0.36.0) (Chrome 47)
 * [Chrome's ES2015 support](https://kangax.github.io/compat-table/es6/#chrome47) (65% ES2015 coverage)
 
 Short answer: you'll be targeting ES5 for a while.
 
 #### X You must use CoffeeScript. X
-Internally Atom source code, documentation and most plugins are written in CoffeeScript. Not a fan of CoffeeScript? Well, CoffeeScript isn't necessary to hack Atom, only a good understanding of how `.coffee` and `.cson` files compile to JS.
+Internally Atom source code, documentation and most plugins are written in CoffeeScript. Not a fan of CoffeeScript? Well, CoffeeScript isn't necessary to hack Atom, but you will require a good understanding of how `.coffee` and `.cson` files compile to JS.
 
-I'd recommend learning the basics from the [CoffeeScript Guide](http://coffeescript.org/) combined with using an online transpiler like [js2.coffee](http://js2.coffee/)). Personally, I transpile my code from TypeScript, but there are plenty of options.
+I'd recommend learning the basics from the [CoffeeScript Guide](http://coffeescript.org/) combined with using an online transpiler like [js2.coffee](http://js2.coffee/)). Personally, I transpile my code from TypeScript; Atom allows for a lot of JS options.
 
 #### X Atom is built with React. X
-Although there was an experimental effort to [move atom to React](http://blog.atom.io/2014/07/02/moving-atom-to-react.html) back in 2014, [performance concerns](https://github.com/atom/atom/pull/5624) lead to removing React.
+Although there was an experimental effort to [move atom to React](http://blog.atom.io/2014/07/02/moving-atom-to-react.html) back in 2014, [performance concerns](https://github.com/atom/atom/pull/5624) lead to React's removal.
 
-The framework of choice for Atom continues to be an [older version of Space-Pen](https://github.com/atom-archive/space-pen/tree/3.x). I suppose if it ain't broke, don't fix it. Don't worry, you can opt in or out of using space-pen for your plugins.
+The framework of choice for Atom continues to be an [older version of *Space-Pen*](https://github.com/atom-archive/space-pen/tree/3.x). I suppose if it ain't broke, don't fix it. Again, don't worry, you can opt in or out of using *Space-Pen* 3.x for your plugins.
 
 
 ## Creating Packages
@@ -54,6 +70,8 @@ Atom provides fairly comprehensive resources including a [Flight Manual](https:/
 ##### The bad news:
 None of these examples, and only a small fraction of these packages utilize more modern web tools or frameworks.
 
+### Boilerplate
+
 
 
 ## Separating concerns