Muhammad Hammad-ur-Rehman

Bulb On Off Project Using JavaScript🤗 Hello Everyone, 1st JavaScript Project, I Make a bulb on off project when click on button then bulb on and off dynamically using JavaScript. #html #css #javascript #code #smit

10

Exploring the world of code, one clone at a time! 🗺️✨ Day 16: Recreated the American Tourist website with just HTML & CSS! 💻🚀 #100DaysOfCode #WebDevelopment #HTML #CSS #CodeJourney" Adil khan Imran Khan Eskills Web

5

Designs Speak Louder Than Words 🎨❤️ In my world, design isn't just work—it’s how I communicate. Whenever my girlfriend and I have a fight, we don't argue for long. Instead, we create illustrations and express our emotions through emojis. That's how we solve problems—creatively and with heart. This same passion and approach drive my UI/UX projects and mentoring. I believe in using design to connect, solve challenges, and create meaningful experiences—whether it’s for clients, students, or businesses. If you need unique designs for your app, website, or want to learn UI/UX in a creative way, let’s collaborate! I’m always ready to turn ideas into beautiful, impactful solutions. #DesignWithEmotion #CreativeProblemSolving #UIUXOpportunities #LearnDesignWithMe #DesignMentor #ClientsAndConnections #EarnWithDesign #FreelanceDesigner #IllustrationsWithHeart #UXGrowth #hiring #hiringui #hiringdesigner #hiringuidesigner

3

Assalam o alaikum my linkedin family 😊 Ever wondered how to quickly generate a multiplication table for the sum of odd numbers in an array? This TypeScript function, TableOddsSum, does just that! Let’s dive into how it works and explore its step-by-step process Function: TableOddsSum Input: The function takes an array of numbers (arr) as input. Purpose: It calculates the sum of all odd numbers in the array and then creates a multiplication table (from 1 to 10) of that sum. Step-by-Step Explanation: Step 1: Initialize an empty array TableOddSum to store the results and a variable OddSum to store the sum of odd numbers. Step 2: Loop through each number (num) in the array: If the number is odd (i.e., not divisible by 2), add it to OddSum. Step 3: After the loop, OddSum contains the sum of all odd numbers in the array. Step 4: Create a multiplication table for OddSum from 1 to 10 by pushing OddSum * i (where i ranges from 1 to 10) into the TableOddSum array. Step 5: Return the TableOddSum array, which contains the results. Example: For the input [1, 4, 9, 16, 25]: Odd numbers are 1, 9, and 25. Their sum is 35. The function returns [35, 70, 105, 140, 175, 210, 245, 280, 315, 350], which is the multiplication table of 35. Muhammad Bilal | Fahad Khan | Filza Khan | Naimal Arain | Kanwal Heer | Hammad Abbasi | Furqan Khan | yumna kamran | parveen jatoi | Asharib Ali | kashaf zeeshan #JavaScript #TypeScript #Coding #Programming #WebDevelopment #CodeNewbie #Tech #Developer #100DaysOfCode #CodeExplanation #SoftwareEngineering #LearnToCode #Algorithms #DataStructures

38

4 Comments

Imagine a sophisticated React web application designed to deliver a seamless user experience with robust functionality and stunning aesthetics. At its core, React provides the foundation, offering a declarative and efficient way to build powerful UI components that are both dynamic and scalable. **React Router** enhances navigation within the app, enabling seamless transitions between different views and components, all while maintaining a single-page application architecture. This ensures a fluid user experience akin to native applications. **Helmet** steps in to manage the application's document head, allowing for dynamic changes to meta tags, titles, and other elements crucial for SEO and social sharing optimization. **Tailwind CSS** serves as the styling framework, offering utility-first classes that facilitate rapid UI development without sacrificing flexibility or customization. This approach streamlines the design process, ensuring consistency and responsiveness across various screen sizes. **React Icons** provides a vast library of customizable icons, empowering developers to integrate visually appealing icons into their components effortlessly, enhancing both functionality and visual appeal. **Daisy UI** complements Tailwind CSS by providing ready-to-use UI components that align with modern design trends. These components are designed to be highly customizable and responsive, accelerating the development process without compromising on design quality. **React-Toastify** adds a touch of user interaction finesse by enabling the display of non-intrusive notifications or alerts within the application. This enhances user engagement by providing real-time feedback on actions or updates. **Important Facts About React:** 1. **Component-Based Architecture**: React's component-based architecture promotes reusability and modularity, allowing developers to build encapsulated components that manage their state and can be composed to create complex UIs. 2. **Virtual DOM**: React utilizes a virtual DOM for efficient rendering. It compares the current state of the DOM with a virtual representation and only updates the actual DOM when necessary, resulting in improved performance. 3. **JSX**: JSX (JavaScript XML) is a syntax extension for JavaScript that allows developers to write HTML-like code within their JavaScript. This approach makes it easier to visualize and construct UI components directly within the React codebase. #ReactWebApp #ModernWebDevelopment #ReactRouter #Helmet #TailwindCSS #ReactIcons #DaisyUI #ReactToastify Source Code :

2