Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
51 changes: 25 additions & 26 deletions Compound Interest Calculator/README.md
Original file line number Diff line number Diff line change
@@ -1,36 +1,35 @@
<h1 id="conpound-interest-calculator">Compound Interest Calculato</h1>
💰 Compound Interest Calculator

<p>A mini project that aims to calculate the Compound Interest by just adding the values to the webpage. This Project does complex calculations within few seconds, making user's work easier.</p>
<br>
A fast, lightweight web application designed to instantly calculate compound interest. Simply input your principal amount, interest rate, duration, and compounding frequency, and let the app handle the complex math for you in seconds.

<h2 id="tech-stack-used">Tech Stack Used</h2>
<br>
✨ Features
Instant Calculation: Get immediate results without manual math or knowing complex formulas.

<p><img src="https://img.shields.io/badge/html5%20-%23E34F26.svg?&style=for-the-badge&logo=html5&logoColor=white" alt="HTML">
<img src="https://img.shields.io/badge/css3%20-%231572B6.svg?&style=for-the-badge&logo=css3&logoColor=white" alt="CSS">
<img src="https://img.shields.io/badge/javascript%20-%23323330.svg?&style=for-the-badge&logo=javascript&logoColor=%23F7DF1E" alt="JS"></p>
Customizable Parameters: Adjust Principal Amount, Interest Rate (%), Duration (Years), and Compounding Frequency (times per year).

<h2 id="how-to-use">How to use:</h2>
<br>
Responsive Design: Clean, accessible user interface that works seamlessly on desktop and mobile.

<ul>
<li>Download or clone the repository</li>
<pre><code>
git clone https://github.com/Ayushparikh-code/Web-dev-mini-projects.git
</code></pre>

<li>Go to the directory compound-interest-calculator</li>
<li>Run the index.html file in your browser</li>
<li>Get your calculations done within seconds<br></li>
</ul>
No Dependencies: Built with pure HTML, CSS, and Vanilla JavaScript.

<h2 id="use-of-the-project">Use of the Project</h2>
🚀 How to Use
Follow these steps to run the project locally on your machine:

<p>
This mini project helps you to calculate Compound Interest by just giving the values of Principal Amount, Interest Percentage (%), Duration & Number of times Interest is given in a particular year.
Without even knowing the formula and doing math, you can now calculate Compound Interest
</p>
<br><br>
Clone the repository:

Bash
git clone https://github.com/Ayushparikh-code/Web-dev-mini-projects.git
Navigate to the project directory:

Bash
cd Web-dev-mini-projects/compound-interest-calculator
Run the app:
Open the index.html file in your preferred web browser.

Calculate:
Enter your values into the designated fields and see your compound interest calculated instantly!

💡 Why Use This Tool?
Calculating compound interest manually can be tedious and prone to errors, especially when adjusting variables like compounding frequency over multiple years. This tool simplifies financial planning byHere is a significantly improved, professional README file for the Compound Interest Calculator. It uses standard Markdown, adds a clean structure with badges, and makes the instructions much clearer.

<p>
<img src="https://user-images.githubusercontent.com/67221487/125161239-d20bc080-e19e-11eb-9892-a6073354a29f.png" alt="image">
Expand Down
53 changes: 32 additions & 21 deletions breaking-bad-characters/README.md
Original file line number Diff line number Diff line change
@@ -1,33 +1,44 @@
# Breaking Bad Characters - React Application
# 🧪 Breaking Bad Characters Explorer

## About the Project
A single page web application that uses the breaking bad API to display and filter characters from the show
A sleek, single-page React application that fetches and displays character data from the Breaking Bad universe. Users can easily browse and dynamically filter through their favorite characters using real-time API data.

## Technologies Used
This project is part of the `Web-dev-mini-projects` collection.

