JavaScript-Bro-Code

JavaScript Bro Code 🚀

A complete, hands-on journey through JavaScript — from the absolute fundamentals to asynchronous programming and real APIs — built while learning from Bro Code’s JavaScript course. This repo contains 75+ topic-wise practice folders and 11 fully working mini/major projects, each committed step by step as the concept was learned.

📖 About

This repository documents my process of learning JavaScript from scratch: every core concept was practiced in its own folder, and once enough fundamentals were covered, that knowledge was applied to build real, interactive projects — culminating in a full Weather App powered by a live API.

The goal isn’t just to finish a course, but to genuinely understand how and why each concept works — which is why every folder here represents a topic that was individually written, tested, and committed to Git.

📚 Topics Covered

🔤 Fundamentals

- JavaScript Basics, Variables, Constants - Arithmetic Operators, Accepting User Input, Type Conversion - Math Object, Checked Property

🔀 Control Flow

- If Statements, Ternary Operator, Switches - While Loop, For Loops - String Methods & String Slicing, Method Chaining

⚙️ Functions & Scope

- Functions, Variable Scope - Function Expressions, Arrow Functions - Callback Functions, Callback Hell

📦 Arrays & Iteration

- Arrays, Spread Operator, Rest Parameter - ForEach, Map, Filter, Reduce - Sorting, Shuffling Arrays

🧩 Objects & OOP

- Objects, `this` Keyword - Constructors, Classes, Static Keyword - Inheritance, Super Keyword - Getters & Setters, Destructuring - Nested Objects, Arrays of Objects

⏱️ Advanced & Asynchronous JavaScript

- Dates, Closures, setTimeout - ES6 Modules, Error Handling - Promises, Async/Await - JSON, Fetch API

🖱️ DOM Manipulation

- DOM, Element Selectors, DOM Navigation - Adding & Changing HTML - Mouse Events, Key Events - Hide & Show, NodeLists, ClassList

💻 Projects

Project	Description
Counter Program	Increment/decrement counter with click events
Random Number Generator	Generates random numbers within a user-defined range
Temperature Conversion	Converts temperature between Celsius and Fahrenheit
Dice Roller	Simulates rolling a dice with a random outcome
Random Password Generator	Generates secure, random passwords
Digital Clock	Real-time digital clock updated using JavaScript
Stopwatch	Start, stop, and reset stopwatch with live timing
Calculator	Basic arithmetic calculator (add, subtract, multiply, divide)
Rock Paper Scissors	Classic game with score tracking and DOM-based UI updates
Image Slider	Auto-playing image carousel with next/previous controls and fade animation
🌤️ Weather App	Fetches live weather data from an external API using fetch and async/await, and displays it dynamically on the page — the capstone project combining DOM, JSON, and API skills learned throughout the course

🔗 Live Demos

Click any project below to try it live — no setup needed:

• 🌦️ Weather App — Real-time weather application using the Fetch API and asynchronous JavaScript
• ✂️ Rock Paper Scissors — Classic game with score tracking and interactive UI
• 🧮 Calculator — Basic arithmetic calculator built with JavaScript
• ⏱️ Stopwatch — Start, stop, and reset stopwatch with live timing
• 🔐 Random Password Generator — Generates secure random passwords
• 🌡️ Temperature Conversion — Converts temperatures between Celsius and Fahrenheit
• 🎲 Dice Roller — Random dice rolling simulator with dynamic UI
• 🎯 Random Number Generator — Generates random numbers within a custom range
• 🔢 Counter Program — Simple increment/decrement counter with DOM manipulation
• 🕐 Digital Clock — Real-time digital clock updated using JavaScript
• 🖼️ Image Slider — Auto-playing image carousel with next/previous controls and fade animation

🛠️ Tech Stack & Tools

• JavaScript (ES6+) — core language
• HTML5 & CSS3 — structure and styling for projects
• VS Code — code editor
• Git & GitHub Desktop — version control
• Git Bash — command-line Git operations

📂 Repo Structure

Each folder is numbered in the order topics were learned, making it easy to follow the progression from basics to advanced concepts:

01_JavaScript_Basics/
02_Variable/
...
75_WeatherApp_Project/
Project01_07_Counter_Program/
Project02_09_Random_Number_Generator/
...

Every folder contains the practice files for that specific topic, with working code and comments explaining the logic.

🌱 What I Learned

Building this repo end-to-end helped me get comfortable with:

• Writing clean, readable JavaScript from scratch
• Debugging real issues (case sensitivity, CSS specificity, scope errors, undefined variables)
• Working with the DOM to build interactive UIs
• Handling asynchronous operations and consuming real-world APIs
• Using Git and GitHub properly — commits, pushes, and version control as a daily habit

🚀 Getting Started

To run any project locally:

1. Clone the repo:

   git clone https://github.com/Kryptonae/JavaScript-Bro-Code.git
   

2. Open the desired project folder in VS Code
3. Open index.html in your browser (Live Server extension recommended)

👤 Author

Ashwani Kumar (@Kryptonae)

---

⭐ If you found this helpful or interesting, feel free to star the repo and follow my progress!