Ever wanted to create your own website but don't know where to begin? Start your web development journey here with Dr Simon Rose. In this free practical class, you'll build and publish your own portfolio website from scratch in under 2 hours using HTML, CSS and JavaScript. The class is taught by a university lecturer and is adapted from an Intro to Web Development university module.
It is designed for absolute beginners and covers the fundamentals of web development, including an explanation of each technology and how they fit together, it then walksthrough step-by-step how to create and publish the website.
Please post a link to your finished projects below and feel free to ask questions in the discussion section. Enjoy!
What you will learn in this class:
- Visual Studio Code
- NodeJS and npm
- How to serve websites locally using http-server
- HTML document structure, elements and attributes
- Emmet
- Using the Google Chrome inspector for web development
- CSS selectors, classes, IDs, properties and values
- Box model
- CSS positioning
- CSS colours
- CSS rules of precedence
- JavaScript introduction (functions and variables)
- Domain Object Model (DOM)
- Favicons
- Icons using Font Awesome
- CSS animations
- Deploying websites using GitHub pages
The class project is a portfolio website, built using HTML, CSS and JavaScript and published to GitHub pages.
The website contains a header, footer, profile picture, some profile text and some social media and CV links.
The attached file contains the code for each practical lesson (creating our project, adding HTML, adding CSS, adding JavaScript and finishing touches) along with some sample characters that can be used as the portfolio subject.
