Web Development Projects

This repository contains various web development projects implemented using HTML, CSS, JavaScript, and ReactJS. Each project demonstrates different concepts and functionalities, ranging from basic DOM manipulation to advanced React features.

Project List

1. Async JS Example

• Demonstrates the use of JavaScript Promises for asynchronous operations.
• Allows users to check their eligibility for voting based on their age.
• Files: app.js, index.html, style.css

2. Bill Split App

• A simple app to calculate the amount each person needs to pay when splitting a bill.
• Files: app.js, index.html, style.css

3. BMI App

• Calculates the Body Mass Index (BMI) based on user input for height and weight.
• Provides feedback on BMI categories (e.g., underweight, normal, overweight).
• Files: app.js, index.html, style.css

4. Calculator App

• A basic calculator that supports addition, subtraction, multiplication, and division.
• Includes keyboard support for input.
• Files: app.js, index.html, style.css

5. Currency Converter App

• Converts currency values between Rupee, Dollar, and Euro.
• Includes a reset functionality to clear inputs and results.
• Files: app.js, index.html, style.css

6. Login or Registration App

• A login and registration system with basic validation.
• Includes a welcome page for successful login or registration.
• Files: Index.html, SignUp.html, Welcome.html, app.js, stylesForLogin.css, stylesForSignUP.css

7. Search Feature in React

• A React app that allows users to search for Indian states from a predefined list.
• Implements filtering functionality using React state.
• Files: App.js, index.js, states.json, App.css, index.css

8. React Exercises

• Contains multiple React-based projects demonstrating various concepts:
  • Reusable Components: Demonstrates reusable components with React Router.
  • Query Params Demo: Shows how to pass data between pages using query parameters.
  • Form Validation: Validates form inputs such as name and password.
  • Event Handlers: Demonstrates handling events like onClick and onChange.
  • Class-Based Components: Implements React components using class syntax.
• Files: Various App.js, Home.js, Dashboard.js, About.js, etc.

9. CSS Bootcamp

• A collection of CSS-based projects showcasing layout designs and styling techniques.
• Includes cards, profiles, and tourism-related designs.
• Files: Index.html, style.css, and related assets.

10. DOM Methods

• Demonstrates DOM manipulation using JavaScript.
• Counts the number of paragraphs in different sections of the page.
• Files: app.js, index.html

11. JavaScript Bootcamp

• A series of JavaScript assignments covering:
  • Array and object operations.
  • Basic algorithms like Fibonacci series, palindrome check, and prime number generation.
  • ES5 and ES6 features.
• Files: Various .js files in JS_Bootcamp_1 and JS_Bootcamp_2.

---

How to Run

1. Clone the repository:

   git clone https://github.com/your-username/web-development-projects.git

2. Navigate to the desired project folder.
3. Open the index.html file in a browser to view the project.

Technologies Used

HTML: For structuring the web pages.

CSS: For styling and layout design.

JavaScript: For adding interactivity and functionality.

ReactJS: For building dynamic and reusable components.

License

No copyright. Developed by Phani as part of the web development course.