Skip to main content

Posts

Showing posts from April, 2024

Next.js vs React – What's the difference?

Curriculum for the course Next.js vs React – What's the difference? What's the difference between Next.js and React? Learn more about frameworks and libraries and when to use React, Next, and Vite. Learn data fetching mechanisms, rendering strategies, how to build performant apps, SEO techniques, and more. Course created by @Kulkarniankita FREE Cheatsheet with all the links and resources shared in the course: https://bit.ly/nextjs-react-cheatsheet (to help you follow along) Ankita's upcoming workshop: https://bit.ly/nextjsworkshop-freecodecamp ⭐️ Contents ⭐️ ⌨️ (0:00:00) What is this Course About? and What will you learn? ⌨️ (0:01:28) Download the Free Cheatsheet to follow along ⌨️ (0:02:03) Upcoming Next.js Workshop ⌨️ (0:03:05) Library vs Framework ⌨️ (0:05:11) React vs Next.js ⌨️ (0:07:58) SPA vs SSG (Single Page App vs Static Site Generation ⌨️ (0:11:02) What is Vite? and How does it compare to Next.js? ⌨️ (0:13:18) What will be building? ⌨️ (0:15:23) Start a ...

Intro to AI Engineering - OpenAI JavaScript Tutorial

Curriculum for the course Intro to AI Engineering - OpenAI JavaScript Tutorial This crash course will get you up-to-speed on how build AI-powered web apps using the GPT-4 and DALL·E APIs. You'll build and deploy an app you can add to your portfolio to impress your future employer. Interactive course version here: https://scrimba.com/links/intro-to-ai-engineering The course was created by Scrimba instructors Tom Chant, Per Borgen and Guil Hernandez. Follow Scrimba on YouTube here: https://www.youtube.com/c/Scrimba ⭐️ Code ⭐️ Download the code via the lessons on Scrimba: https://scrimba.com/links/intro-to-ai-engineering ⭐️ Contents ⭐️ 0:00:00 AI Engineering basics 0:03:52 The code so far 0:06:48 Polygon API sign-up & key 0:08:12 Get an OpenAI API Key 0:10:22 Overview of how the API works 0:13:42 An API call: OpenAI dependency 0:16:45 An API call: Instance and model 0:18:58 An API call: The messages array 0:25:12 A quick word about models 0:30:45 Prompt Engineering and a c...

