Module Information

EP1000 Digital Fabrication & Prototyping Fundamentals

Web Development

Application Used:

  • W3 Schools
  • Brackets
  • GitHub
  • Introduction to HTML:

    HTML is short for Hypertext Markup Language. It is the language used to display data on a web browser such Mozilla Firefox, Google Chrome and Internet Explorer. To execute this, you need an assisting application of a sort to help you to navigate through the HTML. Brackets is a useful application for this.

    Introduction to CSS:

    CSS is short for Cascading Style Sheets. It is a style sheet language and it is used to design and change the word your data is presented on the web page. Like HTML, it can be programmed through the application brackets. CSS is especially useful if you want to make the webpage look better, such as changing background, colors, fonts, and etc.

    Adding Data To Your Webpage:

    To add data to your webpage, you would need Brackets to aid you in adding them in and to help you manoeuvre around. It is important to know the basics of coding your own website. There are a lot of codes out there such as (h1) (p) (li) and so much more! Each codes represent the different functions, like types of sentence, the way you want the sentence to look, bullet points, adding links, images and many more! For more information on coding a website, Click the link above (W3 Schools).

    W3 Schools:

    W3 Schools is a great website for beginners such as myself! They provide its users with examples that are made easier to understand and to improve your reading and basic understanding on website coding. On their website, you can also find they they have tutorials and "Try It Yourself" options to help you gain a better understanding on what and which code is most suitable for the function that you are looking for on your website. If you ever need to look for a particular code, this website should be able to provide you with it.

    Brackets:

    As stated before, Brackets is an application used to help you write the data you desire on your webpage. It is important that you remember to create a HTML/CSS or any webpage file when coding the data, as if you code on a TXT file, it would not work the way you want. There are videos and instructions to help you with this on W3 Schools.

    GitHub:

    At GitHub is where you can bring your webpage online! All you need to do is sign up for a free acount. After setting up your account, you should create a repository. Once that is done, just upload your HTML/CSS and other webpage files into the repository. After uploading the files, you need to head over to your settings to publish your brand new website.

    After clicking on the settings, scroll all the way down to "GitHub Pages". There you will see the heading named "Source" and the option is set at none. Click on it and select your desired branch. (It is usually the "master" branch unless you choose to create a different one.) After selecting your branch, click "Save". It should state that you website is now published as shown above. Heads up, you might need to wait a few minutes as GitHub processes the files you uploaded to make it online.