Learned how to code and built this website for $10!

Image

It’s finally complete! The site is not overly complicated, it’s a Reddit-style site called Linkditt.com (I know what your thinking, I will replace that logo!). Essentially, users can view links posted by other users as well as vote them up and down, which in turn add or subtract points from the user’s overall score (like Karma). There is a “comment and share” page where users can use the Disqus commenting platform and share the post on their favourite social media platform.

There are several implementations that you will notice as you navigate the site:

  • Infinite scrolling for posts, like you would see on Twitter
  • Automatic sign in following signup (no need to remember your username!)
  • Responsive design for mobile
  • Password retrieval email system
  • View all your past posts and edit them

There are tons of other little nuances that took me a while to wrap my head around. For instance, when you vote on a post the system knows how you voted previously (if you voted) and adds or subtracts a point depending on how your latest vote. You can’t accumulate votes for the same post this way. The problem here is that when you place your vote you should only see the posting’s total vote count go up or down by one. Originally, I had this going back to the database and pulling whatever the score was on that post but if you had many people voting at the same time, as they do on Reddit,  then that number could jump by however many users voted since you refreshed your page. You might click up and the number could jump by five or ten votes! Thus, I had to implement a system that just added one to the number already on your page while ensuring that you stay within the +1 to -1 voting range. This is one of those things I took for granted from other sites before making this one!

I made a big point about keeping this development cheap. So far the only money I have spent has been the $10 for the URL from GoDaddy.  That’s it! The server is free from Heroku. I use a free Pingdom account to keep the free server awake and responsive. All packages implemented into the code are absolutely free. I’ve had to learn some jQuery and Javascript to improve on user experience and I intend to add to this in the future. Other languages necessary to get this up and running are Python, the Django framework, CSS, HTML5 and the Twitter Bootstrap front end framework.

For me, this proves that you can learn to code (a very useful skill nowadays) for very little money. If you have access to a computer and the internet all it takes is being very curious and very determined.

Advertisements

Writer vs Writer

The only thing better than one opinion…is two opinions. Now, a user can choose to write an opinion article against an article already written. For example, the article below expresses an opinion, and just like before, that article and its author collect points based on the up (or down) votes given by other users. But now another user can choose to write an article with an opposing viewpoint should one not have already been written (see below).

Image

This is essentially a digital version of a head-to-head newspaper editorial accept that anyone can post them! You may have also noticed the new Twitter Bootstrap template with a new side bar menu. Most don’t work but it’s a sign of things to come!

Day: 18  Budget: $?  Spend: $0

Workspaces and updates

Workspaces have become a growing trend in the technology and startup space. A few years ago after I started my now defunct online dry cleaning startup I didn’t even know that these even existed. Now they seem to be sprouting up everywhere along with incubators and accelerators. A workspace is slightly different as the latter two options may require an application process and a very specific startup concept and plan to be accepted in as well as likely being funded by the government or by private investors (ie. Mars).

With construction at my condo working at home was just no longer an option, so I decided to rent a desk in the lounge space at a workspace called Project: RHINO (my project name is an ode to this space). The lounge space means I don’t leave any of my belongings after I leave for home. Almost daily you get the opportunity to meet someone new working on a unique startup or project. The founders themselves are working on their own startup, Clayza, and in fact, started Rhino completely by accident as they had only rented the space to start a previous startup a couple of years ago. Now, the Rhino boasts over 70 members and growing daily.

What is truly remarkable about the place is that, exactly as they state on their site, Project: RHINO is a community. Members are always interested in discussing everyone’s projects and more importantly, everyone helps everyone else out with their problems. Many of the people I have thanked on my blog are Rhino members who have generously donated their time and knowledge to my questions. Also, breaks and socializing are often taken over heated games of foosball or hanging out on the lounge area couches. So, if you work from home and you find that you need a great place to work, give a workspace a whirl, I guarantee you won’t regret it!

Updates on Project Blackfish:

1. Authors now receive points for comments made on their articles.

2. Articles now have tagging available.

3. All articles now have a topic to be filled out by the author.

The reason I’m not going into too many details over this blog is because I’m hoping to make a fundamental change and differentiator to the site over the next couple of days. I just have to figure out the right way to design and code it. So stay tuned!

Day: 13  Budget: $?  Spend: $0

