My Best Assignment: “Pure Knockoutjs”


The following are the topics I will discuss:

  1.   What is Knockoutjs?
  2.   What was my project? And how was it born?
  3.   Why did I choose knockoutjs for my project?
  4.    Screenshots of the project
  5.   How you, not me…how you will extend this project.
  6.   Creating a 100% static blog with Knockoutjs.
  7.   The future of Knockoutjs.
  8.   Let’s learn Knockoutjs.
  9.   Help me with Knockoutjs View-Models [seriously please…]

What is Knockoutjs?
Knockoutjs is a JavaScript library. It’s a framework created meant for use just like a pure JavaScript code, but has a different implementation, a better implementation, which is MVVM. For example, what would you do if you wanted to produce the HTML code dynamically, like when you want to create a customizable user interface? Using Knockoutjs, this a task of simply implementing a binding element; like for foreach. Checkout a simple implementation Here.
What was my project? And how was it born?
Our lecturer gave us an assignment. The requirements of the project were to create a primary school application with any programming language; be C++, C, Java, C#, VB, Delphi, or any other existing language, including Lisp if you wish. So, here is how I ended up using Knockoutjs: I am doing a personal project with SignalR, Knockoutjs, ASP.NET MVC, and some other technologies. And since Knockoutjs remains to be a subject to learn to me, I thought I would exploit my chances and risk doing the project in JavaScript, Knockoutjs to be precise…. The application had to do the following:

  1.  Capture student registration details
  2. Capture fee payment records
  3. Teachers on duty
  4. Subject offered in high school
  5. Class teachers
  6. Rank students in examinations
  7. Produce order of merit list per class
  8. Display the most improved student in each class and the whole school
  9. Print report cards in PDF
  10.  Generate trial balance for the school
  11.  Generate income statement

NB: This was not a final year, or end of course project. In fact, we only had two weeks to do a prototype that could demonstrate all that, because he wanted to explain a point in class using those projects [Software Development].

Why did I choose knockoutjs for my project?
⦁    Knockoutjs was part of a personal project that am currently doing
⦁    Knockoutjs has nice templates [Templating with KO observables]
⦁    I wanted to do a simple static site that could do complex tasks without the need of server side code
⦁    Is very easy to reuse already existing examples online, as it is simple to learn

Screenshots of the project




How you, not me…how you will extend this project.
I will give the code of the whole project at the bottom, and youwill also find a link to a running demo. If you are curious to see all those functionalities running and working, you will be disappointed to find that I didn’t implement some. This is all due to time constrains. We are starting our exams very soon, and for someone like me who is always concentrating on one thing at a time, I have to stop everything, including my project so I can at least start learning for the exams, yeah, I said reading to pass exams! This is what we do in Kenya, or better said, this is what they encourage in Kenya, “PASSING EXAMS-IF YOU PASS, YOU ARE BRIGHT :: THEORY EXAMS, NO PRACTICALS”
So, that being constant, I left some things un-accomplished, like PDF functionalities, and not because they are so hard to do, it all boils from time, and priorities. Wee, if you are willing to pay me so I can finish that specifically for you, well then, you are very welcome (money and college have always been dependent on each other!!). So, if you want to return HTML pages as PDF files from the browser, completely with client side JavaScript, there is a library called jsPDF. And because I am not willing to work an example for you, I will show you screenshots how jsPDF works. I have downloaded the samples from their github repository, and its working 100%, so there is no need of re-implementing it again.

image4image5image6  image7

Creating a 100% static blog with Knockoutjs.
From my little experience with knockoutjs, am vividly convinced a question that was asked at stackoverflow can be answered. The owner of the question wanted a blog engine created with pure JavaScript (and isn’t Knockoutjs JavaScript? Of course it is…)
I don’t know why something tells me that it would be easier to edit a Knockoutjs template for github pages than using Jekyll. All you have to do, is wrap a HTML list-element with a foreach loop and everything in the Knockoutjs template gets posted on the HTML page, with the order you want. You can also implement something like a search, and many more features like sorting.
I know this is, or might sound stupid if you are an established programmer, but I know people like me, people like us, we value and respect simplicity.



About Kabue Charles

I am an instigator of artistic, intelligent and mind boggling softwares. I love C#, envy C++, and one day I might try CUDA. I prefer solving complex and mission impossible problems in a new or old but innovative way. Am intrigued by machine learning challenges, security critical challenges, and privacy challenges like a real serverless peer-to-peer communication. I am usually literally stressed when a day goes by without learning or doing something new. I avoid repetition whenever possible. Away from computers, I enjoy capturing moments of life and nature with 1080 (…and above) pixel pictures and videos. I like details, accuracy, idealistic but realistic personalities. I love futurist’s but I hate fantasy. A decent, moderate and gentle character is my favorite. I avoid shame like a plague, confront my fears with facts, and I am very constant with opinions and beliefs. I love suits (…but don’t wear them), arsenal football club (…I only know the manager), and I have no favorite food. Reading and writing poems helps me retain my sobriety. I consider myself funny, privileged, a renaissance man and sometimes shy. I believe in things unseen and incomprehensible.

Posted on July 19, 2014, in Learning and tagged . Bookmark the permalink. Leave a comment.

Say Something....

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: