<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">

  <title><![CDATA[Nate Neff]]></title>
  <link href="http://nateneff.com/atom.xml" rel="self"/>
  <link href="http://nateneff.com/"/>
  <updated>2012-01-09T15:17:31-06:00</updated>
  <id>http://nateneff.com/</id>
  <author>
    <name><![CDATA[Nate Neff]]></name>
    
  </author>
  <generator uri="http://octopress.org/">Octopress</generator>

  
  <entry>
    <title type="html"><![CDATA[Enrollio's UI Upgrade: Lessons Learned]]></title>
    <link href="http://nateneff.com/blog/2011/02/03/enrollio_facelift_lessons_learned/"/>
    <updated>2011-02-03T00:00:00-06:00</updated>
    <id>http://nateneff.com/blog/2011/02/03/enrollio_facelift_lessons_learned</id>
    <content type="html"><![CDATA[<p>Last week, I overhauled <a href="(/byteworks/2011/01/29/a_facelift_for_enrollio.html)">Enrollio&#8217;s user-interface</a>.  I&#8217;m happy with
the improvements, but I haven&#8217;t merged the changes into the <a href="https://github.com/NathanNeff/enrollio">Main Branch</a>
yet.  The new UI stuff is in a <a href="(https://github.com/NathanNeff/enrollio/tree/jquery-ui)">Separate branch</a>, and they&#8217;re not doing any good there.</p>

<h2>Wag of the finger</h2>

<p>How&#8217;s this for test output:</p>

<figure class='code'><figcaption><span></span></figcaption><div class="highlight"><table><tr><td class="gutter"><pre class="line-numbers"><span class='line-number'>1</span>
<span class='line-number'>2</span>
<span class='line-number'>3</span>
<span class='line-number'>4</span>
</pre></td><td class='code'><pre><code class='bash'><span class='line'>&gt;grails <span class="nb">test</span>-app -functional
</span><span class='line'>Tests passed: 3
</span><span class='line'>Tests failed: 55
</span><span class='line'><span class="o">{</span>% endhighlight %<span class="o">}</span>
</span></code></pre></td></tr></table></div></figure>


<p>Whoops!  Well, those are <em>functional</em> tests, and this was a UI overhaul, so
that&#8217;s to be expected.  Let&#8217;s try integration tests:</p>

<figure class='code'><figcaption><span></span></figcaption><div class="highlight"><table><tr><td class="gutter"><pre class="line-numbers"><span class='line-number'>1</span>
<span class='line-number'>2</span>
<span class='line-number'>3</span>
<span class='line-number'>4</span>
</pre></td><td class='code'><pre><code class='bash'><span class='line'>&gt;grails <span class="nb">test</span>-app -integration
</span><span class='line'>Running 69 &lt;Beavis Laugh&gt; integration tests...
</span><span class='line'>Tests passed: 56
</span><span class='line'>Tests failed: 13
</span></code></pre></td></tr></table></div></figure>


<p><strong>Meh</strong>.  I can&#8217;t deploy at this point.  I didn&#8217;t write those tests just to ignore them.</p>

<h2>What did I do wrong?</h2>

<p>Let&#8217;s identify some of the mistakes I made.  Since I&#8217;m under the bus already,
let&#8217;s not stop after the first axle.</p>

<ol>
<li>Too many things going on.  UI Upgrade + New Screens + Navigation Overhaul =
TOO BIG!-</li>
<li>I should have used a <strong>prototype</strong> for the UI changes.  A bunch of HTML/CSS
files would have been perfect.  I could&#8217;ve concentrated on look/feel and
Jquery without messing with Grails code.  It would have been easier to demo
a prototype to the users, also.  I could have cleaned everything up when
integrating the prototype into Enrollio.  Lesson learned.</li>
<li>Not much refactoring.  I would fix up a screen&#8217;s UI, then add functionality
and never bother to refactor or run tests.  Gack!</li>
<li>Never thought about merge path.  These changes have to go back into the main
branch /sometime/.  I should have gotten &#8220;Done Done&#8221; with smallish tasks,
and merged quickly / often.</li>
</ol>


<h2>What&#8217;s Next?</h2>

<p>I don&#8217;t want to compound/repeat my mistakes and blaze through this.  The new
functionality <strong>still</strong> doesn&#8217;t have any tests.  Bad Monkey!!  I want to
identify small tasks, complete them, and merge them back to the master branch.
The benefit is that Enrollio will see steady improvement, and not a giant leap
with a bunch of bugs and ugly / half broken code and tests.</p>

<p>Rules for integrating new stuff into Enrollio:</p>

<ul>
<li>Tests should stay at 100%</li>
<li>Keep merges simple and small</li>
<li>Merge changes into master branch ASAP</li>
</ul>


<h2>Plan</h2>

<ol>
<li>Go back to the main branch of Enrollio.  With Git this is very simple, and I
can easily pull changes from the branch where this train-wreck started.</li>
<li>Upgrade the UI first.  Limit to just the CSS and /maybe/ navigation improvements.
Don&#8217;t remove any functionality.</li>
<li>Identify the new features that I put into Enrollio and do Test-Driven
development.</li>
</ol>


<p>I&#8217;ll post an update next week.  May the Force be with me.</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[A Facelift for Enrollio]]></title>
    <link href="http://nateneff.com/blog/2011/01/29/a_facelift_for_enrollio/"/>
    <updated>2011-01-29T00:00:00-06:00</updated>
    <id>http://nateneff.com/blog/2011/01/29/a_facelift_for_enrollio</id>
    <content type="html"><![CDATA[<script>
    $(document).ready(function(){
        $('a[title=Comparison]').colorbox();
        $('a[rel=courses]').colorbox();
    });
</script>


<p><a href="http://ui.enrollio.org"> <img alt="About" title="New Enrollio"
src="http://nateneff.com/images/enrollio/enrollio.png" class="right" /> </a></p>

<p>I spent (quite) some time last week working on <a href="http://enrollio.org">Enrollio</a>.
Enrollio tracks enrollment and attendance for students at Byteworks.  It&#8217;s
written using the <a href="http://grails.org">Grails</a> framework by yours truly, and
it&#8217;s <a href="http://github.com/NathanNeff/enrollio">open source</a>.</p>

<p>My main goals were:</p>

<ol>
<li>Improve navigation around Enrollio</li>
<li>Simplify the enrollment process</li>
<li>Update the look and feel to <strong>Web 2.0</strong>, just in time for <strong>Booboobaba 3.0</strong> or
whatever the new webapp buzzword is.</li>
</ol>


<p>Want to see Enrollio?  Both <a href="http://enrollio.org">Old Enrollio</a> and <a href="http://ui.enrollio.org">New
Enrollio</a> are online.  You can take the tour by logging
in with username <strong>admin</strong> and password <strong>admin0</strong>.</p>

<h2>Things I Call &#8220;Improvements&#8221;</h2>

<ul>
<li><p>The student search bar is always visible for logged-in users.</p></li>
<li><p>You can resize Enrollio and <a title="Comparison"
href="http://nateneff.com/images/enrollio/comparison_overview.png"> still see menus and
data</a>.  I want to make Enrollio usable on any smart phone <strong>except</strong> the
iPhone.  But don&#8217;t worry iPhone users &#8211; the iPhone Enrollio App will be
available soon, for the low price of $300 bones.</p></li>
<li><p>Courses are now listed side-by-side under the &#8220;Courses&#8221; tab, so it only takes
one click to jump between the courses.  <a title="Old Enrollio" rel="courses"
href="http://nateneff.com/images/enrollio/courses_old.png">Old Courses</a> versus <a title="New Enrollio" rel="courses"
href="http://nateneff.com/images/enrollio/courses_new.png">New Courses</a></p></li>
<li><p>Enrolling students is much simpler now.  You only need to click on the
enrollment button and select the classes to enroll the student in.
Previously, it wasn&#8217;t that simple.  Trust me.</p></li>
<li><p>The new Enrollio is less cluttered with lines, color shades and blocks.  It
also has the cutesy-pootsey rounded corners that everyone goes monkey-nuts
for.</p></li>
</ul>


<h2>Technical stuff</h2>

<p>I apologize for going light on the tech/geek stuff, but I plan to dedicate one
or two articles about /just/ the technical stuff I learned along the way.  Stay
tuned!</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Fecba]]></title>
    <link href="http://nateneff.com/blog/2011/01/20/fecba_intro/"/>
    <updated>2011-01-20T00:00:00-06:00</updated>
    <id>http://nateneff.com/blog/2011/01/20/fecba_intro</id>
    <content type="html"><![CDATA[<p><a href="http://fecba.org"><img alt="About" src="http://nateneff.com/images/fecba_title.png" class="right" /></a></p>

<p>This year at <a href="http://stlbyteworks.org">Byteworks</a> we&#8217;ve been fortunate enough
to acquire four or five more instructors for our
<a href="http://stlbyteworks.org/programs">Earn-A-Computer</a> program.</p>

<p>This means that I&#8217;ll have enough time to start a Mentorship project with
several students from previous Earn-A-Computer classes who showed willingness
to learn new technologies and to work as a team.</p>

<p>The purpose of Byteworks&#8217; Mentorship program is to further students&#8217; technical
knowledge and teach basic project management skills.  I promise to blog about
Byteworks&#8217; Mentorship program at a later time.  For now, I want to tell
everyone about the awesomeness that is <strong>Fecba</strong>.</p>

<h2>What is Fecba?</h2>

<p>In case you couldn&#8217;t tell from the title, Fecba is a time-tracking system that
will eventually replace Byteworks&#8217; pen-and-paper approach to tracking volunteer
hours.  Currently, all Byteworks volunteers write down their hours on a
clipboard in the shop.  It&#8217;s a big chore at the end of the year when we total
the amount of hours that volunteers spend at Byteworks.</p>

<p>In addition, there&#8217;s more than enough volunteers who do not track their time.
If we make this app more available than the clipboard at Byteworks, hopefully
more volunteers will report their hours.  This will benefit us when applying
for grants and spreading the word about our organization.</p>

<p>This is a classic &#8220;Scratch your own itch&#8221; problem.  Students who contribute to
the Fecba project will see our volunteers use their program every day and
hopefully gain inspiration and motivation from peoples&#8217; feedback.  &#8216;Nuff said.</p>

<h2>Planning, Design and Coding</h2>

<p>There&#8217;s two main goals for this project: <strong>Learn</strong> and <strong>Accomplish</strong>.  This
means several things:</p>

<ul>
<li><p>We will take time to learn how fundamental things work.  In this case, Fecba
will be a Web application that sits on top of a database.  So we will learn
things like HTTP, HTML and <strong>&lt;gasp&gt;</strong> SQL.  It&#8217;s difficult to teach the
new and awesome programming tools/techniques if students don&#8217;t know the old
way of doing things and what makes the new stuff better.  Therefore, we&#8217;ll
code it the &#8220;old way&#8221; then make improvements using &#8220;the new way&#8221;.</p></li>
<li><p>We will have fun and enjoy working on the project.  It&#8217;s much easier to stick
to something if you enjoy doing it and have some skin in the game.  The
students picked the name <strong>&#8220;Fecba&#8221;</strong> and came up with the idea of using a
command-line interface to enter hours.  This is a cool twist and gives the
application some personality.</p></li>
<li><p>We will get frequent feedback from users, and put the app into production
with the minimal set of features needed.  When students see their project
being used, they will get a sense of accomplishment, and hopefully be
inspired with more ideas for the app.</p></li>
</ul>


<p>In the upcoming week, I&#8217;ll post more details about Fecba &#8211; stay tuned!</p>

<h2>See Also</h2>

<ul>
<li>Fecba <a href="http://github.com/NathanNeff/fecba"> Source Code </a></li>
<li><a href="http://fecba.org"> Fecba Staging / Demo Site </a></li>
</ul>

]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Hello World!]]></title>
    <link href="http://nateneff.com/blog/2011/01/17/hello_world/"/>
    <updated>2011-01-17T00:00:00-06:00</updated>
    <id>http://nateneff.com/blog/2011/01/17/hello_world</id>
    <content type="html"><![CDATA[<p><img alt="About" src="http://nateneff.com/images/about-pic.jpg" class="left" /></p>

<p>Well, here it is!!  I <em>finally</em> got this blog started.  I&#8217;ve wanted a blog for
a long time, having &#8220;failed&#8221; several times before.  This blog could also fail
with a resounding <strong>&#8220;pfft&#8221;</strong>, along with the likes of GeoCities, MySpace, and
<a href="http://FacebookForSmartPeople.com">Facebook for Smart People</a>, but
I&#8217;m optimistic that this will be my best attempt so far.</p>

<p>The main goal for this blog is to exercise my brain when I&#8217;m trying to learn
something or get some ideas straight.  I find it much easier to learn something
if I write down ideas and questions while I&#8217;m trying to learn.  I hope that my
experiences will help other people who are also interested in whatever I&#8217;m
posting about.</p>

<p>Here&#8217;s a list of things that you <strong>won&#8217;t</strong> see here:</p>

<ul>
<li>Reviews (ex: &#8220;Look at Apple&#8217;s new iWTF!  It&#8217;s only $400 bones!&#8221;)</li>
<li>Tweety stuff (e.g. &#8220;I&#8217;m tweeting now &#8211; look at me!&#8221;)</li>
<li>Politics, religion and rants (well, maybe some rants :-)</li>
<li>Emoticons (the emoticon on the line above will be the last one)</li>
</ul>


<p>Here&#8217;s what you <strong>will</strong> see here:</p>

<ul>
<li>Code - I enjoy programming and do it for a living.  You will see posts about
<a href="http://grails.org">Grails</a>, <a href="http://groovy.org">Groovy</a>,
<a href="http://vim.org">Vim</a> and even more geeky stuff, if that&#8217;s possible</li>
<li>News and articles about <a href="http://stlbyteworks.org">Byteworks</a>.  I am an
instructor for Byteworks&#8217; Earn-A-Computer class and enjoy volunteering there.</li>
<li>Work/productivity tips - However, I will try to avoid feel-good &#8220;Look at me,
I saved my company, rescued a drowning mule and made my boss warm in the
loins&#8221; posts</li>
<li>News about my band, <a href="http://rustynailstl.com">Rusty Nail</a></li>
<li>I quit typing things here</li>
</ul>


<p>Enjoy!</p>

<p>&#8211;Nate</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Almost There, G!]]></title>
    <link href="http://nateneff.com/blog/2010/12/13/almost_there/"/>
    <updated>2010-12-13T00:00:00-06:00</updated>
    <id>http://nateneff.com/blog/2010/12/13/almost_there</id>
    <content type="html"><![CDATA[<p><img src="http://nateneff.com/images/about-pic.jpg" alt="Alt text" /> &#8220;Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</p>

<h2>Make your tests more readable</h2>

<p>Code can be made easier to read by leaving things broken up.</p>

<div>
  <pre>
    <code class='groovy'>assert (&quot;a&quot; + &quot;foo&quot; + &quot;snarf&quot;).size() == 9</code>
  </pre>
</div>




<div>
  <pre>
    <code class='groovy'>assert (&quot;a&quot; + &quot;foo&quot; + &quot;snarf&quot;).size() == 1 + 3 + 5</code>
  </pre>
</div>


<h2>Another example</h2>

<div>
  <pre>
    <code class='groovy'>def fmt = &quot;MM/dd/yyyy&quot;
def d1 = Date.parse(fmt, &quot;11/12/2010&quot;)
def d2 = Date.parse(fmt, &quot;10/29/2009&quot;)
assert d1 - d2 == 365 + 2 + 12
assert d1 - d2 == 379</code>
  </pre>
</div>


<h2>Failed assertion</h2>

<div>
  <pre>
    <code class='text'>Assertion failed: 

assert (&quot;foo&quot; + &quot;Bar&quot; + &quot;Bazzoo&quot;).size() == 3 + 3 + 7
              |       |           |      |    |   |
              fooBar  |           12     |    6   13
                      fooBarBazzoo       false</code>
  </pre>
</div>



]]></content>
  </entry>
  
</feed>

