ICP3 - VINEETHREDDYSHERI/WebMobile-2021Fall GitHub Wiki

Welcome to In-class Programming Assignment-3

Objective: Developing the Responsive Web Design using bootstrap grid system and their classes. Getting to know the Javascript.

Implementation:

  1. Rock-Paper-Scissors

The below screenshot provides the user to select one of the three options( Rock, Paper, Scissor). Once the user selects the any one of the option, the computer will select one option randomly. Based upon the selected options, the output is showing on the screens and also the score will be updated.

Task1.html file task1-1 task1-2

Task1.css file task1-3

Task1.js file task1-4 task1-5 task1-6 task1-7

Computer won the game. So score of computer is incremented by 1.

task1-8

It is tie since Both user and computer selected same option.

task1-9

Computer won the game. So score of User is incremented by 1.

task1-10

  1. RWD Task

The bootstrap grid system helps to develop the Responsive Web Design.

Task2.html file task2-1 task2-2

Task2.css file task2-3 task2-4

Three project details shown in one row since the screen size is big.

task2-5

Two project details in a row because of smaller screen size when compared to above screenshot.

task2-6

Only one project details in a row because of smaller screen size when compared to above screenshot.

task2-7

VideoLink: ICP3 VideoLink

Conclusion:

In these ICP2, I learned about the various bootstrap classes and grid system breakpoints which is very helpful in developing the Responsive Web Design. And also made use of Javascript to write the logic of Rock-Paper-Scissors game.