JavaScript Game Development Course for Beginners
By freeCodeCamp.org
Published: Jul 28, 2022“
Learn to make 2D games with HTML, CSS & plain vanilla JavaScript, no frameworks and no libraries! From sprite animation to state management, in this series of projects, you will learn everything you need to make your own 2D animated games! We will go step by step explaining each technique on a small standalone codebase and then we will use everything we learned to make a single final game.
Course by Frank’s Laboratory. https://www.youtube.com/c/Frankslabor…
”
Tag: freecodecamp
[#Script #Coding] Figma Tutorial for UI Design – Course for Beginners
Figma Tutorial for UI Design – Course for Beginners
By freeCodeCamp.org
Published: Jan 05, 2022“
In this Figma course, you will learn how to use Figma for UI Design. Figma is a vector graphics editor and prototyping tool.
Joseph Brendan developed this course. Check out his YouTube channel: https://www.youtube.com/channel/UCETwb_AzizmhID0RjKULnBA
Course Contents
- (0:00:00) Introduction
- (0:00:55) Creating A Figma Account
- (0:02:32) Creating & Naming A Figma Design File
- (0:04:47) Creating Shapes In Figma
- (0:07:16) Selection In Figma
- (0:12:02) Editing Shapes In Figma
- (0:36:14) Introduction To Typography In Figma
- (1:01:41) Design Tree In Figma
- (1:06:43) First Design Task
- (1:20:44) Colors In Figma
- (1:44:22) Drawing Tools In Figma
- (1:49:20) Margin And Padding In UI UX Design
- (1:56:08) Figma AutoLayout
- (2:13:48) Formatting Principles In Figma
- (2:34:32) Figma Constraints And Resizing
- (2:51:11) Website Design in Figma
- (2:55:52) Jakob’s Principle Of Design
- (3:00:25) Introduction to Styles and components
- (3:25:29) Figma Component Variants
- (3:36:18) Layout Design & Configuration For Websites in Figma
- (3:40:07) Layout Grids In Figma
- (4:01:22) Introduction To Responsive Design
- (4:07:32) Material Design Guide
- (6:26:24) Introduction To Tailwind UI
- (6:28:24) Tailwind UI Design Project
- (7:25:45) Responsive Landing Page Design Project
- (8:45:54) Designing Mobile Apps
- (8:56:47) Iconography In Figma
- (9:02:32) Boolean Groups
- (9:09:52) Figma Tokens
- (9:18:29) Animation In Figma With Figmotion
- (9:36:29) Mobile Design Project
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news
And subscribe for new videos on technology every day: https://youtube.com/subscription_cent…
”
[#Script #Coding] Data Analytics Crash Course: Teach Yourself in 30 Days
Data Analytics Crash Course: Teach Yourself in 30 Days
By freeCodeCamp.org
Published: Jun 16, 2021“
The course is an introduction to Python-based data analytics.
You will get a basic understanding of the workings of Python to the point where you can confidently find and manipulate data sources and use a Jupyter environment to derive insights from your data.
Course Website: https://stories.thedataproject.net/
Code: https://github.com/dbclinton/jupyter_data
Course developed by David Clinton.
Contents
- (06:50) Installing Python and Jupyter
- (09:35) Working with the Jupyter environment
- (12:05) Finding data sources and using APIs
- (16:35) Working with data
- (24:45) Plotting data
- (32:45) Understanding data
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news
And subscribe for new videos on technology every day: https://youtube.com/subscription_cent…
”
[#Script #Coding] Code a 2D Game Engine using Java – Full Course for Beginners
Code a 2D Game Engine using Java – Full Course for Beginners
By freeCodeCamp.org
Published: Jan 03, 2022“
Learn how to program a 2D game engine from scratch using the Java Programming Language. You will use the game engine to create a Super Mario Clone but the engine can be used to create other games as well.
Code: https://github.com/codingminecraft/MarioYoutube/tree/master
Course created by GamesWithGabe. Check out his channel: https://www.youtube.com/channel/UCQP4…Part 2 (final hour of this course): https://youtu.be/roPRqEQZFu8
Course Contents
- (00:00:06) Introduction
- (00:07:54) Setting up the Window with LWJGL
- (00:25:20) Adding Event Listeners with GLFW
- (00:51:42) Creating a Scene Manager & Delta Time Variable
- (01:11:26) How OpenGL Graphics Programming Works
- (01:32:53) Drawing the First Square
- (02:02:56) Regexes and Shader Abstraction
- (02:24:25) Game Camera OpenGL
- (02:47:47) GLSL Shaders
- (03:08:45) Texture Loading in LWJGL3
- (03:36:02) Entity Component System
- (04:06:25) Batch Rendering in LWJGL3
- (04:50:00) Resource Management in LWJGL3
- (05:05:30) Texture Batching
- (05:38:48) Spritesheets
- (06:01:12) Dirty Flags in Rendering
- (06:23:17) Alpha Blending and Z-Indexing
- (06:38:56) Integrating ImGui
- (07:01:56) ImGui Fonts and Scene Integration
- (07:19:43) Serialization with Gson
- (07:42:48) Deserialization with Gson
- (08:06:03) Exposing Variables to the Level Editor
- (08:25:29) Converting Screen Coords to World Coords
- (08:49:27) Drag ‘N Drop Level Editor
- (09:15:25) Debug Drawing Functions
- (09:47:35) Snap To Grid Tool
- (10:10:25) Debug Drawing Boxes and Circles
- (10:28:58) Framebuffers in OpenGL
- (10:52:56) ImGui Docking in Java LWJGL
- (11:11:55) Adding a Game Viewport
- (11:34:51) Mouse Screen Coordinates to Game Viewport Coordinates
- (11:50:01) Pixel PERFECT Mouse Picking
- (12:23:39) Enabling Mouse Picking and Code Maintenance
- (12:35:16) Editor Camera Controls with Lerp
- (13:01:48) Coding Gizmos
- (13:31:03) Translate and Scale Gizmo
- (14:04:29) Properties Panel
- (14:33:53) Integrating JBox2D in our Engine
- (14:54:53) Event System and Box2D Physics
- (15:19:09) Adding an Engine Runtime (Play/Stop Buttons)
- (16:10:10) Refactoring and Physics
- (16:40:28) Font Rendering
- (16:43:34) Beginning Scene Hierarchy & ImGui Upgrade
- (17:00:38) Scene Panel Drag & Drop (ImGui)
- (17:18:31) Even More Bug Fixing
- (17:44:51) 2D Animations
- (18:18:29) Sounds with OpenAL
- (18:44:27) Improving the Editor
- (19:21:24) How to Use Box2D Physics
- (20:06:12) Pillbox Colliders and Player Controllers
- (20:45:32) Variable Length Jumps
- (21:25:28) Powerups
- (21:51:52) Goomba AI
- (22:29:59) Mario Pipes & Editor Improvements
- (23:01:59) Game Camera & Grid Lines
- (23:28:28) Mario Turtle AI
- (https://youtu.be/roPRqEQZFu8) Adding Flag Poles to Mario
- (https://youtu.be/roPRqEQZFu8) Fireballs and Bug Fixes
- (https://youtu.be/roPRqEQZFu8) The LAST Episode and Distributing your Game
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news
And subscribe for new videos on technology every day: https://youtube.com/subscription_cent…
”
[#Script #Coding] Build API Powered Dashboards – MongoDB, Discord and Mail API
Build API Powered Dashboards – MongoDB, Discord and Mail API
By freeCodeCamp.org
Published: Jun 24, 2022“
Build an API powered marketing dashboard using a low code approach. You will learn how to use Appsmith to easily create many tools that startups need. The dashboard will incorporate MongoDB, the SMTP API, and the Discord web hook.
Ania Kubów created this course. Check out her channel: https://www.youtube.com/aniakubow
Appsmith Github repo: https://GitHub.com/Appsmithorg/Appsmith
This course was made possible by a grant from Appsmith. Learn more about Appsmith: https://www.appsmith.com/
Course Contents
- (0:00:00) Introduction
- (0:01:34) Getting started with Appsmith
- (0:10:56) Connected to MongoDB
- (0:23:00) Adding data to Appsmith app
- (0:57:08) Create send messages page
- (1:27:56) Show different marketing lists
- (1:51:36) Implementing Discord web hook
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news
And subscribe for new videos on technology every day: https://youtube.com/subscription_cent…
”
[#Script #Coding] AutoCAD for Beginners – Full University Course
AutoCAD for Beginners – Full University Course
By freeCodeCamp.org
Published: Jan 24, 2022“
Learn basic architectural 2D drafting techniques using Autodesk Autocad in this complete university course. You will learn Autocad by creating architectural drawings for a small single-room cabin.
Gediminas Kirdeikis developed this course. He originally created the couse for Lund University and is now sharing it with freeCodeCamp. Check out his YouTube channel: https://www.youtube.com/channel/UCiRs…Course Contents
- (0:00:00) Part 1
- (1:45:40) Part 2
- (3:43:27) Part 3
Additional Resources / Useful Links
- Download AutoCAD free student version: https://www.autodesk.com/education/fr…
- Autocad basic commands PDF: https://lthdigital.files.wordpress.co…
- Laptop specification guidelines: https://lthdigital.files.wordpress.co…
- 2D linework library: https://pimpmydrawing.com/
”
[#Script #Coding] Learn React by Building an eCommerce Site – Tutorial
Learn React by Building an eCommerce Site – Tutorial
By freeCodeCamp.org
Published: Oct 27, 2021“
Learn React by building an e-Commerce application with Class Components.
You will learn component basics, rendering various items in components, parent-to-child component communication, lifecycle methods, forms, REST-API calls with JSON server, and basic routing.Source code: https://github.com/webuniversity/react-free-code-camp
This course was developed by Mr. Harsha Vardhan. Check out his Youtube channel: https://www.youtube.com/c/harshaglobal
Complete React course with Hooks and Redux by Harsha Vardhan:
https://www.udemy.com/course/react-fo…Course Contents
- (0:00:00) Introduction
- (0:03:45) What is React
- (0:12:52) Understanding Components
- (0:19:05) Create New React App
- (0:29:41) React React App From Scratch
- (0:44:19) Load Bootstrap
- (0:52:14) Create React Components
- (1:07:55) Add CSS Styles
- (1:11:10) Add Bootstrap NavBar
- (1:18:22) Fix Error – DOM property class
- (1:21:54) Nested Components
- (1:35:35) Render Expressions
- (1:41:31) Handle Events
- (1:47:11) Update Component State
- (1:51:58) Render List
- (2:00:13) Render Conditionally
- (2:05:53) Render Methods
- (2:13:46) Render Images
- (2:18:32) Render CSS Styles
- (2:25:19) Render CSS Classes
- (2:29:36) Pass Event Arguments
- (2:40:57) Render Child Components
- (2:49:58) Props
- (3:02:48) Props vs State
- (3:12:11) Props.Children
- (3:16:15) Handle Child Events
- (3:41:59) Delete Child Components
- (3:52:57) Life Cycle Phases of Components
- (3:57:22) Mounting Phase
- (4:07:45) Updating Phase
- (4:17:16) Unmounting Phase
- (4:22:10) Life Cycle of Child Components
- (4:30:02) Error Handling Phase
- (4:36:16) Basic Form
- (4:45:01) Two-Way Binding
- (4:56:36) Form Submit Button
- (5:04:51) HTTP Requests
- (5:18:09) Async and Await
- (5:25:28) Login Form with HTTP Request
- (5:34:00) Basic Routing
- (5:40:15) “404” Page
- (5:43:51) Switch
- (5:45:20) Link
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news
”
[#Script #Coding] Greedy Algorithms Tutorial – Solve Coding Challenges
Greedy Algorithms Tutorial – Solve Coding Challenges
By freeCodeCamp.org
Published: Jun 27, 2022“
Learn how to use greedy algorithms to solve coding challenges. Many tech companies want people to solve coding challenges during interviews and many of the challenges can be solved using a greedy algorithm. A greedy algorithm is any algorithm that follows the problem-solving heuristic of making the locally optimal choice at each stage.
Course from Tanishq Chaudhary. Check out his channel: https://www.youtube.com/c/TanishqChau…
Links to coding challenges on InterviewBit:
- Highest product: https://www.interviewbit.com/problems…
- Bulbs: https://www.interviewbit.com/problems…
- Disjoint intervals: https://www.interviewbit.com/problems…
- Largest permutation: https://www.interviewbit.com/problems…
- Meeting rooms: https://www.interviewbit.com/problems…
- Distribute candy: https://www.interviewbit.com/problems…
- Seats: https://www.interviewbit.com/problems…
- Assign mice to holes: https://www.interviewbit.com/problems…
- Majority element: https://www.interviewbit.com/problems…
- Gas station: https://www.interviewbit.com/problems…
Course contents
- (0:00:00) Greedy introduction
- (0:04:32) Bulbs
- (0:12:11) Highest product
- (0:17:08) Disjoint intervals
- (0:28:43) Largest permutation
- (0:38:30) Meeting rooms
- (0:49:25) Distribute candy
- (1:03:13) Seats
- (1:19:13) Assign mice to holes
- (1:24:19) Majority element
- (1:35:28) Gas station
- (1:52:39) End
”
[#Script #Coding] Automate with Python – Full Course for Beginners
Automate with Python – Full Course for Beginners
By freeCodeCamp.org
Published: Jun 20, 2022“
Learn how to automate your life with Python! You will learn how to automate boring and repetitive tasks such as creating an Excel report, sending text messages, extracting tables from websites, interacting with websites, and more. You will learn how to use a few different Python libraries to help with automation such as Path, Selenium, XPath, and more.
Source Code & Datasets: https://github.com/ifrankandrade/auto…
– Course from Frank Andrade. Check out his YouTube Channel: https://www.youtube.com/c/FrankAndrade5
– Automation Cheat Sheet: https://frankandrade.ck.page/44559e1ae7
– Frank’s 11-Hour Automation Course in Python: https://www.udemy.com/course/automate…
– Frank’s Discord Server: https://discord.gg/6xyQaj8bJKCourse Contents
- (0:00:00) Intro
- (0:00:31) Project #1 Table Extraction – Extract Tables from Websites
- (0:02:53) Table Extraction – Extract CSV Files from Websites
- (0:09:38) Table Extraction – Extract Tables from PDFs
- (0:13:06) Project #2 – Web Automation & Web Scraping – HTML Basics – Tags and Elements
- (0:20:57) Web Automation & Web Scraping – HTML Basics – Tree Structure
- (0:24:22) Web Automation & Web Scraping – XPath – Syntax, Functions and Operators
- (0:28:06) Web Automation & Web Scraping – XPath – Test Your XPath
- (0:33:38) Web Automation & Web Scraping – XPath – Special Characters and Syntax
- (0:38:17) Automate The News – Installing Selenium and ChromeDriver
- (0:40:34) Automate The News – Creating The Driver
- (0:44:46) Automate The News – Finding Elements
- (1:04:34) Automate The News – Exporting Data to a CSV File
- (1:12:34) Automate The News – Headless mode
- (1:18:18) Automate The News – Preparing Script to Be Run Everyday
- (1:30:17) Automate The News – Convert py to exe
- (1:37:18) Automate The News – Schedule Python Script with crontab (macOS)
- (1:42:16) Project #3 – Automate Excel Report – Create a Pivot Table with Python
- (1:49:42) Automate Excel Report – Add a Bar Chart
- (2:05:02) Automate Excel Report – Write Excel Formulas with Python
- (2:19:18) Automate Excel Report – Format Cells
- (2:23:04) Automate Excel Report – Convert Pivot Table to Excel Report
- (2:25:32) Automate Excel Report – Generate Excel Reports with One Click (py to exe)
- (2:33:22) Project #4 – Automate WhatsApp
”
[#Script #Coding] Learn HTML – Full Tutorial for Beginners (2022)
Learn HTML – Full Tutorial for Beginners (2022)
By freeCodeCamp.org
Published: Mar 08, 2022“
Learn HTML in this complete course for beginners. This is an all-in-one beginner tutorial to help you learn web development skills. This course teaches HTML5.
Dave Gray created this course. Check out his channel: https://www.youtube.com/davegrayteachescode
Code: https://github.com/gitdagray/html_courseCourse Contents
- (00:00:00) Intro
- (00:00:55) Chapter 1 – Getting Started
- (00:20:13) Chapter 2 – Head Element
- (00:29:02) Chapter 3 – Text Basics
- (00:49:45) Chapter 4 – List Types
- (00:59:55) Chapter 5 – Add Links
- (01:30:38) Chapter 6 – Add Images
- (02:00:58) Chapter 7 – Semantic Tags
- (02:24:53) Chapter 8 – Create Tables
- (02:40:42) Chapter 9 – Forms & Inputs
- (03:25:16) Chapter 10 – HTML Project
”
