Build a Twitch Website
Do you stream on Twitch? Do you want a website? In this article, you will learn how to make a fast and efficient website that fits your budget. Using these tutorials, it is completely free to build the site. I also show you how to purchase a domain and web hosting for under $10!
How Will My Website Look?
Short answer? However you want! Using Coding Commanders tutorials as a guide, you can customize the site however you want.
Keep in mind, the more customization, the more time you will invest. If you use the template as is, only changing the page text, images and colors,
you can have your site done within an hour or two. If you want to completely change the template, it might take a week.
Click Here to See the Template LIVE!
Video: Make Your Website Today!
Project File Structure
The file structure is how you organize the files in your website. Here is our project's file structure:
Mouse Hover over the ➼ blue text in the description to highlight. Website
media
index.html
about.html
main.js
style.css
➼ media - This is the folder that contains your media files, such as images and videos.
➼ index.html - This is the main page users will be directed to when entering your web address. HTML is the markup language that displays your content in the web browser.
➼ about.html - A page to tell people more about the Twitch streamer.
➼ main.js - JavaScript is the programming language we use to create functionality.
➼ style.css - CSS formats HTML: color, size, shape, font ect.
Here is a brief video explaining the functions of HTML, CSS, and JavaScript. PHP and MySQL are not used in this project.
Project Code
Create a project folder named the same as your web domain or the domain you plan to purchase. If you do not know how to purchase a domain, don't worry. I will go over that.
Inside your project folder create the files listed above. Copy and paste the code from the copy boxes below into the corresponding file. Use a text editor.
Examples of text edditors include notepad (Windows), notepad++ (Windows), Vim (Linux/Unix), Atom (Linux, Windows, Mac)
index.html
*************************
about.html
*************************
style.css
*************************
main.js
*************************
Purchasing a Web Domain
You can purchase your web address from multiple sources. To simplify the process, I suggest using the same company you use to host your websites. I recommend DreamHost. I use DreamHost to host all of my websites and that is the host service I include in my tutorials. The link above covers purchasing a domain along with your hosting.
Why Use DreamHost?
- Affordable With this link you can get your website hosted for just $2.59 a month with a contract or $4.99 for a single month! That means you can pay just $4.99 today and have your site up and running!
- Reliable Out of all the affordable shared hosting services I have used, DreamHost has been the most reliable. When a user goes to your website, you want your website to work and you want your pages to load quickly. They automically create backups of your website and guarentee 100% uptime. Their SSDs provide lightning fast load speed.
- Support DreamHost has the best customer support I have ever experienced! If you have any technical difficulties, even if they are your fault, their friendly team will guide you through all the necessary steps, making sure your site is up and running!
- Security DreamHost offers industry leading security options and even gives you a free Let's Encrypt SSL certificate.
- Refer a Friend DreamHost customers are all eligible for the refer-a-friend program. You get access to referral links (like the ones used in this lesson) that give your friends discounts! You also make a commission every time hosting is purchased through the link.
In the next lesson, I will show you how to purchase your web hosting. This lesson also includes purchasing your domain.