I'm currently focusing on my backend journey 🚀 No fancy designs for now just logic, APIs, and making things actually work. Today I built a Color Scheme Generator from scratch using vanilla JavaScript. It connects to a real API, fetches live data, and displays a full color palette on the page. Small project. Big lesson. I learned: → How to call an external API with fetch() → How async/await works and why it matters → How to dynamically create and update the DOM → How to read API documentation and use it Every project teaches me something new — and I'm just getting started. 🔗 GitHub: https://lnkd.in/dVxnrRWU #JavaScript #Backend #100DaysOfCode #WebDevelopment #Learning
Alaa Almekdad’s Post
More Relevant Posts
-
🚀 Day 28 of My Full Stack Development Journey Today I focused on understanding decision-making in JavaScript and how programs handle different conditions ⚡ Here’s what I learned today: 🔹 Operators in JavaScript – Performing different operations 🔹 Comparison Operators – Comparing values 🔹 Comparison for Non-Numbers – Understanding how JS handles strings and other types 🔹 Conditional Statements – Writing logic using conditions 🔹 if, else if, else Statements – Handling multiple cases 🔹 Nested if-else – Managing complex conditions 🔹 Practiced several questions to improve my logic 💻 These concepts helped me understand how programs make decisions and respond to different inputs. Step by step, improving my problem-solving skills 🚀 #FullStackJourney #WebDevelopment #JavaScript #LearningInPublic #100DaysOfCode #CodingJourney
To view or add a comment, sign in
-
🚀 Day 29 of My Full Stack Development Journey Today I continued diving deeper into JavaScript and focused on logic building and user interaction ⚡ Here’s what I learned today: 🔹 Logical Operators – Combining multiple conditions 🔹 Truthy & Falsy Values – Understanding how JS evaluates values 🔹 Switch Statement – Handling multiple conditions more efficiently 🔹 Alerts & Prompts – Interacting with users through the browser 🔹 Practiced multiple questions and assignment problems 💻 These concepts helped me understand how JavaScript handles real-world logic and user input. Step by step, building confidence in writing better and smarter code 🚀 #FullStackJourney #WebDevelopment #JavaScript #LearningInPublic #100DaysOfCode #CodingJourney
To view or add a comment, sign in
-
🚀 Day 9/100 — #100DaysOfCode Diving deeper into JavaScript and understanding how it really works behind the scenes 💻 Today was all about moving from basics to advanced concepts that power real-world applications. 📚 What I learned: 🧠 Core Concepts • Scope — understanding where variables are accessible • Execution Context — how JavaScript runs code step-by-step • Closures — functions remembering their outer scope ⚡ Advanced Concepts • this keyword — context of execution • Object-Oriented JavaScript — structuring code using objects 🔄 Asynchronous JavaScript • Callbacks — handling async tasks • Promises — better async handling • Async/Await — clean and readable async code 🌐 API Handling • Fetch API — getting data from servers • HTTP Basics — request & response understanding 💡 Key Insight: JavaScript is not just a language — it’s an ecosystem for building dynamic, real-world applications. 🔥 Day 9 complete. Learning how real apps communicate and function. #JavaScript #AsyncJS #WebDevelopment #100DaysOfCode #CodingJourney #BuildInPublic
To view or add a comment, sign in
-
-
JavaScript Promises finally clicked for me today — and honestly, the real-life analogy made all the difference. Think of it like ordering food: • Order placed → Pending • Food delivered → Resolved • Order cancelled → Rejected That’s literally how async code behaves behind the scenes. What I found interesting is how Promises simplify "callback hell" into a much cleaner flow using ".then()", ".catch()", and ".finally()". Still wrapping my head around async/await, but this feels like a solid step forward. Curious — what helped you understand async JavaScript better? #JavaScript #WebDevelopment #AsyncProgramming #CodingJourney
To view or add a comment, sign in
-
-
🗺️ The Ultimate JavaScript Roadmap (From Beginner to Advanced) 🚀 If you’re learning JavaScript, this roadmap will save you months 👇 🔰 Start with the basics 👉 Variables, Data Types, Arrays, Objects 👉 Conditions & Loops, Functions 🧠 Build strong core concepts 👉 Closures, Scope, this, Call/Apply/Bind, Prototypes ⚡ Master modern JavaScript (ES6+) 👉 Arrow Functions, Destructuring, Spread/Rest 🌐 Understand async JavaScript 👉 Promises, Async/Await, Event Loop 🧩 Learn DOM & browser concepts 👉 Event Handling, Creating / Removing Elements 🔧 Go deeper into advanced topics 👉 Debouncing, Currying, Memoization, Error Handling 🏗️ Work on real-world skills 👉 APIs, Local Storage 🚀 Finally, build projects 👉 Todo App, Weather App, Mini Projects 🔥 Stop watching tutorials. Start building. 💬 Where are you in this roadmap right now? #javascript #webdevelopment #frontend #coding #roadmap #100DaysOfCode
To view or add a comment, sign in
-
-
🚀 Back in the Flow: Mastering Performance in React After a brief break, I’m back to what I love—building and solving logic. Today, I focused on optimizing search functionality using Debouncing in React. When building a search bar, hitting an API on every single keystroke is expensive and inefficient. To solve this, I implemented a custom debouncing logic inside a useEffect hook. 💡 Key Highlights of this Implementation: Controlled Input: Using useState to manage the search query. Debounce Logic: I used setTimeout to delay the API call by 700ms. This ensures the request only fires after the user has stopped typing. Memory Management: A crucial cleanup function (clearTimeout) to prevent memory leaks and race conditions if the user continues typing. Async/Await: Handling API fetching cleanly within the hook. Building these kinds of "logic-heavy" small components is what sharpens the mind for large-scale applications. It's not just about making it work; it's about making it efficient. GitHub repo : https://lnkd.in/dBw2y6m4 Consistency is the only currency in tech. Onwards and upwards! 📈 #ReactJS #WebDevelopment #MERNStack #FrontendEngineering #CodingJourney #JavaScript #Debouncing #CleanCode
To view or add a comment, sign in
-
-
Our team analyzed 70 full-stack applications using TypeScript and tRPC, and the results were eye-opening. We found an average 25% reduction in bugs related to API mismatches. End-to-end type safety is not just a buzzword—it's a real game changer. Have you ever considered the impact of strong typing on your full-stack development process? At first, I was skeptical about the learning curve that adding tRPC would introduce. But integrating these robust types into both the backend and frontend created a synchronized development flow I hadn't experienced before. Imagine defining your API in one single place, and knowing that any changes are instantly reflected wherever it's used—no more chasing down those pesky runtime errors. This became our team's standard with TypeScript and tRPC. When changes happen, the confidence in our code remains unshaken. Here's a quick TypeScript snippet showcasing how effortlessly you can define a tRPC procedure: ```typescript import { initTRPC } from '@trpc/server'; const t = initTRPC.create(); const appRouter = t.router({ getUser: t.procedure .input(z.string()) .query(async ({ input }) => { return await getUserFromDatabase(input); // Assume this fetches a user by ID }), }); ``` This snippet highlights how simple it is to create a type-safe procedure, ensuring the input and output are consistent across the board. So, have you tried tRPC or similar libraries? How do you ensure end-to-end type safety in your projects? #WebDevelopment #TypeScript #Frontend #JavaScript
To view or add a comment, sign in
-
💡 Want to level up your JavaScript skills? Here’s what helped me: 1️⃣ Code small apps daily — calculators, to-do lists, timers. 2️⃣ Master core concepts: closures, promises, async/await. 3️⃣ Debug like a detective — use console.log() wisely. 4️⃣ Read and tweak open-source code on GitHub. 5️⃣ Experiment with JSFiddle & freeCodeCamp challenges. Consistency > long sessions. Even 20–30 mins/day can make a huge difference! 🚀 #JavaScript #WebDevelopment #CodingTips #ContinuousLearning #FrontEndDev
To view or add a comment, sign in
-
🔥 Master JavaScript Like a Pro! 🚀💻 JavaScript isn’t just a language—it’s a superpower every developer must master 💪 From understanding Execution Context & Closures 🧠 to unlocking Async Magic with Promises & Event Loop ⚡… and then leveling up with mind-blowing hacks 🤯 like: ✔ Swap variables in 1 line ✔ Remove duplicates instantly ✔ Use optional chaining like a pro 👉 These concepts are the foundation of clean, scalable, and high-performance code 💡 The difference between an average developer and a pro? Deep understanding of core concepts + smart tricks 🚀 Start mastering today and level up your JavaScript game! Medium - https://lnkd.in/gqsD67J8 Google Blogs - https://lnkd.in/gi5gm9gb Personal Site - https://lnkd.in/gB-p_p4A Medium - https://lnkd.in/gqsD67J8 #JavaScript #WebDevelopment #Programming #Coding #Developers #SoftwareEngineering #Frontend #FullStack #CodingTips #Tech #LearnToCode #100DaysOfCode #DevCommunity #CleanCode
To view or add a comment, sign in
-
Understanding concepts of React and JavaScript in depth, along with writing your own polyfill, are effective methods to truly grasp how these technologies work. Engaging with the material in this way fosters a deeper comprehension and insight into the subject matter. Additionally, exploring custom hooks like useCustomEffect can enhance your ability to manage side effects in functional components, leading to more efficient and organized code.
To view or add a comment, sign in
-
Explore related topics
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