Learning JavaScript & React Today I focused on strengthening my core JavaScript concepts and connecting them with React. 🔹 Practiced important array methods: map() → transforming data filter() → selecting data reduce() → combining data into a single value 🔹 Understood async JavaScript: Learned how async/await works Fetched data from API and displayed it 🔹 React Learning: Used useState to store API data Used useEffect to fetch data when component loads Rendered dynamic data using map() => Key Learning: Understanding the difference between map, filter, and reduce was challenging at first, but now it’s much clearer how they are used in real applications. =>Still improving: Writing reduce logic without confusion Thinking independently without looking at reference code This is just the beginning — focusing on consistency and real understanding. #javascript #reactjs #webdevelopment #learninginpublic #frontenddeveloper
Strengthening JavaScript and React Fundamentals
More Relevant Posts
-
🚀 JavaScript Practice: Improving Logic with Real Examples 💡 🚀Today I focused on strengthening my core JavaScript skills by working on two small but powerful problems.🚀 1. Character Frequency Counting 💬I explored how to count how many times each character appears in a string like "racecar". This helped me understand how objects can be used to store and update values dynamically. I also learned how to transform that data into a clean, readable format.💬 📌 Key learning: 🔹 Using objects to track frequency 🔹 Converting data into a structured format 🔹 Building clean output instead of messy strings 2. Array Pair Formatting Next, I worked on converting an array into a custom pair format like [1:2, 3:4, 5:6]. This improved my understanding of looping with steps and grouping elements logically. 📌 Key learning: Iterating through arrays in steps Grouping elements into pairs Understanding the difference between actual data structures and formatted output 🔥 Overall Takeaways ✔ Improved problem-solving approach ✔ Better understanding of objects and arrays ✔ Learned how to format output cleanly and efficiently #JavaScript #CodingPractice #FrontendDevelopment #ProblemSolving #LearningJourney
-
-
🚀 Day 8 — Mastering JavaScript Arrays & Higher Order Functions Continuing my journey of strengthening core JavaScript fundamentals, today I focused on one of the most practical and frequently used concepts — Arrays & Higher Order Functions 👇 Arrays may look simple at first, but when combined with higher order functions like "map", "filter", and "reduce", they become extremely powerful for solving real-world problems. 🔹 Covered topics: - What are Arrays & why we use them - Indexing & accessing elements - Adding & removing elements ("push", "unshift", "splice") - Difference between "slice" & "splice" - Common methods ("indexOf", "includes", "sort") - Higher Order Functions (🔥 important) - "forEach()" vs "map()" - "filter()" for conditional data - "reduce()" for complex logic (🔥 most important) - "find()" & "findIndex()" - Method chaining (real-world usage 💡) 💡 Key Learning: Higher Order Functions make code clean, readable, and scalable. Instead of writing long loops, we can write powerful one-line logic. 👉 Always remember: - "map()" → transforms data - "filter()" → selects data - "reduce()" → converts data into a single value Understanding these concepts is crucial for React, real-world projects, and technical interviews. 📌 Day 8 of consistent preparation — getting stronger with JavaScript fundamentals 🔥 #JavaScript #WebDevelopment #FullStackDeveloper #CodingJourney #MERNStack #InterviewPreparation #Frontend #Backend #LearnInPublic #Developers #Consistency #100DaysOfCode #LinkedIn #Connections
-
Day 11 of documenting my journey as a Front-End Developer — Introduction to JavaScript Today, I started learning JavaScript, and I had a big misconception at first—I thought JavaScript was an advanced version of Java. I learned that this is not true. JavaScript and Java are completely different languages. JavaScript was created by Brendan Eich and was originally called Mocha, then LiveScript, before being renamed JavaScript to attract Java developers. JavaScript is a high-level, interpreted programming language mainly used to make websites interactive. One thing that stood out to me is how JavaScript executes code—line by line (synchronously), meaning order matters. I also learned: . JavaScript files are saved as .js (e.g., app.js) . It is linked in HTML using: HTML <script src="app.js"></script> . The defer attribute is used when the script is placed in the <head> to delay execution until the HTML loads Interesting fact: Different browsers use different JavaScript engines: . Chrome ---V8 Engine . Firefox----- SpiderMonkey On comments I understood: . JavaScript uses // for single-line comments . /* */ can also be used (same as CSS) . But HTML comments (<!-- -->) do not work in JavaScript Lesson learned: Understanding the foundation of a language helps clear wrong assumptions before diving deeper. #FrontendDevelopment #JavaScript #WebDevelopment #LearningJourney #BeginnerMistakes #WomenInTech #softwareengineering #developer #learninginpublic #techcommunity #careergrowth
-
-
I’ve just launched my new course: 👉 Becoming a Seasoned JavaScript Developer This course is designed for one specific goal: Helping you move from “I know some JavaScript” → “I can actually build with it.” Most people get stuck because they: Focus too much on syntax Skip understanding how things work Never build structured, real-world logic This course fixes that. Inside, you’ll learn how to: - Write clean, modern JavaScript (ES6+) - Structure code using objects and classes - Build interactive browser applications - Work with async JavaScript and APIs - Organize code like a real developer This is a beginner-friendly foundation, but also the base for more advanced, domain-specific courses coming next. If you’re serious about learning JavaScript the right way: 👉 https://lnkd.in/gteQyRtB Would love your feedback and thoughts 🙌 #JavaScript #WebDevelopment #Programming #LearnToCode #FrontendDevelopment
-
When I first started learning JavaScript as a MERN stack developer, one concept that took time to truly understand was callbacks. A callback is simply a function passed as an argument to another function, which is executed after a certain task is completed. This pattern is very common in JavaScript, especially when dealing with asynchronous operations. Example: function greet(name, callback) { console.log("Hello " + name); callback(); } function sayBye() { console.log("Goodbye!"); } greet("Taha", sayBye); Here, sayBye is passed as a callback and executed after the greeting. Callbacks are fundamental to understanding asynchronous JavaScript, and they form the foundation for concepts like Promises and async/await. Have you ever struggled to understand callbacks when learning JavaScript? github: https://lnkd.in/d977yEjj #javascript #webdevelopment #mernstack #coding #softwaredevelopment
-
-
Frontend Learning — Types of Functions in JavaScript (That Every Dev Should Know) Functions are the building blocks of everything we write in JavaScript… -> but not all functions are the same 🔥 Why This Matters Understanding function types helps you: ✔ Write cleaner logic ✔ Manage state better ✔ Avoid bugs (especially with this) 🧠 Pro Insight 👉 In modern React apps: Arrow functions + pure functions = 🔥 combo Higher-order functions power methods like map, filter 🎯 Key Takeaway -> Don’t just write functions… -> Understand their behavior to write better architecture #JavaScript #FrontendDevelopment #WebDevelopment #CodingTips #Functions #CleanCode #Developers #LearnInPublic #DeveloperJourney
-
-
Javascript: Quotes in strings ⚠️ A small mistake with quotes can break your JavaScript code. Many beginners face this problem when working with strings. In JavaScript, quotes are used to create text. But using the wrong quote inside a string can cause an error. Here are the basics 👇 • Use single quotes let text = 'Hello World'; • Use double quotes let text = "Hello World"; • Use backticks (template strings) let text = `Hello World`; • Use different quotes inside a string "I'm learning JavaScript" • Escape quotes if needed 'It\'s JavaScript' Learning this small concept will save you from many syntax errors. #JavaScript #WebDevelopment #FrontendDevelopment #LearnJavaScript #CodingForBeginners #ProgrammingTips #SoftwareDevelopment #TechLearning #DeveloperSkills #CodeNewbie
-
-
Useful JavaScript Tricks Developers Should Know 🚀 JavaScript has some powerful features that can make your code cleaner and more efficient. Here are a few JavaScript tricks I use regularly: 🔹 Destructuring Extract values from objects easily const { name, age } = user; 🔹 Optional Chaining Avoid undefined errors user?.profile?.name 🔹 Default Parameters Set default values function greet(name = "Developer") { return `Hello ${name}`; } 🔹 Spread Operator Copy arrays or objects const newArray = [...oldArray]; 🔹 Short Circuit Evaluation Cleaner conditional logic isLoggedIn && showDashboard() These small tricks can make your code more readable and efficient. Still learning JavaScript every day 🚀 What’s your favorite JavaScript trick? #JavaScript #FrontendDeveloper #ReactNative #SoftwareEngineer #CodingTips #WebDevelopment
-
-
Sites for JavaScript Resources Every Developer Should Know. JavaScript isn’t just a language… It’s the backbone of modern web experiences. But mastering it isn’t about memorizing syntax — it’s about using the right resources. Here are some of the best websites for JavaScript learning and tools 👇 🔹 MDN Web Docs The most reliable documentation for JavaScript. Perfect for understanding concepts, methods, and best practices. 🔹 JavaScript.info A deep yet beginner-friendly guide to JavaScript. Great for structured learning from basics to advanced topics. 🔹 ES6 Features (es6.io / GitHub guides) Learn modern JavaScript (ES6+) features clearly. Helps you write cleaner and more efficient code. 🔹 30 Seconds of Code Quick JavaScript snippets with explanations. Perfect for solving small problems fast. 🔹 CodePen Test and explore JavaScript in real time. Great for experimenting and learning visually. 🔹 Frontend Masters Advanced JavaScript courses by industry experts. Ideal for leveling up your skills. 🔹 JSFiddle A simple playground for testing JavaScript code. Useful for quick debugging and sharing. 🔹 NPM (Node Package Manager) The largest library of JavaScript packages. Helps you build faster using existing tools. 👉 The truth is: You don’t master JavaScript by reading… You master it by building. 💡 Use these resources to learn, test, and apply — that’s how real progress happens. Because in coding, knowledge becomes skill only through action. #JavaScript #WebDevelopment #Programming #Developers #Coding #Frontend #Tech #SoftwareDevelopment #CodingResources #LearnToCode #DeveloperTools #TechSkills
-
-
JavaScript tricks I wish I knew earlier 🔥 These save me hours every week: 1. Optional chaining - stop writing null checks const city = user?.address?.city ?? 'Unknown' 2. Nullish assignment - set default only if null/undefined config.timeout ??= 3000 3. Array flat - flatten any nested array instantly const flat = nested.flat(Infinity) 4. Object.fromEntries - turn a Map or array back into an object const obj = Object.fromEntries(entries) 5. structuredClone - deep copy without JSON.parse hacks const copy = structuredClone(myObj) 6. at() method - negative index access const last = arr.at(-1) These work in modern Node.js and all major browsers. No libraries needed. Share this with a junior dev who needs it 🙌 Shoutout to JavaScript Mastery, w3schools.com for keeping docs and tutorials world-class. #JavaScript #WebDevelopment #CodingTips #ReactJS #NodeJS #FullStackDeveloper #100DaysOfCode #SoftwareEngineering
-
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