HarvardX CS50W: Web Programming with Python and JavaScript

Course's link

See here.

My certificate

See here.

Requirements

Alright, now it’s time to make your website your own. Design a personal webpage about yourself, one of your interests, or any other topic of your choice. The subject matter, look and feel, and design of the site are entirely up to you, subject to the following requirements:

• Your website must contain at least four different .html pages, and it should be possible to get from any page on your website to any other page by following one or more hyperlinks.
• Your website must include at least one list (ordered or unordered), at least one table, and at least one image.
• Your website must have at least one stylesheet file.
• Your stylesheet(s) must use at least five different CSS properties, and at least five different types of CSS selectors. You must use the #id selector at least once, and the .class selector at least once.
• Your stylesheet(s) must include at least one mobile-responsive @media query, such that something about the styling changes for smaller screens.
• You must use Bootstrap 4 on your website, taking advantage of at least one Bootstrap component, and using at least two Bootstrap columns for layout purposes using Bootstrap’s grid model.
• Your stylesheets must use at least one SCSS variable, at least one example of SCSS nesting, and at least one use of SCSS inheritance.
• In README.md, include a short writeup describing your project, what’s contained in each file, and (optionally) any other additional information the staff should know about your project.

Project 0

I have created this website about my home city Magadan. The website consists of five .html files, each shows a particular side of the city's life. Technologies that I used:

• Bootstrap framework - for general design as well as to create some components: navigation bar and cards
• CSS Grids and CSS Flexbox for blocks arrangement
• CSS media queries for mobile responsiveness
• SASS extension language (SCSS formatting)

There are two .scss files in the project. grids.scss contains only CSS grids formatting. styles.scss contains all other styles that I used in this website.

The project's video: https://www.youtube.com/watch?v=pzMlPb2DoVk