--- title: Best freeCodeCamp posts — September 2022 | daily.dev description: The most upvoted freeCodeCamp posts from September 2022, curated by the daily.dev community. canonical: https://daily.dev/sources/freecodecamp/best-of/2022/09 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/sources/freecodecamp/best-of/2022/09 og:type: website og:site_name: daily.dev og:title: Best freeCodeCamp posts — September 2022 | daily.dev og:description: The most upvoted freeCodeCamp posts from September 2022, curated by the daily.dev community. og:image: https://media.daily.dev/image/upload/s--VAY5ToZt--/f_auto/v1724209435/public/daily.dev%20-%20open%20graph --- # Best of freeCodeCamp — September 2022 1. 1 [](https://daily.dev/posts/how-to-prepare-for-react-interviews-front-end-technical-interview-guide-ez0ekqd4i "How to Prepare for React Interviews – Front-End Technical Interview Guide") Article freeCodeCamp · 4y How to Prepare for React Interviews – Front-End Technical Interview Guide A polyfill is a custom implementation of native JavaScript functions. The.map() polyfill method takes in a callback that gets executed inside the myMap body. This is nothing but the length of the array through which theMyMap function is called. Since map() returns a new array, we create an empty array and push the results into it. In order to implement debouncing, let's take an example. 369 40 2. 2 [](https://daily.dev/posts/top-30-react-interview-questions-and-concepts-i5ejdm-y "Top 30 React Interview Questions and Concepts") Article freeCodeCamp · 4y Top 30 React Interview Questions and Concepts The freeCodeCamp.org course teaches you about 30 common React interview questions and concepts. Nishant Singh developed this course to help you prepare for a React interview. 274 3 3. 3 [](https://daily.dev/posts/code-a-minecraft-clone-using-react-and-three-js-ha7-dk06 "Code a Minecraft Clone Using React and Three.js") Article freeCodeCamp · 4y Code a Minecraft Clone Using React and Three.js Code a Minecraft clone using React, JavaScript, and Three.js is a course on the freeCodeCamp.org YouTube channel. You will learn about many React concepts such as useState, useEffect, useRef and custom Hooks for State management. 230 6 4. 4 [](https://daily.dev/posts/how-to-lazy-load-images-in-react--5d2gcr0k "How to Lazy Load Images in React") Article freeCodeCamp · 4y How to Lazy Load Images in React Lazy loading is a strategy that delays the loading of some assets (e.g., images) until they are needed by the user based on the user's activity and navigation pattern. For browsers like Firefox, the loading= "lazy" property doesn't work in an iframe element. To use the placeholder image, add a PlaceholderSrc attribute to the image with the value of the image. You can see how it is. 197 15 5. 5 [](https://daily.dev/posts/best-practices-for-scaling-your-node-js-rest-apis-4nu2ywmmo "Best Practices for Scaling Your Node.js REST APIs") Article freeCodeCamp · 4y Best Practices for Scaling Your Node.js REST APIs Use throttling at the first junction point between your application and the News Feed Service. Use the ELK stack for setting up a good logging and alerting pipeline. If a request goes through multiple services during the lifecycle, you can pass along a unique ID in the logs to capture a particular request across all the services. 180 20 6. 6 [](https://daily.dev/posts/how-to-animate-your-react-apps-with-1-line-of-code-lssw-tv0h "How to Animate Your React Apps with 1 Line of Code") Article freeCodeCamp · 4y How to Animate Your React Apps with 1 Line of Code The power of AutoAnimate is that it allows you to animate your entire app using a single function called autoAnimate. In this tutorial, we will see how to implement virtually every common animation in your React apps with one line of code. You can become a pro in 30 minutes a day with my React Bootcamp. Go from absolute beginner to React professional in just 30 minutes. 145 7 7. 7 [](https://daily.dev/posts/how-the-javascript-dom-works-a-practical-tutorial-cbckwxrca "How the JavaScript DOM Works – A Practical Tutorial") Article freeCodeCamp · 4y How the JavaScript DOM Works – A Practical Tutorial DOM is a Web API that allows developers to use programming logic to make changes to their HTML code. In this tutorial, you'll learn what the DOM is and how it works in a practical way. In our style-css file, we'll first of all set our general styles like this. Then, we will style our colors and colors. 119 7 8. 8 [](https://daily.dev/posts/open-source-for-developers-a-beginner-s-handbook-to-help-you-start-contributing-ji627p02b "Open Source for Developers – A Beginner's Handbook to Help You Start Contributing") Article freeCodeCamp · 4y Open Source for Developers – A Beginner's Handbook to Help You Start Contributing Open Source is a generic term for Open Source Software (OSS) Open-source software is built on source code that's open to everyone to view, change, extend, and distribute. 119 30 9. 9 [](https://daily.dev/posts/machine-learning-for-everybody-bsrxfmlqy "Machine Learning for Everybody") Article freeCodeCamp · 4y Machine Learning for Everybody The freeCodeCamp.org YouTube channel is the perfect place to start your learning journey. The course is an excellent introduction to many of the key machine learning concepts. You will also learn how to program different machine learning models on Google Collab. Google provided a grant that made this course possible. 105 2 10. 10 [](https://daily.dev/posts/parameters-vs-arguments-in-javascript-what-s-the-difference--dreooet26 "Parameters vs Arguments in JavaScript – What's the Difference?") Article freeCodeCamp · 4y Parameters vs Arguments in JavaScript – What's the Difference? JavaScript is one of the most popular programming languages out there for web development. The dynamic values passed in a JavaScript function can change when the function gets called in another location in the code. The keywords we use to name these data are parameters and arguments, but some developers confuse them. 94 11 11. 11 [](https://daily.dev/posts/javascript-dom-tutorial-how-to-build-a-calculator-app-in-js-fdxabxizb "JavaScript DOM Tutorial – How to Build a Calculator App in JS") Article freeCodeCamp · 4y JavaScript DOM Tutorial – How to Build a Calculator App in JS The Document Object Model (DOM) is a logical structure that defines how elements in a document can be manipulated and changed. You must first learn how to access elements in the DOM before you can manipulate it. How to create a DOM Element JavaScript requires that any element be created before it can be added to the DOM. For this, we use the document.createElement() method. 84 3 12. 12 [](https://daily.dev/posts/learn-jenkins-by-building-a-ci-cd-pipeline-il5nvbqeo "Learn Jenkins by Building a CI/CD Pipeline") Article freeCodeCamp · 4y Learn Jenkins by Building a CI/CD Pipeline Learn Jenkins by Building a CI/CD Pipeline Jenkins is an open source automation server which makes it easier to build, test, and deploy software. Gwendolyn Faraday developed this course to teach you about Jenkins by showing you how to build a CI-CD pipeline for a web application. 56 13. 13 [](https://daily.dev/posts/authentication-vs-authorization-what-s-the-difference--xy-j-cis0 "Authentication vs Authorization – What's the Difference?") Article freeCodeCamp · 4y Authentication vs Authorization – What's the Difference? authentication is the process of verifying the credentials a user provides with those stored in a system to prove the user is who they say they are. You only need a single factor to authenticate, with the most common being a password. Authorization can either grant or deny permission to carry out tasks, or access areas of an application. 54 14. 14 [](https://daily.dev/posts/how-to-write-a-good-technical-tutorial-mth0q-3o4 "How to write a Good Technical Tutorial") Article freeCodeCamp · 4y How to write a Good Technical Tutorial The first thing a reader looks for in a tutorial is what the tutorial will solve or answer for them. Make an Outline before starting to write a tutorial, outline what things are you going to write about. Use Headings and Small Paragraphs to separate different sections of your article by topic. 53 7 15. 15 [](https://daily.dev/posts/what-is-tailwind-css-a-beginner-s-guide-owwhuxmq9 "What is Tailwind CSS? A Beginner's Guide") Article freeCodeCamp · 4y What is Tailwind CSS? A Beginner's Guide Tailwind CSS is a new tool that takes away a lot of the burden from us. There are many ways to write CSS out there – like Vanilla CSS3, LESS, SCSS, Bootstrap, styled-components, Windi CSS, and more – and even our OG HTML. The concept of Atomic CSS is not new but tailwind CSS takes it to another level. 53 2 16. 16 [](https://daily.dev/posts/the-javascript-concepts-you-should-know-before-learning-react-g-abime5n "The JavaScript Concepts You Should Know Before Learning React") Article freeCodeCamp · 4y The JavaScript Concepts You Should Know Before Learning React The Ternary Operator is a short, one-line conditional operator to replace if/else. The Spread Operator was introduced to JavaScript in ES6\. There are other methods like filter, reduce, find, forEach, splice, concat, push and pop, shift, shift and so on. 45 1 17. 17 [](https://daily.dev/posts/how-to-code-a-2d-game-using-javascript-html-and-css-kxi7fujir "How to Code a 2D Game Using JavaScript, HTML, and CSS") Article freeCodeCamp · 4y How to Code a 2D Game Using JavaScript, HTML, and CSS The game uses just HTML, CSS and plain JavaScript without frameworks or libraries. You will build a game completely from scratch featuring everything from sprite animation to parallax backgrounds. 43 18. 18 [](https://daily.dev/posts/intro-to-deno-guide-for-beginners-v1r8wijrn "Intro to Deno – Guide for Beginners") Article freeCodeCamp · 4y Intro to Deno – Guide for Beginners Deno is built on the V8 JavaScript engine but was built using Rust instead of C++. It aims to have the same APIs on the server that you would use in the browser. It uses TypeScript as a first class language out of the box, so you can run or use TypeScript without installing any other TypeScript. 40 2 19. 19 [](https://daily.dev/posts/oop-meaning-what-is-object-oriented-programming--bk26ssjws "OOP Meaning – What is Object-Oriented Programming?") Article freeCodeCamp · 4y OOP Meaning – What is Object-Oriented Programming? OOP is a programming paradigm that relies on the concept of classes and objects. The word object-oriented is a combination of two terms, object and oriented. When a class is defined initially, the description is the only object that is defined. 39 20. 20 [](https://daily.dev/posts/linux-for-hackers-basics-for-cybersecurity-beginners--evmty-sh "Linux for Hackers – Basics for Cybersecurity Beginners") Article freeCodeCamp · 4y Linux for Hackers – Basics for Cybersecurity Beginners The Linux kernel was created by Linus Torvalds in 1991\. Each combination of customisations is called a distribution or distro for short. Each of them has been optimised for a specific purpose, or just for fun. Another alternative is to install Steam, or better still, SteamOS if you are a gamer with a flair for Linux. The Linux OS has a directory tree. 36 1 21. 21 [](https://daily.dev/posts/how-to-accept-payments-with-react-and-stripe-mlbscsndq "How to Accept Payments with React and Stripe") Article freeCodeCamp · 4y How to Accept Payments with React and Stripe Stripe Checkout is an all-in-one tool that streamlines and simplifies the process of checking out for us as developers. In this tutorial, you'll take a look at how to set up Stripe checkout to accept credit card, Apple Pay and Google Pay payments in our React apps. Here, we are loading the publishable key from a.env file. The user will be navigated to the page. 34 1 22. 22 [](https://daily.dev/posts/the-java-handbook-learn-java-programming-for-beginners-cf1reqi5u "The Java Handbook – Learn Java Programming for Beginners") Article freeCodeCamp · 4y The Java Handbook – Learn Java Programming for Beginners The Java Handbook - Learn Java Programming for Beginners Java has been around since the 90s. You can use Java to build servers, create desktop applications, games, mobile applications and more. The hello world program is probably the most basic executable Java program that you can possibly write. To understand why, click on the three dots in the list of files and clicking on the Show hidden files option. 33 2 23. 23 [](https://daily.dev/posts/how-to-authenticate-your-react-app-with-passport-js-mzwic0axc "How to Authenticate Your React App with Passport.js") Article freeCodeCamp · 4y How to Authenticate Your React App with Passport.js How to Authenticate Your React App with Passport.js is a major part of any serious React application. There are dozens of authentication solutions to choose from today, many of which come with a price tag. In this tutorial, we take a look at how you can add authentication to your React apps for free using the industry How to Sign Up Users with PassPort.js. 26 [See all freeCodeCamp archives](/sources/freecodecamp/best-of) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@graph":[{"@type":"CollectionPage","@id":"https://daily.dev/sources/freecodecamp/best-of/2022/09#page","url":"https://daily.dev/sources/freecodecamp/best-of/2022/09","name":"Best freeCodeCamp Posts — September 2022","description":"The most upvoted freeCodeCamp posts from September 2022, curated by the daily.dev community.","isPartOf":{"@type":"WebSite","url":"https://daily.dev"}},{"@type":"ItemList","@id":"https://daily.dev/sources/freecodecamp/best-of/2022/09#items","numberOfItems":23,"itemListElement":[{"@type":"ListItem","position":1,"url":"https://daily.dev/posts/how-to-prepare-for-react-interviews-front-end-technical-interview-guide-ez0ekqd4i","name":"How to Prepare for React Interviews – Front-End Technical Interview Guide"},{"@type":"ListItem","position":2,"url":"https://daily.dev/posts/top-30-react-interview-questions-and-concepts-i5ejdm-y","name":"Top 30 React Interview Questions and Concepts"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/code-a-minecraft-clone-using-react-and-three-js-ha7-dk06","name":"Code a Minecraft Clone Using React and Three.js"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/how-to-lazy-load-images-in-react--5d2gcr0k","name":"How to Lazy Load Images in React"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/best-practices-for-scaling-your-node-js-rest-apis-4nu2ywmmo","name":"Best Practices for Scaling Your Node.js REST APIs"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/how-to-animate-your-react-apps-with-1-line-of-code-lssw-tv0h","name":"How to Animate Your React Apps with 1 Line of Code"},{"@type":"ListItem","position":7,"url":"https://daily.dev/posts/how-the-javascript-dom-works-a-practical-tutorial-cbckwxrca","name":"How the JavaScript DOM Works – A Practical Tutorial"},{"@type":"ListItem","position":8,"url":"https://daily.dev/posts/open-source-for-developers-a-beginner-s-handbook-to-help-you-start-contributing-ji627p02b","name":"Open Source for Developers – A Beginner's Handbook to Help You Start Contributing"},{"@type":"ListItem","position":9,"url":"https://daily.dev/posts/machine-learning-for-everybody-bsrxfmlqy","name":"Machine Learning for Everybody"},{"@type":"ListItem","position":10,"url":"https://daily.dev/posts/parameters-vs-arguments-in-javascript-what-s-the-difference--dreooet26","name":"Parameters vs Arguments in JavaScript – What's the Difference?"},{"@type":"ListItem","position":11,"url":"https://daily.dev/posts/javascript-dom-tutorial-how-to-build-a-calculator-app-in-js-fdxabxizb","name":"JavaScript DOM Tutorial – How to Build a Calculator App in JS"},{"@type":"ListItem","position":12,"url":"https://daily.dev/posts/learn-jenkins-by-building-a-ci-cd-pipeline-il5nvbqeo","name":"Learn Jenkins by Building a CI/CD Pipeline"},{"@type":"ListItem","position":13,"url":"https://daily.dev/posts/authentication-vs-authorization-what-s-the-difference--xy-j-cis0","name":"Authentication vs Authorization – What's the Difference?"},{"@type":"ListItem","position":14,"url":"https://daily.dev/posts/how-to-write-a-good-technical-tutorial-mth0q-3o4","name":"How to write a Good Technical Tutorial"},{"@type":"ListItem","position":15,"url":"https://daily.dev/posts/what-is-tailwind-css-a-beginner-s-guide-owwhuxmq9","name":"What is Tailwind CSS? A Beginner's Guide"},{"@type":"ListItem","position":16,"url":"https://daily.dev/posts/the-javascript-concepts-you-should-know-before-learning-react-g-abime5n","name":"The JavaScript Concepts You Should Know Before Learning React"},{"@type":"ListItem","position":17,"url":"https://daily.dev/posts/how-to-code-a-2d-game-using-javascript-html-and-css-kxi7fujir","name":"How to Code a 2D Game Using JavaScript, HTML, and CSS"},{"@type":"ListItem","position":18,"url":"https://daily.dev/posts/intro-to-deno-guide-for-beginners-v1r8wijrn","name":"Intro to Deno – Guide for Beginners"},{"@type":"ListItem","position":19,"url":"https://daily.dev/posts/oop-meaning-what-is-object-oriented-programming--bk26ssjws","name":"OOP Meaning – What is Object-Oriented Programming?"},{"@type":"ListItem","position":20,"url":"https://daily.dev/posts/linux-for-hackers-basics-for-cybersecurity-beginners--evmty-sh","name":"Linux for Hackers – Basics for Cybersecurity Beginners"},{"@type":"ListItem","position":21,"url":"https://daily.dev/posts/how-to-accept-payments-with-react-and-stripe-mlbscsndq","name":"How to Accept Payments with React and Stripe"},{"@type":"ListItem","position":22,"url":"https://daily.dev/posts/the-java-handbook-learn-java-programming-for-beginners-cf1reqi5u","name":"The Java Handbook – Learn Java Programming for Beginners"},{"@type":"ListItem","position":23,"url":"https://daily.dev/posts/how-to-authenticate-your-react-app-with-passport-js-mzwic0axc","name":"How to Authenticate Your React App with Passport.js"}]},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Sources","item":"https://daily.dev/sources"},{"@type":"ListItem","position":3,"name":"freeCodeCamp","item":"https://daily.dev/sources/freecodecamp"},{"@type":"ListItem","position":4,"name":"Best of","item":"https://daily.dev/sources/freecodecamp/best-of"},{"@type":"ListItem","position":5,"name":"September 2022"}]}]} ```