Ben Awad is a 10x Programmer [freeCodeCamp Podcast #120]

Curriculum for the course Ben Awad is a 10x Programmer [freeCodeCamp Podcast #120] On this week's episode of the podcast, freeCodeCamp founder Quincy Larson interviews Ben Awad, a game developer who creates developer tutorials on YouTube and TikTok. I hope you enjoy our conversation. Can you guess what bass line I'm playing on my bass during the intro? It's from a 1979 song. Be sure to follow The freeCodeCamp podcast in your favorite podcast app. And share this podcast with a friend. Let's inspire more folks to learn to code and build careers for themselves in tech. Also, I want to thank the 8,983 kind people who support our charity each month, and who make this podcast possible. You can join them and support our mission at: https://www.freecodecamp.org/donate Links we talk about during the interview: Ben's game, Void Pet on Android and iOS (Built in React Native): https://voidpet.com/ XKCD coming on "Real Programmers" that Quincy mentions: http...

TypeScript Platformer Game Tutorial – Kirby Clone

Curriculum for the course TypeScript Platformer Game Tutorial – Kirby Clone Improve your TypeScript skills by building a fun Kirby game clone. Learn how to use Kaboom.js to create a 2d platformer game based on the classic video game. Code: https://github.com/JSLegendDev/Kirby-like-ts Live demo & download link for assets: https://jslegend.itch.io/kirby-like-platformer-asset-pack Download Tiled here : https://www.mapeditor.org/ ✏️ Course created by @JSLegendDev ⭐️ Contents ⭐️ ⌨️ (0:00:00) Intro & Setup ⌨️ (0:08:32) Loading assets ⌨️ (0:14:42) Drawing the level in Tiled ⌨️ (0:29:53) Creating the level scene ⌨️ (0:34:07) Implementing logic for displaying the level ⌨️ (0:54:29) Implementing logic for player and enemies ⌨️ (1:57:15) Conclusion ⌨️ (1:58:11) Bonus : How to export your game 🎉 Thanks to our Champion and Sponsor supporters: 👾 davthecoder 👾 jedi-or-sith 👾 南宮千影 👾 Agustín Kussrow 👾 Nattira Maneerat 👾 Heather Wcislo 👾 Serhiy Kalinets 👾 Justin Hual 👾 Otis Mo...

Webflow Tutorial for Beginners – No-Code Web Design

Curriculum for the course Webflow Tutorial for Beginners – No-Code Web Design Learn Webflow from a Webflow certified expert agency owner. In this Webflow course you'll learn how to build a landing page without writing a single line of code and only using Webflow's core features. You'll also learn about Webflow SEO, animations, plans & pricing. Download Design File: https://bit.ly/42CHCCm Course created by @tweakdesigns. Hire him here: https://bit.ly/49aQ3qQ ⭐️ Contents ⭐️ ⌨️ (0:00:00) Web Design Basics ⌨️ (0:03:36) Webflow Basics ⌨️ (0:10:35) Components/Symbols in Webflow ⌨️ (0:11:28) Variables in Webflow ⌨️ (0:13:25) Assets/Images ⌨️ (0:13:35) Webflow CMS ⌨️ (0:14:03) Users in Webflow ⌨️ (0:14:12) E-commerce in Webflow ⌨️ (0:15:13) Add Pages/Folder in Webflow ⌨️ (0:15:25) Style Panel ⌨️ (0:16:24) Layouts - CSS Grid & Flexbox ⌨️ (0:20:22) Typography ⌨️ (0:20:31) Backgrounds ⌨️ (0:21:13) Borders & Radius ⌨️ (0:21:58) Effects ⌨️ (0:22:43) Element Settings ⌨...

Build a Google Photos Clone with Next.js and Cloudinary – Tutorial

Curriculum for the course Build a Google Photos Clone with Next.js and Cloudinary – Tutorial Learn how to use Next.js and Cloudinary to build a Google Photos Clone. Your app will be able to tranfrom and enhance the images. ✏️ Colby Fayock created this coruse. https://colbyfayock.com/ 🔗 Starter Template: https://github.com/colbyfayock/demo-photo-library-starter 🔗 Bonus Credits & Background Removals: https://cld.media/freecodecamp 🔗 Next Cloudinary: https://next.cloudinary.dev/ 🔗 Photobox: https://www.photobox.dev/ Cloudinary provided a grant to make this course possible. ⭐️ Contents ⭐️ ⌨️ (0:00:00) Introduction ⌨️ (0:03:00) Set up dev environment and app ⌨️ (0:10:13) Media gallery ⌨️ (1:08:01) Media viewer ⌨️ (1:20:14) Image enhancements ⌨️ (1:55:07) Saving images ⌨️ (2:51:34) Create collage ⌨️ (2:51:34) Conclusion 🎉 Thanks to our Champion and Sponsor supporters: 👾 davthecoder 👾 jedi-or-sith 👾 南宮千影 👾 Agustín Kussrow 👾 Nattira Maneerat 👾 Heather Wcislo 👾 Serhiy K...

Intuitive SQL For Data Analytics - Tutorial

Curriculum for the course Intuitive SQL For Data Analytics - Tutorial Learn SQL for analytics. Learn both the theory and the practice so you can confidently solve hard SQL challenges on your own. No previous experience required and you'll do everything in your browser using BigQuery. Course resources: https://miniature-icon-2cc.notion.site/Intuitive-SQL-For-Analytics-65241f69e06446d5bb0a7de272fb5dab Created by @vladdata741 ⭐️ Contents ⭐️ ⌨️ (00:00:00) Introduction ⌨️ (00:04:42) Syllabus & resources ⌨️ (00:09:04) Meet SQL! ⌨️ (00:10:30) Types of SQL statements ⌨️ (00:12:20) Why BigQuery ⌨️ (00:13:27) How to setup Google Cloud ⌨️ (00:17:02) How to avoid Google Cloud charges ⌨️ (00:22:11) Introduction to our data ⌨️ (00:23:16) How data is organized in BigQuery ⌨️ (00:26:53) Loading our data in BigQuery ⌨️ (00:30:09) The BigQuery Interface ⌨️ (00:37:54) Running our first query ⌨️ (00:46:20) How SQL organizes data ⌨️ (00:54:32) The SQL statement ⌨️ (00:56:05) The three orde...

CTO Andrew Brown on DevOps + Cloud Certification Exams [freeCodeCamp Podcast #120]

Curriculum for the course CTO Andrew Brown on DevOps + Cloud Certification Exams [freeCodeCamp Podcast #120] On this week's episode of the podcast, freeCodeCamp founder Quincy Larson interviews Andrew Brown, a CTO-turned co-founder of ExamPro.co. Andrew created this cloud certification exam prep website with another Andrew – also from Canada, who also loves Star Trek. We talk about Andrew's early career fixing computers in the 90s, and his early freelance web development work. These ultimately lead to jobs and promotions that leveled him up to CTO. Andrew also shares his advice to devs who want to learn DevOps and Cloud Engineering, and which certs to prioritize. Andrew suffers from Muscle Tension Dysphonia, a disease that causes voice loss. He shares how he's using AI tools to get around this. Andrew also talks about his love of Tetris Attack (also known as Panel de Pon or Pokémon Puzzle League). He built a frame-perfect port for competitive online play. And of co...

WebSockets Beginners Tutorial with Socket.IO

Curriculum for the course WebSockets Beginners Tutorial with Socket.IO Learn how to implement WebSockets with Socket.IO. WebSockets provide a way for a web browser and a server to communicate with each other continuously without having to close the connection after each exchange. This makes it ideal for real-time applications, like live chat or gaming, where you need quick back-and-forth communication. Course developed by @CybernaticoByNishant Code: https://github.com/nishant-666/Multiplayer-dashboard-using-websockets 🎉 Thanks to our Champion and Sponsor supporters: 👾 davthecoder 👾 jedi-or-sith 👾 南宮千影 👾 Agustín Kussrow 👾 Nattira Maneerat 👾 Heather Wcislo 👾 Serhiy Kalinets 👾 Justin Hual 👾 Otis Morgan 👾 Oscar Rahnama -- Learn to code for free and get a developer job: https://www.freecodecamp.org Read hundreds of articles on programming: https://freecodecamp.org/news Watch Online Full Course: WebSockets Beginners Tutorial with Socket.IO Click Here to watch on Yo...

RAG From Scratch – Tutorial from LangChain Engineer

Curriculum for the course RAG From Scratch – Tutorial from LangChain Engineer Learn how to implement RAG from scratch from a LangChain software engineer. This course teaches you how to use RAG to combine custom data with LLMs. 💻 Code: https://github.com/langchain-ai/rag-from-scratch ✏️ Course created by Lance Martin, PhD. Lance on X: https://twitter.com/rlancemartin ⭐️ Course Contents ⭐️ ⌨️ (0:00:00) Overview ⌨️ (0:05:53) Indexing ⌨️ (0:10:40) Retrieval ⌨️ (0:15:52) Generation ⌨️ (0:22:14) Query Translation (Multi-Query) ⌨️ (0:28:20) Query Translation (RAG Fusion) ⌨️ (0:33:57) Query Translation (Decomposition) ⌨️ (0:40:31) Query Translation (Step Back) ⌨️ (0:47:24) Query Translation (HyDE) ⌨️ (0:52:07) Routing ⌨️ (0:59:08) Query Construction ⌨️ (1:05:05) Indexing (Multi Representation) ⌨️ (1:11:39) Indexing (RAPTOR) ⌨️ (1:19:19) Indexing (ColBERT) ⌨️ (1:26:32) CRAG ⌨️ (1:44:09) Adaptive RAG ⌨️ (2:12:02) Is RAG Really Dead? 🎉 Thanks to our Champion and Sponsor supporters: 👾 d...

Data Science Essentials – Crash Course in A/B Testing with Case Study

Curriculum for the course Data Science Essentials – Crash Course in A/B Testing with Case Study In this applied Data Science Crash Course, we cover everything you need to know about A/B testing, from the concepts to the practical details they can apply in business. The course merges in-depth statistical analysis (think hypothesis testing, significance levels, and the nitty-gritty of pooled estimates, test statistics, p-values, and assessing statistical significance) with the kind of data science theories big tech firms rely on, all alongside practical Python tutorials for real-world test implementation. Plus, there's a real-life case study thrown in to help you understand the concepts more. ✏️ Course created by Tatev Karen Aslanyan. More from Tatev here: https://lunartech.ai/ ⭐️ Contents ⭐️ ⌨️ (0:00:00) Video Introduction ⌨️ (0:03:49) Introduction to Data Science and A/B Testing ⌨️ (0:05:38) Basics of A/B Testing in Data Science ⌨️ (0:07:06) Key Parameters of A/B Testing for ...

Digital Ocean Tutorial – Deploy Django and Other Frameworks

Curriculum for the course Digital Ocean Tutorial – Deploy Django and Other Frameworks Learn how to deploy to Digital Ocean. You'll learn to deploy Django projects but the steps are similar to deploy projects built with other frameworks. The server will run on Ubuntu 22.04, and you will learn how to use technologies like Nginx, Supervisor, Git, Gunicorn, Postresql and some more. ✏️ Course developed by @CodeWithStein Sign up for Digital Ocean: https://m.do.co/c/d3cdd4293e67 ⭐️ Contents ⭐️ ⌨️ (00:00) Introduction ⌨️ (01:21) Create account ⌨️ (02:15) Create server ⌨️ (07:53) Install software ⌨️ (11:52) Configure Postgresql ⌨️ (15:56) Users and environment ⌨️ (19:41) Requirements.txt ⌨️ (22:26) Separate settings file ⌨️ (24:01) Introducing Git ⌨️ (31:36) Environmental variables ⌨️ (33:16) Init database ⌨️ (36:46) Configure Gunicorn ⌨️ (45:25) Configure Supervisor ⌨️ (48:44) Configure Nginx ⌨️ (57:38) SSL / Let's Encrypt ⌨️ (59:26) Repeat procedure 🎉 Thanks to our Champion...

CSS Artist Kass Moreno – freeCodeCamp Podcast #119

Curriculum for the course CSS Artist Kass Moreno – freeCodeCamp Podcast #119 On this week's episode of the podcast, freeCodeCamp founder Quincy Larson interviews Kass Moreno, a Senior Front End Developer and CSS Artist. Kass started learning coding at age 28 and has since built a reputation as one of the most skilled artists who work with CSS. We talk about: Her childhood in Mexico and in Texas Making the hard decision to drop out of architecture school Her dreadful years working as a salesperson Learning from freeCodeCamp and doing the 100DaysOfCode challenge Getting freelance clients and expanding her skills Her rapid career growth as a developer Can you guess what bass line I'm playing on my bass during the intro? It's a 1982 pop classic. Be sure to follow The freeCodeCamp podcast in your favorite podcast app. And share this podcast with a friend. Let's inspire more folks to learn to code and build careers for themselves in tech. Also, I want to thank the 8,...

1-Click AI Web Development Tutorial - Turn Figma Designs into Working Code using AI

Curriculum for the course 1-Click AI Web Development Tutorial - Turn Figma Designs into Working Code using AI Learn how to turn Figma designs into code using AI. In this course, you will learn how to easily create and deploy frontend code starting with just a design. ✏️ Course developed by @AniaKubow Sample Figma design to follow along: https://www.figma.com/community/file/1344907822759018861/localhost-website Get started with Locofy: https://www.locofy.ai/ 🏗️ Locofy provided a grant to make this course possible. ⭐️ Contents ⭐️ ⌨️ (0:00:00) Introduction ⌨️ (0:01:54) What is Figma? ⌨️ (0:02:22) The design ⌨️ (0:06:28) Locofy Lightning and LocoAI ⌨️ (0:25:18) Let’s build out our app! ⌨️ (0:40:45) Sync to GitHub ⌨️ (0:49:40) Create a Database ⌨️ (0:54:49) Create Authentication ⌨️ (1:28:20) Let’s deploy our app! 🎉 Thanks to our Champion and Sponsor supporters: 👾 davthecoder 👾 jedi-or-sith 👾 南宮千影 👾 Agustín Kussrow 👾 Nattira Maneerat 👾 Heather Wcislo 👾 Serhiy Kalinets...

Backend Development Course - Build 3 Projects

Curriculum for the course Backend Development Course - Build 3 Projects This video is a full project-based backend web development course. In this course, you will learn how to build 3 full backend web applications. ✏️ Course developed by Code With Tomi. Check out his channel: https://www.youtube.com/c/CodeWithTomi Backend Mastery Course - https://backendmastery.com/ Projects Built: 1. AI Web App 💻 Github: https://github.com/tomitokko/ai-blog-article-generator 2. Netflix Clone 💻 Github: https://github.com/tomitokko/django-netflix-clone 3. Spotify Clone 💻 Github: https://github.com/tomitokko/spotify-clone 🔗 API Link: https://rapidapi.com/DataFanatic/api/spotify-scraper ⭐️ Course Contents ⭐️ ⌨️ (0:00:00) Intro ⌨️ (0:01:30) AI Web App ⌨️ (3:07:35) Netflix Clone ⌨️ (6:11:33) Spotify Clone - Part 1 ⌨️ (6:33:25) Spotify Clone - Part 2 ⌨️ (6:55:45) Spotify Clone - Part 3 ⌨️ (9:50:21) Spotify Clone - Part 4 ⌨️ (10:07:48) Outro 🎉 Thanks to our Champion ...

Indie Game Dev Jabrils talks AI & Anime [freeCodeCamp Podcast #118]

Curriculum for the course Indie Game Dev Jabrils talks AI & Anime [freeCodeCamp Podcast #118] On this week's episode of the podcast, freeCodeCamp founder Quincy Larson interviews Jabril. He's an indie game developer who's building a turn-based fighting game called Ultrabouters. Jabril has developed tons of other games as well. He runs the popular Jabrils gamedev focused-YouTube. He's also published a 5-hour introduction to programming course on freeCodeCamp. We talk about: - Jabril's advice to gamedevs who want to make a career out of building video games - How Jabril got into gamedev as a kid when he got a copy of GameMaker - Jabril's career working at a comedy club and a radio station - The anime that Jabril's been working on for years - Why Jabril puts an "s" at the end of his name Can you guess what bass line I'm playing on my bass during the intro? It's a 2009 song that became popular in the 2010's by being associated w...

React Router v6 – Full Course

Curriculum for the course React Router v6 – Full Course Learn how to use React Router. You'll learn about setting up a basic routes, protecting authenticated routes, custom route transitions and more. Course created by @CounterSyntax 💻 Starter Project/Boilerplate code: github.com/Kolosafo/git-explorer-starter 💻 Git Explorer Final: https://github.com/Kolosafo/git-explorer-final ⭐️ Contents ⭐️ ⌨️ (0:00:00) Course Overview ⌨️ (0:02:23) Introduction To React Router ⌨️ (0:05:08) Project Overview ⌨️ (0:07:01) Project Setup ⌨️ (0:09:23) Installing React Router ⌨️ (0:10:33) Setting up React Router ⌨️ (0:14:11) Introduction to Routing ⌨️ (0:20:37) Boilerplate code ⌨️ (0:21:23) Adding a new Route ⌨️ (0:22:12) How to Navigate between Pages ⌨️ (0:25:01) Nested Routes ⌨️ (0:31:37) Creating a custom "Not Found" page ⌨️ (0:35:30) Dynamic Routing ⌨️ (0:43:34) Programmatic Navigation ⌨️ (0:53:27) Route Guarding ⌨️ (1:02:45) Navbar Adjustment ⌨️ (1:06:07) Navigation Transition A...

Build a Dev Portfolio as a 2D Game – JavaScript Course

Curriculum for the course Build a Dev Portfolio as a 2D Game – JavaScript Course Learn how to use Kaboom.js to create a 2d game that is actually a developer portfolio. This is a creative way to show off your skills. Live demo: https://jslegenddev.github.io/portfolio/ Source code: https://github.com/JSLegendDev/2d-portfolio-kaboom Map files (map.json + map.png): https://github.com/JSLegendDev/2d-portfolio-kaboom/tree/master/public Spritesheet: https://github.com/JSLegendDev/2d-portfolio-kaboom/blob/master/public/spritesheet.png Fonts: https://datagoblin.itch.io/monogram Tiled software: https://mapeditor.org Substack post explaining how to implement mobile controls : https://jslegenddev.substack.com/p/how-to-implement-player-controls Course developed by @JSLegendDev ⭐️ Contents ⭐️ ⌨️ (0:00:00) Intro ⌨️ (0:03:35) Setup ⌨️ (0:16:40) Loading assets ⌨️ (0:19:36) How to use Tiled to draw maps ⌨️ (0:36:23) Writing logic to display map ⌨️ (0:45:02) Creating the player ⌨️ (0:52:13) Wri...

Understanding AI from Scratch – Neuaral Networks Without Libraries Course

Curriculum for the course Understanding AI from Scratch – Neuaral Networks Without Libraries Course Understanding AI from Scratch – Neuaral Networks Without Libraries Course Learn the fundamentals of Neural Networks by building one from scatch without libraries. You'll manually tweak network parameters to teach a car how to drive within a specially crafted playground. Dr. Radu has over a decade of experience with machine learning and AI, and he emphasizes the importance of revisiting basics in an era of easy-to-use complex models. You will have homework assignments which you can discuss with Radu on his Discord: discord.gg/gJFcF5XVn9 ✏️ Course developed by @Radu 🏆 Win prizes by following along: https://youtu.be/EhJ7qD5HwpY 🚗 THE PLAYGROUND: https://radufromfinland.com/projects/aiCarPlayground/?s=default 🚙 HELP COLLECT DATA BY RACING: https://radufromfinland.com/projects/aiRacer ⭐ OTHER LINKS ⭐ Phase 1 – Self-Driving Car with JavaScript: https://youtu.be/Rs_rAxEsAvI P...