- React
- Hooks
- Components
- CSS
- CSS Grid
- Javascript
- Axios
- ES6
- API
- Breaking Bad API
## ✨ Key Features
* **Dynamic Grid Layout:** Displays character profiles in a highly responsive CSS Grid.
* **Live Filtering:** Instantly search and filter characters by name.
* **API Integration:** Asynchronously fetches character details (like name, nickname, and portrait) from an external endpoint.

## 🛠️ Tech Stack
* **Frontend Framework:** React (Functional Components & Hooks)
* **Styling:** CSS3 (focused on CSS Grid for layout)
* **JavaScript:** ES6+ syntax
* **Data Fetching:** Axios for handling asynchronous HTTP requests

## API Used
Breaking Bad Character API
## 📡 API Reference
This project relies on the Breaking Bad Character API to populate the user interface.
* **Endpoint Used:** `https://www.breakingbadapi.com/api/characters`

Link : https://www.breakingbadapi.com/api/characters
## 🏃‍♂️ How to Run Locally

## How to use the Project
To get this React application running on your local machine, follow these steps:

1. Download or clone the repository `git clone https://github.com/Ayushparikh-code/Web-dev-mini-projects.git`
2. Go to the directory
3. Open the terminal, and type `npm start`
1. **Clone the repository:**
```bash
git clone [https://github.com/Ayushparikh-code/Web-dev-mini-projects.git](https://github.com/Ayushparikh-code/Web-dev-mini-projects.git)
Navigate to the directory:
Open your terminal and change into the specific Breaking Bad project folder.

Install dependencies:
Because this project uses React and Axios, you must install the Node modules first:

Bash
npm install
Start the development server:

Bash
npm start
The application will automatically compile and open in your default browser at http://localhost:3000

## Screenshots

Expand Down
50 changes: 31 additions & 19 deletions speed-distance-time-calculator/readme.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,34 @@
# Welcome 🖐 to the Speed-Distance-Time Calculator Website
It is a multi pager Speed Distance Time Calculator with simple but user-friendly design.
# ⏱️ Speed-Distance-Time Calculator

A clean, multi-page web application designed to instantly calculate speed, distance, or time. Featuring a simple and user-friendly interface, this tool provides dedicated calculation pages for each specific metric to ensure a frictionless user experience.

This project is part of the `Web-dev-mini-projects` collection.

## ✨ Key Features
* **Multi-Page Architecture:** Dedicated pages tailored specifically for calculating Speed, Time, and Distance individually.
* **Instant Results:** Performs mathematical conversions and calculations in real-time.
* **Intuitive UI:** A straightforward, accessible design that makes navigation and data entry effortless.
* **No Dependencies:** Built entirely with pure web technologies for rapid load times.

## 🛠️ Tech Stack
* **HTML5:** Semantic structure and multi-page routing.
* **CSS3:** Custom styling for a clean, responsive layout.
* **Vanilla JavaScript:** Mathematical logic and DOM manipulation.

## 🏃‍♂️ How to Run Locally

Getting this project running on your machine takes just a few seconds:

1. **Clone the repository:**
```bash
git clone [https://github.com/Ayushparikh-code/Web-dev-mini-projects.git](https://github.com/Ayushparikh-code/Web-dev-mini-projects.git)
Navigate to the correct directory:
Open your terminal and change into the specific calculator folder:

Bash
cd Web-dev-mini-projects/speed-distance-time-calculator
Run the application:
Simply double-click the index.html file to open the Homepage in your default web browser. (Alternatively, use the "Live Server" extension in VS Code for a better development experience).

## Default view of the website
HOMEPAGE
Expand All @@ -25,23 +54,6 @@ Distance Calculator
<br>


### How to get the website on your local machine:

---

- Download or clone the repository

```
git clone https://github.com/Ayushparikh-code/Web-dev-mini-projects.git
```

- Go to the directory
```
cd speed-distance-time-calculator
````
- Run the index.html file and see the results

<br>


## Happy Coding!