🚀 Day 2/30 – Random Color Generator Continuing my 30 Days JavaScript Challenge. Today I built a Random Color Generator using HTML, CSS, and JavaScript. What it does: 🎨 Generates a random HEX color 🖱 Changes background on button click 🔢 Displays the color code dynamically What I learned: ✔ Math.random() logic ✔ DOM manipulation ✔ Updating styles dynamically ✔ Handling events properly Small projects, but strong fundamentals 💪 Live Demo: https://lnkd.in/gTw_h_G3 GitHub Repository: https://lnkd.in/gci2tTXc 28 more projects to go 🚀 #javascript #webdevelopment #codingjourney #30daysofcode #mernstack
JavaScript Random Color Generator with HTML CSS
More Relevant Posts
-
🚀 Practicing Selection Sort in JavaScript Today I spent some time strengthening my understanding of sorting algorithms by implementing Selection Sort on a single array using JavaScript. 🧠 My Approach: 1. Loop through the array 2. Track the index of the smallest element 3. Use an if condition to compare and update the minimum value 4. Swap it with the current position 🖋️ Example : let arr = [23,3,41,12,2,56,15] ; and the result is : [2,3,12,15,23,41,56] 📈 Time Complexity: Best Case : O(n²) Average Case : O(n²) Worst Case : O(n²) 📌 Key Takeaway: Selection Sort is all about selection + swapping. Simple logic, but powerful for building strong foundations. 🔗 Check out my GitHub for the full code. #JavaScript #DSA #CodingPractice #Algorithms #SelectionSort #LearningJourney 😊
To view or add a comment, sign in
-
🚀 30 Days of JavaScript – Day 8 Continuing my journey to improve my JavaScript logical thinking by building small programs every day. 💡 Today’s Mini Project: Random Color Generator This program randomly selects a color and changes the background color of the page. 🧠 Concepts Used: Arrays Math.random() confirm() and alert() Basic DOM manipulation 🎥 Demo video below 👇 Full source code in the First comment. #JavaScript #WebDevelopment #CodingJourney #FrontendDeveloper #LearningJavaScript #30DaysOfCode
To view or add a comment, sign in
-
🚀 What I Learned Today – JavaScript Arrays Today I explored Arrays in JavaScript and here are the key takeaways 👇 🔹 Arrays are a collection of items 🔹 They are linear (elements stored sequentially) 🔹 Arrays are mutable (can be changed after creation) 📌 Array Indices Positions of elements in an array (starting from 0) 📌 Looping Through Arrays Used to print or access all elements easily 📌 Useful Array Methods ✔️ push() – add element to end ✔️ pop() – remove element from end ✔️ unshift() – add element to start ✔️ shift() – remove element from start ✔️ toString() – convert array to string ✔️ concat() – merge arrays ✔️ slice() – get part of array (no change to original) ✔️ splice() – modify array (add/remove/replace) 💡 Example: slice(start, end) splice(start, deleteCount, newElement) Learning step by step and building strong fundamentals 💪 #JavaScript #WebDevelopment #CodingJourney #FrontendDevelopment #100DaysOfCode)
To view or add a comment, sign in
-
-
🚀 Just built a Random Color Generator using JavaScript 🎨 Today, I worked on DOM manipulation and event handling, and created a simple yet powerful project where: ✔️ On button click → a random RGB color is generated ✔️ The text color updates dynamically ✔️ The background color changes in real time 💡 Learned concepts: DOM Selection (querySelector) Event Listeners (addEventListener) Functions & Return Values Random number generation (Math.random, Math.floor) Dynamic styling using JavaScript This project helped me understand how JavaScript interacts with HTML and CSS in real time. 📌 Still learning, still improving — consistency is key 💪 #JavaScript #WebDevelopment #DOM #FrontendDevelopment #CodingJourney #100DaysOfCode #apnaCollege
To view or add a comment, sign in
-
🚀 30 Days of JavaScript – Day 4 Continuing my journey to improve JavaScript logical thinking by building small programs every day. 💡 Today’s Program: Vowel Identifier & Replacement This program: i) Takes a name as input ii) Identifies vowels (a, e, i, o, u) iii) Replaces vowels with * iv) Counts the total number of vowels in the name 🧠 Concepts Used: prompt() for user input for loop for iteration toLowerCase() for case handling includes() method Conditional logic (if / else) Example: Input → john Output → j*hn Total Vowels → 1 🎥 Demo below 👇 Full source code in the first comment. #JavaScript #WebDevelopment #CodingJourney #ProblemSolving #LearningJavaScript #30DaysOfCode
To view or add a comment, sign in
-
🚀 Day 86 of My #100DaysOfCode Challenge Today I discovered a lesser-known feature in JavaScript — Symbols. Most developers work with object keys using strings, but JavaScript also provides another unique type called Symbol. A Symbol creates a unique and hidden property key that cannot accidentally conflict with other keys. Example const id = Symbol("id"); const user = { name: "Tejal", [id]: 12345 }; console.log(user.name); // Tejal console.log(user[id]); // 12345 Why Symbols are interesting • Every Symbol is unique • Helps create hidden object properties • Prevents accidental property overwriting • Often used internally in libraries and frameworks Even if two symbols have the same description, they are still different. const a = Symbol("key"); const b = Symbol("key"); console.log(a === b); // false Learning about features like Symbols helps me understand how JavaScript works behind the scenes and how large applications manage object data safely. Exploring deeper concepts every day. 💻✨ #Day86 #100DaysOfCode #JavaScript #WebDevelopment #LearningInPublic #CodingJourney
To view or add a comment, sign in
-
-
⚠️ The Danger of Splicing Arrays in a Loop "While solving the 'Move Zeroes' challenge today, I encountered a classic JavaScript pitfall: Modifying an array's length while iterating over it. The Mistake: Using .splice() inside a for loop. When you remove an element, the next one shifts left, and your loop index skips it! The Lesson: Always adjust your index or, even better, use the Two-Pointer technique. It's not just safer; it's much more performant for large datasets. Small bugs teach the biggest lessons! 🚀" "Did you know? JavaScript (ES6) allows you to swap array elements in a single line using destructuring : [a, b] = [b, a]. Clean, readable, and efficient!" Feel free to check out my progress and solutions on my LeetCode profile: I've shared my LeetCode profile link in the first comment below! #JavaScript #CodingTips #WebDevelopment #ProblemSolving #LeetCode #AngularDeveloper
To view or add a comment, sign in
-
-
🚀 30 Days of JavaScript – Day 6 Continuing my journey to improve my JavaScript logical thinking by building small programs every day. 💡 Today’s Program: Find the Largest Number (User Input) This program allows the user to enter numbers separated by commas and then finds the largest number in the list. 🧠 Concepts Used: • prompt() for user input • split() to convert input into an array • map(Number) to convert strings into numbers • for loop for iteration • Conditional comparison (if statement) 📌 Example Input: 10,25,7,90,30 Output: Largest Number: 90 🎥 Demo below 👇 Full source code in the First comment. #JavaScript #WebDevelopment #CodingJourney #ProblemSolving #LearningJavaScript #30DaysOfCode
To view or add a comment, sign in
-
🚀 Just solved the "Best Time to Buy and Sell Stock" problem in JavaScript! Today I worked on improving my problem-solving skills by implementing a solution to calculate the maximum profit from stock prices. 🔍 Problem: Given an array of prices, determine the maximum profit you can achieve by buying and selling once. 💡 Approach: I started with a brute-force solution using nested loops to compare every possible buy/sell pair. While not the most optimal (O(n²)), it helped me deeply understand the problem before optimizing. 📌 Example: Input: [10, 1, 5, 6, 7, 1] Output: 6 🧠 Key takeaway: Sometimes starting simple is the best way to build strong intuition before moving to more efficient solutions. 👉 Check out my code and more JavaScript patterns here: https://lnkd.in/ej4fNeZs #JavaScript #Coding #ProblemSolving #100DaysOfCode #WebDevelopment #LearningInPublic
To view or add a comment, sign in
-
-
📌 LinkedIn Post Content 🚀 30 Days of JavaScript – Day 7 Continuing my journey of improving JavaScript logical thinking by solving small problems daily. 💡 Today’s Program: Remove Duplicate Numbers from an Array This program takes numbers as input and removes duplicate values to create a list of unique numbers. 🧠 Concepts Used: • Arrays • split() and map() • includes() method • for loop • Conditional logic Example: Input → 1,2,3,2,4,1,5 Output → [1,2,3,4,5] 🎥 Demo below 👇 Full source code in the First comment. #JavaScript #CodingJourney #ProblemSolving #WebDevelopment #LearningJavaScript
To view or add a comment, sign in
Explore content categories
- Career
- Productivity
- Finance
- Soft Skills & Emotional Intelligence
- Project Management
- Education
- Technology
- Leadership
- Ecommerce
- User Experience
- Recruitment & HR
- Customer Experience
- Real Estate
- Marketing
- Sales
- Retail & Merchandising
- Science
- Supply Chain Management
- Future Of Work
- Consulting
- Writing
- Economics
- Artificial Intelligence
- Employee Experience
- Workplace Trends
- Fundraising
- Networking
- Corporate Social Responsibility
- Negotiation
- Communication
- Engineering
- Hospitality & Tourism
- Business Strategy
- Change Management
- Organizational Culture
- Design
- Innovation
- Event Planning
- Training & Development