Blog
When I started the planning for this website, I considered web development as akin to wizardry versus a technical skill that was within my grasp. I thought about using a service like Wordpress to make the process easier, as I had previously used it for a different project. The trade off for this type of plug-and-play approach meant that I wouldn't have as much control of the design and code of my site. I also wouldn't be learning much about programming. A conversation with my designer buddy Blayne solidified my choice: I would code my site by hand, teaching myself HTML and CSS along the way. I had to build my website in hard mode or not at all.
Answer "Why?"
Before I started putting in the real work, I needed a reason to get started. Why should I bother learning how to code? Why bother putting together a website? Well, simple: these things were on my bucket list! Seriously, they’re number 186 and 200 respectively. I’ve always wanted to learn how to code, and I’ve always wanted to build a website. Like a legit one, not some GeoCities bullshit or something scraped together from other people’s hard work. But outside of my silly aspirations that I wrote in a Moleskine, this skill and the result of the skill have tremendous pragmatic value. If I really wanted, I could pursue web development as a career. The U.S. Bureau of Labor Statistics projects 27% growth in available jobs in this industry over the next several years, a faster than average rate. Building websites could also be a nice side hustle; tag team with a designer and you might even have the beginning of a great online business!
So although I had a professional reason to want to learn how to code, right now writing is my main focus. As I’ve been building my audience, I realized that I needed to create a website to serve as a digital marketing effort, portfolio, blog, and store for my work. This would serve as my grass root efforts to promote my creative ability and begin building a reputation of at least being mildly talented. I consider it grass roots for two reasons (despite this being a social media platform with instant global reach): I handle everything myself and I interact directly with my community rather than through some sort of middleman.
Select Tools
After I determined my motivation, I then gathered my tools, both physical and digital, and set to work. One of the first steps I took was deciding on a hosting company. Many exist out there, some free and some paid. Typically, there’s a monthly fee involved for the hosting of your website’s code, plus a one-time fee for the domain you select. Lucky for me, this domain was very cheap, and I went with HostGator as my hosting provider. Do a little research and see what’s best for you, but if you want simple, cheap, and efficient service, I would recommend HostGator (and no, they’re not paying me to say this).
I signed up for hosting, locked down my domain, so next I needed to decide on where I would be storing the master files of my website. HostGator or whichever hosting service you decide on will have it's own copies that will serve as the live version of your site. What I was really looking for was a revision control system, and one of the best ones to use is GitHub. This kind of system allows you to keep your code organized, as well as track changes just in case you break something and need to go back to a working version. I highly recommend signing up and creating a repository for your code like I did. I left mine public and will continue to do so because there's nothing particularly special about my approach, so I don’t mind if anyone repurposes what I wrote. I want people to be able to see how my code and use it to teach themselves the way I did.
Signing up and opening a repo is simple enough, but learning how to update your code using a shell is often the scary part for people. But, this is a big reason for using GitHub. I'm far from an expert, yet I was still able to learn the commands I needed to quickly and easily update my repo. This is key because I use multiple systems to work on the website, so having a way to store and download my code from the cloud is important to maintain productivity and organization. CodeAcademy has a solid tutorial that can introduce you to how to use Git, although you’ll probably only use pull, add, commit, and push. These come with their own set of modifiers that you’ll need to know, but you’ll figure those out along the way.
Lastly, you’re going to need a text editor to write your code and a few browsers in order to see how they render your code into a website. The big four are Chrome, Firefox, IE, and Safari, with Opera as a close fifth in importance (i.e. usage among Internet browsers). As far as text editors go, your computer already comes with one regardless if you use Windows, iOS, or a Linux distro (shout out to Xubuntu users!). More advanced programs like Sublime and Atom make coding easier, as they provide productivity advantages like color-coding for organization, autocompletion, and add-ons created by each community. I prefer Atom since it’s open source and because of the add-ons available.
Decide on a design
Ok so I got lucky here. I mentioned earlier that I have a friend who's a designer. You might not be so lucky, but fear not! There are plenty of excellent freelancers available online who would be willing to help here. And most will often do it for cheap too (think $20-30). Websites like Fiverr and Dribbble offer plenty of talented individuals that you can potentially hire to get a design. Just be sure to find a few websites that have designs you like and share these as reference points for your designer to work with.
Get HTML/CSS Basics Down
Coding is easier than you think! There are so many resources out there that you can use to get yourself comfortable with HTML and CSS. CodeAcademy has a great tutorial that can introduce you to these languages. I also recommend this book if you'd like to have a reference manual. But you know what the most useful website has been for me? Google. The tough part is learning how to search properly using keywords, tags, and phrases for the issue you're having. More often than not, someone has had your issue before and so you should be able to find a solution. Don't get discouraged! Also, not every website contains good answers. Look for places like StackExchange or blogs from verified professionals in the field, these are usually good for finding solutions.
Building a website manually does have a major hurdle to clear: writing the CSS, or Cascading Style Sheets. This is the language that gives your website its design, otherwise you would just see black text on a weirdly-formatted white background (given the design of this website, the irony of this statment is not lost on me). This will likely be where you spend most of your time, creativity, and patience as you code. Take a look at mine, that’s hundreds and hundreds of lines, although everything is unique. Part of making your website functional is learning how to make it responsive, which means making it look good on any kind of device screen or in any browser (well, most of them). I can't stress the importance of having a responsive website enough, as traditional desktops no longer dominate as the type of device used by people for their web browsing.
Finally Start
Like nearly any other skill that's worth picking up, the only way to learn how to code is to start. You can’t build that body you want without getting your nutrition game right and hitting the gym! You can't have a career you want without getting the training and experience you need! And you can't pick up a complex skill like coding until your fingers hit the keyboard! You have to decide. And no nonsense about waiting until the new year or until after things settle down at work or after your birthday. These are just arbitrary dates to excuse yourself from the responsibility that lies squarely on your shoulders. Reading every book, blog post, or article in the world won’t help you until you start working. Learn by doing, by trying!
