From Zero Coding Experience to Developing My Personal Website
I remember feeling like coding was way out of my reach when I first started building websites. I always stuck to website templates because I never imagined jumping into the development side of things. One thing that bothers me about templates is the limited customization if you don’t have experience with coding. As a designer, this bothered me a lot, and this was my main inspiration to learn how to code. When I started on the venture of creating my personal website, I decided I wanted to do it right. I wanted it to look exactly how I imagined it. I believe this is the best way to learn — find a project that you care about so you have a purpose behind the coding, this will help you get through the many roadblocks along the way. Learning how to code can be one of the most rewarding experiences. I’m not claiming to be a superhero developer, but I learned a lot with this project. Here’s what I learned along the way.
First off, I made sure I had a clear direction for my website. As much as I wanted to just jump into the development phase, I knew that it would rely completely on having a proper and consistent wireframe to go off of. I made sure that I knew every feature I wanted to include on my website. As a side note, I realize now more than ever how important this phase is. Coding is hard enough to learn as it is, don’t make it more difficult on yourself by trying to figure out how your site should look as you go. Once I felt like I had a clear scope of the project, I moved onto the coding phase.
This was the interesting part. When I first started I didn’t worry about all of the details like hover effects and making the website responsive. The best way to learn code is to focus on the basics. Being a beginner, I started by searching online for tutorials and classes. Along the way, I found these sites to be the most helpful:
W3 Schools is a great resource that answers a lot of questions along the way. I can almost guarantee that you’ll stumble on this site when googling for code issues.
Stack Overflow is also a great resource that’s similar to W3. Stack is a great place to ask questions and discuss code.
Skillshare is an amazing place to learn a variety of different things. There are plenty of great development courses on here if you would prefer to follow along in their high quality video based classes. Get a FREE month of Skillshare Premium with this link — Skillshare Premium.
Treehouse is a one-of-a-kind development school where you interact with their follow along coding program. They help you along by pointing out errors and suggestions in your code.
Searching youtube for things like “How to create a mobile navigation” can be super helpful for those more complex parts of your website (I’m sure I didn’t need to include this on the list).
I started by learning about how to insert text, images, links, and then, how to define width/height, margin, and padding. I continued on, learning about positioning and floats, connecting stylesheets, defining viewport settings, and eventually I created a very basic static version of my homepage. For me, it was about creating the structure first, and then implementing the more complex aspects to the website. This allowed me to learn as I went — going after the basics, and then diving into the more difficult aspects.
Another thing that I learned in the process of creating my first website, is to create a general template for the website before you move onto other pages. Make sure that you are sure of things like your header, navigation, and footer. These elements will carry onto other pages on your site, and changing the html after you’ve already created ten other pages can be a pain. I also created other UI elements such as buttons, and defined my typography. This gives me a general template so that every time I set up a new page, it makes it a lot easier and more straight forward.
The more I discovered about coding the more things I had to change on my website, and that’s all part of the process. I’ve probably restarted my website three times before I was happy with it, and I’m still making changes as I learn new stuff, but that’s the beauty of the process. It’s difficult along the way, trust me. There were times I would spend 3 hours trying to figure out an issue only to find out it was a missing bracket. The feeling of completing your own website is amazing though! From someone who thought they would never touch code, I encourage you to try it for yourself!
Take a look at my website, and if you are a dev, please send me judgemental emails about my code :) joshuathedesigner.com