Introdution
Lesson Plan
The goal of this course is to familiarize yourself with the technologies of how to build basic websites and learn basic programming skills, which then can be applied onto various settings and programming languages. It will be a hands-off approach meaning you will be recommended various tutorials and will have to do a lot of self-exploration.
This course assumes you know how to install programs and create new files on your system (Windows, Mac, or Linux).
First part
- how to setup git
- how to program a website using VanillaJS
- how to tackle user input
- how to do pagination
Second part
- introduction to frameworks
- how to modify a website to your liking
- how to scrape data of a website
Third part
- setup your own backend
- upload your own website with a backend
- user login
Part one
We will start off with the basics. You should familarize yourself with the Markdown language. Markdown is the default language used for writing documentation and README files, additionally the lessons will use this file type. You can use an online markdown viewer, which will have a stylized version of the text.
Tutorials
- HTML Crash Course (1)
- HTML Deep Dive (2)
It is important to follow along on how to setup the environment using VSCode from (1). This will ease development in the future. Although only the first hour of the programmer is free, it suffices enough for our purpose.
From the second (2) tutorial, you will be exposed to more HTML tags and learn various ways of styling elements.
Both tutorials are recommended, when we start building your first static website.
Recommendations
- It is recommended to go through both videos and try out each example yourself
- It is further recommended to get familiar with the developers tools which can be accessed with the F12 key.
- In the developers tools panel play around with the styles tab to learn many different CSS options
Homework
- Find a website and take a screenshot of it
- Modify the website with your HTML and CSS skills and take another screenshot