Skip to content

csxark/WEB-DEV-Mini-Projects

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

54 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Web Development Projects

Welcome to my web development projects repository! Here, you'll find a collection of projects that showcase my skills in HTML, CSS, and JavaScript. Each project is designed to demonstrate my ability to create interactive and visually appealing web applications.

Index of Projects

Technologies Used

  • HTML
  • CSS
  • JavaScript

Getting Started

To get started with these projects, follow these steps:

  1. Clone the repository to your local machine.
  2. Open the project folder in your preferred code editor.
  3. Explore the HTML, CSS, and JavaScript files to understand the project structure.
  4. Customize and modify the code as needed.
  5. Test the project locally to ensure it works as expected.

Project 01: Tribute Page

Description

A tribute page dedicated to a famous person, featuring their biography, achievements, and notable quotes.

Features

  • Smooth scrolling navigation
  • Parallax effect for sections

Project 02: Survey Form

Description

A simple survey form with input fields for name, age, and an options section.

Features

  • Responsive design
  • Input validation

Project 03: Color Changer

Description

A simple web page that allows users to change the background color of the page by clicking on a button.

Features

  • Interactive button to change background color

Project 04: BMI Calculator

Description

A BMI (Body Mass Index) calculator that allows users to input their height and weight to calculate their BMI.

Features

  • Input fields for height and weight
  • BMI calculation
  • Result display

Project 05: Clock

Description

A digital clock that displays the current time in hours, minutes, and seconds in a 12-hour format with AM/PM design and Display the current date.

Features

  • Real-time clock display
  • 12-hour format with AM/PM
  • Display the current date

Project 06: Guess a Number Game

Description

A simple interactive game where the player has to guess a randomly generated number within a certain range.

How to Play

  1. The game will generate a random number between 1 and 100.
  2. You will have a limited number of attempts to guess the number.
  3. After each guess, you will receive feedback indicating whether your guess was too high, too low, or correct.

Features

  • Random number generation
  • User input for guesses
  • Feedback on guesses
  • Limited attempts

Live Demo

Tap to Play: Guess a Number Game

Project 07: Calculator

Description

A simple calculator application that allows users to perform basic arithmetic operations.

How to Use

  1. Enter the first number.
  2. Choose an operation (+, -, *, /).
  3. Enter the second number.
  4. Click the "Calculate" button.
  5. The result will be displayed.

Features

  • Addition
  • Subtraction
  • Multiplication
  • Division
  • Clear button to reset the calculator

Live Demo

Tap to Play: Calculator

Project 08 : Guess the Color Game

Description

A simple interactive game where the player has to guess a color within a certain range.

How to Play

  1. The game will generate a random color from a predefined set.
  2. You will have a limited number of attempts to guess the color.
  3. After each guess, you will receive feedback indicating whether your guess was correct or wrong.

Features

  • Random Color generation
  • User input for Color chosen
  • Feedback on each Color choosen
  • Limited attempts

Live Demo

Tap to Play: Guess a Color Game

Project 09: BG-Color Changer

Description

A simple web page that allows users to change the background color of the page by clicking on a button.

How to Use

  1. Click the "Start" button.
  2. The background color of the page will change to a random color every 1 second.
  3. Click the "Stop" button to stop the color change.

Features

  • Interactive button to change background color
  • Start and Stop buttons for color change control

Usage

Feel free to use these projects as a reference or as a starting point for your own web development projects.

Contributing

Feel free to fork the repository and submit pull requests for any improvements or features.

Contact

If you have any questions or suggestions, feel free to contact me at [arktandoncs@gmail.com]. I'm always open to feedback and collaboration.

License

This project is licensed under the MIT License.

About

Here are few Web dev Mini Projects and ideas to do while learning HTML CSS and JavaScript only.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published