William Oliveira’s Post

🌟 #Day10 of my JavaScript exploration has been a deep dive into the captivating world of events! 🌟 Today, I had the pleasure of unraveling the mysteries of event handling in JavaScript, gaining valuable insights into key concepts and techniques: 🔹 Events in JavaScript: Mastering the art of event-driven programming, where user interactions and system events trigger actions and responses within our web applications. 🔹 Concept of Bubbling and Capturing: Understanding the intricacies of event propagation, from the capturing phase where events traverse the DOM hierarchy from the root down to the target element, to the bubbling phase where events ascend from the target element back up to the root. 🔹 stopPropagation(): Harnessing the power of stopPropagation() to control event propagation and prevent it from further bubbling or capturing, ensuring that event handlers are triggered only where intended. 🔹 preventDefault(): Embracing the versatility of preventDefault() to intercept and suppress the default behavior associated with certain events, such as preventing a form submission or a link from navigating to a new page. By mastering these event handling techniques, I've gained greater control and flexibility in crafting interactive and responsive web experiences, elevating the user experience to new heights. Excited to continue exploring the endless possibilities of JavaScript and unlocking even more powerful capabilities in the days ahead! Github Repo -> https://lnkd.in/gc9u4m3u Follow Sameer Vohra for more such posts A special thanks to Hitesh Choudhary for adding fun to the study of JavaScript! 💡💻 #JavaScript #LearningJourney #CodeNewbie #TechEducation

🚀 #Day11 of my JavaScript journey has been a game-changer as I delved into the fascinating realm of asynchronous programming! 🚀 Today, I dived deep into the concepts of asynchronous operations, mastering the nuances between blocking and non-blocking code execution: 🔹 Async Programming: Embracing the power of asynchronous JavaScript, where tasks can execute independently without blocking the main thread, enabling seamless handling of time-consuming operations. 🔹 Blocking vs. Non-blocking Code: Understanding the critical distinction between blocking code, which halts the execution until a task is complete, and non-blocking code, which allows multiple tasks to run concurrently, enhancing performance and responsiveness. 🔹 setTimeout() and clearTimeout(): Harnessing the versatility of setTimeout() to schedule the execution of a function after a specified delay, and clearTimeout() to cancel the scheduled function execution, providing precise control over asynchronous operations. 🔹 setInterval() and clearInterval(): Exploring the capabilities of setInterval() to repeatedly execute a function at defined intervals, and clearInterval() to stop the execution of the function, enabling periodic updates and real-time data processing. Github Repo -> https://lnkd.in/gc9u4m3u Follow Sameer Vohra for more such posts A special thanks to Hitesh Choudhary for adding fun to the study of JavaScript! 💡💻 #JavaScript #LearningJourney #CodeNewbie #TechEducation

👨💻 Crafted a mini-project, a GitHub Profile Searcher, employing HTML, CSS, and JavaScript. This application efficiently retrieves your GitHub profile information along with your repositories, seamlessly displaying them on a dynamic webpage. 🔑 Leveraging the GitHub API, the project fetches GitHub details, enhancing its functionality and user experience. 🔗 https://t.ly/DiR-W

Do you love file-based routing in NextJs but your project fully relies on CSR (Client Side Rendering)? I'm introducing you to file-based routing for React with Vite ✨ ! I love how NextJs have their routing. How about creating your own NextJs? (wow) I used glob import from Vite to read all the components inside the pages folder. After that, I did some path processing to get the final route for each path. I got the regex formula for string processing from someone on the internet. I also put the article inside Readme. So far this routing has been working for static and dynamic routes. Not the perfect one, but I will improve the routing in the next increment. Muhammad Rizky (I can't mention him 😢 ) is the one who gives me the feedback to improve my boilerplate. Best!. If you have any feedback, please comment in the section below! https://lnkd.in/gmE98cGX #softwareengineer #react #csr #webdevelopment #programmer #web #javascript #tips #boilerplate #project #softwareengineerlife

Hey, Checkout My New Project - GitHub FindX! A React-based GitHub User Profile Viewer that allows you to search and explore GitHub profiles with detailed information like followers, repositories, bio, and more. - Built with React, Tailwind CSS, and the GitHub API. Live Preview - https://lnkd.in/gMnaY2er -Got Inspired & Develop by watching Traversy Media. Cheers🥂!! #React #GitHubAPI #WebDevelopment #FrontendDevelopment #JavaScript #TailwindCSS

