website construction icons

Building The Website - 1

Lots of learning, thinking, and making it up as I go.
  2016-04-02
  5 min read
  #Coding #RomanCaoBoy

Quick Summary ~ Month and a half from launch. Lots of progress, lots more to be done. Big learning curve of research, thinking, reorganizing, planning, ideating, learning, and making things up as I go. Website looks good so far, but not as pretty as I'd like. Will make it prettier soon. Feeling optimistic.


What Is Done?

I’m a month and a half away from launch. Things are progressing well, but there’s still a lot of work to be done. I’m really proud of all the work I’ve put in so far and all the things I’ve learned.

Implementing Jekyll was a great acheivement; it’s easy to use and helps a lot with building the website. I’ve also been doing a lot of research into building websites, and there are so many different languages/tools that can be used. I’ve learned so much from just working on this project outside of class and I’m really glad I decided to build a website alongside the YouTube channel.

I’ve completed the About Gaudium and About Me pages, though I need to insert images. Outside of the website, I’ve set up the YouTube channel, Instagram, and email account. I’ve also (mostly) completed the emailing list forms, which involved a long process of eventually deciding to build my own forms. Otherwise, a significant amount of time has been spent on thinking of designs and ideas for the website and channel.

What Is Planned?

I plan to start working on implementing Bootstrap (AKA making the website look pretty). I will also continue to build out the website’s features, things like comments/likes or a contact form.

I haven’t thought about what videos I will put on YouTube since I really want to focus on this website. Once it’s completed, I want to go out and get some feedback from friends about how it looks and works. Videos are usually more time-intensive, which means summertime when I don’t have school.

" I have learned so much that I could never have learned in class "

What Have I Learned?

Jekyll

Jekyll Logo

Jekyll is a website generator that combines sections of a webpage and then spits out the full result. It’s a gem (a kind of extension or package) for Ruby, a popular programming language. Jekyll is built into GitHub Pages, which is the service I use to host my website.

Jekyll is great for web-development since it can mock up a website to act as if it were online. Basically, I can create my website, test it on my computer, see if it looks good, fix any problems, and then push the changes online. This was a great help in making sure the website works before I put it out into the real world.

GitKraken

GitKraken Logo

In this project, I decided to really deep dive into GitHub. I started by looking for a new Git GUI since my previous one - Git Extensions - was getting buggy, slow, and had little development/support. So, after lots of looking, I found GitKraken by Axosoft.

At the time I found it, it was still under development and wasn’t even at version 1.0. However, it was and is fantastic. The layout is very clean yet informative, the user experience is very friendly and helpful, and the program itself is quite versatile.

If you are looking for a Git GUI, I would personally recommend GitKraken. It avoids the tediousness and boring looks of the command line and also allows you to visually interact with the branches. As of this post, they are at 1.0.0 and are continuing to develop the program.

GitHub Issues/Labels

GitHub Issues are a great way to keep tracks of the problems and progress of the project, but what about the labels? I did a lot of research and looked at how other groups use labels. I found a very informative and useful models here and here.

I use issues such that each issue is a different idea for the website. The labels “tag” them and organize the dozens of issues so that I don’t have to remember which is which. Also, the issues/labels help me pick up where I left off whenever I have to code on different days.

Git Flow

Git Flow Diagram

Also, I decided to use Git Flow for my website. Git Flow is a branching philosophy for ensuring proper development, separation of branches, and quality organization. The idea is to separate the “volatile” development branches from the “stable” master branch.

With Git Flow, I can develop several things at once and be able to pull it all together for a cohesive release or update to master. Also, I really like the idea and wanted to use/understand it myself before using it on a team.

Now, you may be thinking “But David, you’re just one person using things meant for teams or people. Do you really need all this organization, all these different tools, all of this process?” To be honest, I don’t really need it. I could easily build the website using only issues and a simple branching scheme.

But, I want to use all these tools. I want all the organization. It makes things easier for me, helps me track my ideas over time, and is my way of ensuring I produce a quality website. Outside of this project, using these tools will help me when I work on larger projects with teams that use these tools.

Retrospective

Now, is this a big project? Yes. Is it a lot of hard work and thinking that could instead be put elsewhere? Heck yeah. Is it still worth the time and effort I’m putting into it? Absolutely. Why? Because I have learned so much that I could never have learned in class.

My classes all focus on building programs; there is no web development class. This has been my only significant exposure to web-dev and I am having a blast. Also, I really really really want to start my YouTube channel and can’t want for launch.