Score your influence!

Project Blackfish has some amazing new updates! Remember last week when I mentioned that users could now unlike articles as well? Well, there was a problem with that system: users could like and unlike articles as many times as they wanted. That has now been solved after some very steep learning in Django, particularly learning one-to-one and many-to-one relationships.

So here’s the lowdown: In the screenshot below you can see that if a user viewing an article has not liked an article it will say “You scored it: Rate this article!”

Image

 

If the user clicks “like” the Total Point Score for the article increases by one as does the amount you scored it by. The trick here is that a user cannot like an article more than one time. They can become neutral again (Score = 0), or they can score it as -1. The user can change their score as many times as they want between -1 and 1.

 Image

Now here’s where things get really interesting! All articles are now tied back to the user that wrote it. When another user rates their article they receive Influence Points(iPoints). At the moment the user “test 4” has 0 iPoints, after their article was given a like they then receive one iPoint. If the user rating the article goes back and changes their mind “test 4” will have -1 iPoints. These points are accumulated from all of their articles so the more articles they write and the more users that like their articles the more iPoints they receive thus scoring their overall influence within the community.

ImageImageImage

Special thanks to Vikram, Vanessa, and Ildar for helping me with my logic and answering my never ending stream of questions!

Day: 8  Budget: $?  Spend: $0

Why open source is amazing

Everywhere, tons of coders are building software packages and making it freely available without making a dime off of it. I recently experienced a perfect example of just how useful and efficient this can be.

My goal was to have users fill in their city and country in their profile page, which I added recently:

Image

What I realized is that I don’t want to leave it up to users to spell their city and country correctly, so I went on the hunt for a Django app that contained our world’s geographical information. I came upon two separate applications that I could plug in to my site’s code: Django Cities and Django Cities Light. The former is a much larger and more complex program than I needed at the moment so I went with the lighter version. The only problem was that when I tried to upload the data I kept receiving a duplicate error for some city in Latvia: Daugavpils.

I scratched my head and went to work googling the error but nothing came up. Finally, after searching long and hard I gave up and opened my first issue report on Github. The main contributor, jpic, responded shortly afterward along with several other coders who had the same problem. Over the next few days back and forth discussion solved the problem and another bug that popped up immediately afterwards. I was so impressed with this amazing collaborative effort and in particular, that of jpic, who went to town solving these problems in which he received no monetary compensation for. Coming from a finance and economics background I really found this refreshing.

Without the contributions to the community of open source developers working tirelessly on software such as Python, Django, and Cities Light, we definitely would not have the kind of web based technology we have today.

Special thanks to jpic for fixing my issue so quickly.

Day: 7  Budget: $?  Spend: $0

Bootstrapping the front end

In my first blog in this series I mentioned that I was looking for suggestions to implement. A friend on LinkedIn reached out to me with a suggestion to upgrade my CSS framework with Bootstrap.

Even though I mentioned that I wasn’t going to change the appearance until later I decided that now would be a good a time as any to do something about it. So, I downloaded a bootstrap template and went to work connecting it. My front end skills are even more in their infancy than my Python scripting but I managed to hack something together that worked. Here it is, in all it’s glory:

Image

 

I still have some work to do on the other template views but as you can see there is a vast improvement.

Let me know what you think: is this an improvement or not?

Special thanks to Ildar for the suggestion!

Day: 3   Budget: $?    Spend: $0

To like or not to like

Project Blackfish has a new added function! You may want to sit down for this: anyone, and by anyone I mean anyone logged into my computer, can not only like a post but unlike it as well! Ground breaking stuff, I know. Here is an example of two posts (please excuse the bad language, spelling, and grammer, someone got way too excited about foosball):

Image

Total scores of the article can now be negative. There are a few problems still: anyone, even if they are not signed in, can vote as many times as they please, and I have no idea how many votes are up or down. So there is still a lot to do on that front.

Also, users can now insert there first and last name upon registration:

Image

Other bugs include the header sign in not working properly, which has something to do with CSRF validation and I believe something to do with it being on the base HTML file. Can’t have unsuspecting users being hacked so that is a must fix.

Lastly, I had a problem with passwords of new users not being recorded and this stackoverflow link solved everything. Memo to self: learn more about the ‘super’ function.

Budget: $?    Spend: $0