🚀 Day 4 of 30: JavaScript Code Challenge Complete! ✅ Key Learnings: 1. Understand and use for loops to iterate over a sequence of numbers. 2. Utilize while loops for iteration based on a condition. 3. Apply do...while loops to ensure the loop body is executed at least once. 4. Implement nested loops to solve more complex problems. 5. Use loop control statements (break and continue) to control the flow of loops. Check out my solutions on GitHub: https://lnkd.in/gzXSWanW #JavaScript #CodingChallenge #Day4 #WebDevelopment

Excited ⭐ to share my latest project: a GitHub profile viewer website built from scratch using HTML, CSS, and JavaScript!. To showcase how API fetching done in JavaScript and more. Link to Access: https://lnkd.in/gJT-EveB 🚀 Explore GitHub profiles with ease and dive into the world of code. Check it out and let me know what you think! Github Repo Link: https://lnkd.in/g9i4hXg4 #GitHub #WebDevelopment #JavaScript #HTML #CSS

🚀 Excited to share my latest project—a sleek portfolio website showcasing my skills and projects! 💼 Developed using HTML, CSS, and TypeScript with Vite , I've crafted a dynamic and visually stunning platform to highlight my expertise and achievements. Git hub => https://lnkd.in/g_Q259wT. #WebDevelopment #Portfolio #HTML #CSS #TypeScript #Vite #GitHub #DeveloperPortfolio #WebDesign #CodeShowcase #FrontendDevelopment #PersonalWebsite #CodingJourney Feel free to adjust the description and hashtags to better suit your preferences and audience!

🌟 #Day6 of my JavaScript voyage has been a whirlwind of learning and discovery! 🌟 Today, I delved deeper into the world of looping and array manipulation, uncovering a plethora of techniques to iterate through data and transform it with finesse: 🔹 For Loop, While Loop, Do While Loop: Mastering the art of iteration with JavaScript's versatile looping constructs, from traditional for loops to while and do while loops, each offering unique capabilities for controlling program flow. 🔹 Break, Continue: Harnessing the power of break and continue statements to fine-tune loop behavior, enabling precise control over iteration and decision-making within loops. 🔹 For...of Loop, For...in Loop, ForEach Loop: Exploring different approaches to loop through arrays and objects, leveraging the concise syntax of for...of loops, the versatility of for...in loops, and the expressive power of array methods like forEach(). 🔹 Maps: Embracing the power of Map objects in JavaScript, understanding their role in storing key-value pairs and facilitating efficient data manipulation. 🔹 .filter(), .map(), .reduce(): Unlocking the potential of array methods like .filter(), .map(), and .reduce() to transform and manipulate array data with elegance and efficiency, paving the way for cleaner and more concise code. 🔹 Chaining: Embracing the art of method chaining, where the output of one array method becomes the input for another, enabling seamless data processing pipelines and enhancing code readability. Each concept I've encountered today has expanded my toolkit as a JavaScript developer, empowering me to tackle complex problems with confidence and finesse. Excited to apply these newfound skills to real-world projects! Github Repo -> https://lnkd.in/gc9u4m3u Follow Sameer Vohra for more such posts A special thanks to Hitesh Choudhary for adding fun to the study of JavaScript! 💡💻 #JavaScript #LearningJourney #CodeNewbie #TechEducation

🚀 #Day8 of my JavaScript journey has been a marathon of creativity and coding! 🚀 Today, I'm thrilled to share that I've brought three exciting projects to life, each showcasing the power and versatility of JavaScript: 1️⃣ Color Scheme Switcher: I crafted a dynamic color scheme switcher that allows users to toggle between different color palettes with a simple click. Whether it's light mode or dark mode, this feature enhances user experience and adds a touch of personalization to web applications. 2️⃣ BMI Calculator: Next up, I developed a BMI (Body Mass Index) calculator, empowering users to track their health and fitness goals with ease. By inputting their height and weight, users can instantly calculate their BMI and gain valuable insights into their overall health status. 3️⃣ Digital Clock: Lastly, I created a digital clock that displays the current time in real-time. Each project presented its own unique challenges and opportunities for growth, allowing me to hone my JavaScript skills and explore new concepts along the way. Excited to continue pushing the boundaries of what's possible with JavaScript and embark on even more ambitious projects in the days ahead! Github Repo -> https://lnkd.in/gc9u4m3u Follow Sameer Vohra for more such posts A special thanks to Hitesh Choudhary for adding fun to the study of JavaScript! 💡💻 #JavaScript #LearningJourney #CodeNewbie #TechEducation