--- title: Best freeCodeCamp posts — November 2022 | daily.dev description: The most upvoted freeCodeCamp posts from November 2022, curated by the daily.dev community. canonical: https://daily.dev/sources/freecodecamp/best-of/2022/11 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/sources/freecodecamp/best-of/2022/11 og:type: website og:site_name: daily.dev og:title: Best freeCodeCamp posts — November 2022 | daily.dev og:description: The most upvoted freeCodeCamp posts from November 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 — November 2022 1. 1 [](https://daily.dev/posts/typescript-for-react-developers-why-typescript-is-useful-and-how-it-works-mcyri5hoo "TypeScript for React Developers – Why TypeScript is Useful and How it Works") Article freeCodeCamp · 4y TypeScript for React Developers – Why TypeScript is Useful and How it Works The idea behind this article is to go through the basics of TS and understand the benefits of TypeScript. In the second section of this article, I will cover the specifics of TS with React. This should help you decide if you want those benefits or not. 155 9 2. 2 [](https://daily.dev/posts/programming-in-typescript-full-course-jukfds-7q "Programming in TypeScript – Full Course") Article freeCodeCamp · 4y Programming in TypeScript – Full Course TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. This is because TypeScript uses a static type system, which means that the type of a variable is checked before the code is executed. TypeScript can be used to develop large-scale JavaScript applications. 146 2 3. 3 [](https://daily.dev/posts/how-to-build-a-modern-documentation-site-with-vitepress-h-xqttlij "How to Build a Modern Documentation Site with VitePress") Article freeCodeCamp · 4y How to Build a Modern Documentation Site with VitePress VitePress is a simple and performant static site generator built on top of Vite that lets you create docs in a matter of minutes. VitePress powers some popular documentation sites like Vuejs, Vitest, faker.js, and Vite itself. 128 10 4. 4 [](https://daily.dev/posts/tailwind-css-landing-page-themes-for-busy-developers-iynn7dm1t "Tailwind CSS Landing Page Themes for Busy Developers") Article freeCodeCamp · 4y Tailwind CSS Landing Page Themes for Busy Developers Tailwind's library of free and paid resources makes it incredibly easy to build a professional-looking website. By default, it comes in light mode but it has a dark mode option that the website users/visitors can turn on and off as they please. Alternatively, you can purchase the entire TailwindUI toolkit that contains multiple themes and useful resources. 108 5 5. 5 [](https://daily.dev/posts/learn-css-responsive-web-design-study-guide-hekti-lwk "Learn CSS – Responsive Web Design Study Guide") Article freeCodeCamp · 4y Learn CSS – Responsive Web Design Study Guide Learn CSS - Responsive Web Design Study Guide Cascading Style Sheets (CSS) This study guide is filled with additional information, articles, and videos to help you understand the concepts better. The first part of the project reviews HTML elements and then moves onto CSS. This includes headings, paragraphs, images, links, and more. The body element contains all of the content for the web page. For more information, see the complete list of topics covered. 99 3 6. 6 [](https://daily.dev/posts/clear-code-how-to-write-code-that-is-easy-to-read-4e2mjyxdt "Clear Code – How to Write Code That Is Easy to Read") Article freeCodeCamp · 4y Clear Code – How to Write Code That Is Easy to Read This article is a follow up to a tweet I made on how I deal with my poor ability to remember code. We will discuss why you may want to write more legible code as opposed to short, concise code. 93 2 7. 7 [](https://daily.dev/posts/how-to-manage-state-in-react-tna5mpz7y "How to Manage State in React") Article freeCodeCamp · 4y How to Manage State in React The only time a React app will re-render is when state changes. Jack Herrington created this course to teach you all about React State Management. 82 4 8. 8 [](https://daily.dev/posts/microservices-and-software-system-design-course-wdrh6yxon "Microservices and Software System Design Course") Article freeCodeCamp · 4y Microservices and Software System Design Course A microservices architecture is a type of application architecture where the application is developed as a collection of services. The course will teach you about microservice architecture and distributed systems using a hands-on approach. 71 1 9. 9 [](https://daily.dev/posts/learn-full-stack-development-html-css-javascript-node-js-mongodb-q3lp4d6td "Learn Full Stack Development – HTML, CSS, JavaScript, Node.js, MongoDB") Article freeCodeCamp · 4y Learn Full Stack Development – HTML, CSS, JavaScript, Node.js, MongoDB Full Stack Development - HTML, CSS, JavaScript, Node.js, MongoDB Full stack development is a term used to describe the process of developing a complete website or application from start to finish. Full stack developers must have a deep understanding of both front-end and back-end web development. 65 3 10. 10 [](https://daily.dev/posts/solid-principles-for-programming-and-software-design-o118vilou "SOLID Principles for Programming and Software Design") Article freeCodeCamp · 4y SOLID Principles for Programming and Software Design SOLID is a mnemonic acronym that stands for the five design principles of Object-Oriented class design. These principles are meant to make object-oriented designs more understandable, flexible, and maintainable. In very plain terms, you want the objects of your subclasses to behave the same way as your superclass. A very common example is the rectangle, square scenario. 64 11. 11 [](https://daily.dev/posts/how-to-learn-the-linux-terminal-as-a-beginner-tips-and-examples-fmghlsi1e "How to Learn the Linux Terminal as a Beginner – Tips and Examples") Article freeCodeCamp · 4y How to Learn the Linux Terminal as a Beginner – Tips and Examples In 2017, I bought a new laptop and switched to Linux. I started learning terminal commands and keyboard shortcuts. In this article, I'll walk you through the experiences I had learning to handle file and folder operations in Linux. Before starting to use terminal, you need to get familiar with two commands. 61 12. 12 [](https://daily.dev/posts/the-best-backend-as-a-service-for-your-react-app-u5uufe7gz "The Best Backend as a Service for your React App") Article freeCodeCamp · 4y The Best Backend as a Service for your React App Firebase has dominated the backend-as-a-service space for many years, but Supabase has emerged as a great alternative. Supabase allows you to take your code and deploy it wherever you like. You can build your app, deploy it to Supabase's servers, or you can Deploy it to your own hosting service. 60 2 13. 13 [](https://daily.dev/posts/blockchain-for-beginners-tutorial-learn-to-code-smart-contracts-with-javascript-and-solidity-u9qhlgzrx "Blockchain for Beginners Tutorial – Learn to Code Smart Contracts with JavaScript and Solidity") Article freeCodeCamp · 4y Blockchain for Beginners Tutorial – Learn to Code Smart Contracts with JavaScript and Solidity The first time I tried to learn blockchain development, I felt overwhelmed. This tutorial you're reading is what I wish I could send back in time to myself. This will give you a strong foundation in blockchain development and set you up for success in coding your own smart contracts. 57 2 14. 14 [](https://daily.dev/posts/how-to-work-with-strings-in-javascript-tips-for-efficient-string-concatenation-dfeh5cu4s "How to Work with Strings in JavaScript – Tips for Efficient String Concatenation") Article freeCodeCamp · 4y How to Work with Strings in JavaScript – Tips for Efficient String Concatenation How to Work with Strings in JavaScript - Tips for Efficient String Concatenation is a string. This will dramatically increase the performance of your web applications, both on the frontend and backend. The default string concatenation algorithm is too inefficient and wastes a lot of memory. 44 5 15. 15 [](https://daily.dev/posts/hoisting-in-javascript-with-let-and-const-and-how-it-differs-from-var-rlqjh1eum "Hoisting in JavaScript with let and const – and How it Differs from var") Article freeCodeCamp · 4y Hoisting in JavaScript with let and const – and How it Differs from var Hoisting in JavaScript with let and const - and how it works with variables declared with. The variable is hoisted to the top of the global scope. This makes it possible to access the variable before the line it was declared, without errors. 42 6 16. 16 [](https://daily.dev/posts/how-to-generate-images-using-react-and-the-dall-e-2-api-react-and-openai-api-tutorial-klcdalwmq "How to Generate Images using React and the Dall-E 2 API – React and OpenAI API Tutorial") Article freeCodeCamp · 4y How to Generate Images using React and the Dall-E 2 API – React and OpenAI API Tutorial How to Generate images using React and the Dall-E 2 API - React and OpenAI API Tutorial. OpenAI just released its DALL-E API where users can generate custom images by just typing in a query. Let’s learn how you can integrate this into your React application to create your own application const openai = new OpenAIApi(configuration). Here is the whole code until now. 34 17. 17 [](https://daily.dev/posts/how-to-validate-urls-in-javascript-uu4p1g2cf "How to Validate URLs in JavaScript") Article freeCodeCamp · 4y How to Validate URLs in JavaScript A Uniform Resource Locator (URL) is what leads you to a page or file on the internet. All valid URLs follow certain patterns. So if you know those patterns, you can determine whether a URL is valid or not in your program and give feedback, throw an error, and so on. 31 18. 18 [](https://daily.dev/posts/how-to-deploy-your-react-app-using-cloudflare-pages-vercel-and-netlify-tu9hijhgt "How to Deploy Your React App Using Cloudflare Pages, Vercel, and Netlify") Article freeCodeCamp · 4y How to Deploy Your React App Using Cloudflare Pages, Vercel, and Netlify How to Deploy a React App with Cloudflare Pages, Vercel, and Netlify are the best ways to deploy your React application. You can deploy unlimited sites with unlimited bandwidth for free for free. Vercel is optimized for projects that are built with Next.js, including Create React App and Gatsby. 28 1 [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/11#page","url":"https://daily.dev/sources/freecodecamp/best-of/2022/11","name":"Best freeCodeCamp Posts — November 2022","description":"The most upvoted freeCodeCamp posts from November 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/11#items","numberOfItems":18,"itemListElement":[{"@type":"ListItem","position":1,"url":"https://daily.dev/posts/typescript-for-react-developers-why-typescript-is-useful-and-how-it-works-mcyri5hoo","name":"TypeScript for React Developers – Why TypeScript is Useful and How it Works"},{"@type":"ListItem","position":2,"url":"https://daily.dev/posts/programming-in-typescript-full-course-jukfds-7q","name":"Programming in TypeScript – Full Course"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/how-to-build-a-modern-documentation-site-with-vitepress-h-xqttlij","name":"How to Build a Modern Documentation Site with VitePress"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/tailwind-css-landing-page-themes-for-busy-developers-iynn7dm1t","name":"Tailwind CSS Landing Page Themes for Busy Developers"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/learn-css-responsive-web-design-study-guide-hekti-lwk","name":"Learn CSS – Responsive Web Design Study Guide"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/clear-code-how-to-write-code-that-is-easy-to-read-4e2mjyxdt","name":"Clear Code – How to Write Code That Is Easy to Read"},{"@type":"ListItem","position":7,"url":"https://daily.dev/posts/how-to-manage-state-in-react-tna5mpz7y","name":"How to Manage State in React"},{"@type":"ListItem","position":8,"url":"https://daily.dev/posts/microservices-and-software-system-design-course-wdrh6yxon","name":"Microservices and Software System Design Course"},{"@type":"ListItem","position":9,"url":"https://daily.dev/posts/learn-full-stack-development-html-css-javascript-node-js-mongodb-q3lp4d6td","name":"Learn Full Stack Development – HTML, CSS, JavaScript, Node.js, MongoDB"},{"@type":"ListItem","position":10,"url":"https://daily.dev/posts/solid-principles-for-programming-and-software-design-o118vilou","name":"SOLID Principles for Programming and Software Design"},{"@type":"ListItem","position":11,"url":"https://daily.dev/posts/how-to-learn-the-linux-terminal-as-a-beginner-tips-and-examples-fmghlsi1e","name":"How to Learn the Linux Terminal as a Beginner – Tips and Examples"},{"@type":"ListItem","position":12,"url":"https://daily.dev/posts/the-best-backend-as-a-service-for-your-react-app-u5uufe7gz","name":"The Best Backend as a Service for your React App"},{"@type":"ListItem","position":13,"url":"https://daily.dev/posts/blockchain-for-beginners-tutorial-learn-to-code-smart-contracts-with-javascript-and-solidity-u9qhlgzrx","name":"Blockchain for Beginners Tutorial – Learn to Code Smart Contracts with JavaScript and Solidity"},{"@type":"ListItem","position":14,"url":"https://daily.dev/posts/how-to-work-with-strings-in-javascript-tips-for-efficient-string-concatenation-dfeh5cu4s","name":"How to Work with Strings in JavaScript – Tips for Efficient String Concatenation"},{"@type":"ListItem","position":15,"url":"https://daily.dev/posts/hoisting-in-javascript-with-let-and-const-and-how-it-differs-from-var-rlqjh1eum","name":"Hoisting in JavaScript with let and const – and How it Differs from var"},{"@type":"ListItem","position":16,"url":"https://daily.dev/posts/how-to-generate-images-using-react-and-the-dall-e-2-api-react-and-openai-api-tutorial-klcdalwmq","name":"How to Generate Images using React and the Dall-E 2 API – React and OpenAI API Tutorial"},{"@type":"ListItem","position":17,"url":"https://daily.dev/posts/how-to-validate-urls-in-javascript-uu4p1g2cf","name":"How to Validate URLs in JavaScript"},{"@type":"ListItem","position":18,"url":"https://daily.dev/posts/how-to-deploy-your-react-app-using-cloudflare-pages-vercel-and-netlify-tu9hijhgt","name":"How to Deploy Your React App Using Cloudflare Pages, Vercel, and Netlify"}]},{"@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":"November 2022"}]}]} ```