Skip to the content.

Homework #1

Reading → Coding → Deploy → Code-review

Reading

  1. How to write a good git commit message (https://chris.beams.io/posts/git-commit/)
  2. About GitHub flow (https://guides.github.com/introduction/flow/)
  3. if you don’t know about git read this article (https://www.elegantthemes.com/blog/resources/git-and-github-a-beginners-guide-for-complete-newbies)

Coding

During this course we will be building a brand new Instagram. The first part of the task is to create a frontend of image gallery view.

Basic part

  1. Create a static website for image gallery with HTML + CSS
  2. You are not allowed to use any JS or CSS frameworks
  3. Website consists of header with title and body with image gallery
  4. Gallery should be responsive and look the same on the different screens
  5. Gallery consists of 3 columns
  6. Columns should be aligned to center in container with 900px width

alt text

Optimal part

  1. Gallery should process last images to fit the row as shown on the following images

alt text alt text

Challenging part

  1. After click, there should appear modal window with enlarged image (you are allowed to find js/css framework to support this)
  2. Publish your website on the GitHub Pages and provide link in the README.md file

Deploy

  1. Register on GitHub: http://github.com/
  2. Create personal repository in the Org https://github.com/itmo-wad
  3. Clone it, add your homework #1 sources, commit, push
  4. Make sure that your repository is available on the GitHub
  5. optional Create GitHub page with your sources

Code-review

  1. Communicate in Telegram chat
  2. Help others to complete the assignment