Welcome to The FOSS Club's ultimate resource pack for beginners in tech! This guide covers various areas of technology, providing curated resources with actual links for each field. Whether you're interested in programming languages, game development, web development, or other tech domains, you'll find valuable learning materials here.
- Programming Languages
- Game Development
- Web Development
- DevOps
- Low-Level Programming
- Cybersecurity
- Web3 and Blockchain
- Data Structures and Algorithms
- App Development
- Book: Python Crash Course by Eric Matthes
- Video Course: Python for Everybody Specialization on Coursera
- Website: Official Python Documentation
- Project Ideas: Python Projects for Beginners
- Practice: LeetCode Python Challenges
- Book: Eloquent JavaScript by Marijn Haverbeke (free online)
- Video Course: JavaScript - The Complete Guide 2023
- Website: MDN Web Docs - JavaScript
- Project Ideas: 40 JavaScript Projects for Beginners
- Practice: JavaScript30 (30-day JS challenge)
- Book: Head First Java
- Video Course: Java Programming Masterclass
- Website: Oracle Java Tutorials
- Project Ideas: Java Projects for Beginners
- Practice: HackerRank Java Challenges
- Book: C++ Primer
- Video Course: Beginning C++ Programming
- Website: Learn C++
- Project Ideas: C++ Projects for Beginners
- Practice: Codeforces C++ Problems
- Book:"Learn C The Hard Way" by Zed A.Shaw(A beginer friendly guide with exercises)
- Video Course: "C Programming Tutorial for Beginners" by freeCodeCamp
- Website: TutorialsPoint C Programming
- Project ideas: C projects by StudyTonight
- Practice: HackerRank C Challenges
- Book: "An introduction to Programming in Go" by Caleb Doxsey ( A begginer friendly book that covers Go basics)
- Video Course: "Learn Go Programming- Golang Tutorial for beginners" by freeCodeCamp
- Website: Tour of Go (Official Go Tour)
- Project Ideas: Golang Projects on GitHub
- Practice: Exercism - Go Track
- Website: Official documentation
- Video Course: Brackeys' Beginner Tutorial
- Text Course: Godot Docs Getting Started
- Practice Projects: 2D Project 3D Project
- Book: Unity in Action
- Video Course: Complete C# Unity Game Developer 2D
- Website: Unity Learn
- Project Ideas: Unity Game Ideas for Beginners
- Practice: Unity Asset Store
- Book: Unreal Engine 5 for Beginners
- Video Course: Unreal Engine 5 C++ Developer
- Website: Unreal Engine Documentation
- Project Ideas: 10 Unreal Engine Game Ideas
- Practice: Unreal Marketplace
The frontend is the part of a website or app that you can see and interact with directly. Think of it as the "face" of a website—the buttons you click, the text you read, and the images you admire, all without realizing there’s a whole other world of chaos happening behind the scenes. It’s built using HTML for structure (kind of like the bones), CSS for styling (the wardrobe department), and JavaScript to make things interactive (basically the special effects team). So, if websites were people, the frontend would be the stylish outfit, cool hairdo, and the friendly smile, while the backend is the stressed-out brain making sure it all works. Flowchart -> https://whimsical.com/frontend-DzSzpgNukYYVTQrrsSgEv
Resources(Generalised, you should refer them whenever you get stuck and whenever you lack ideas to build project)
- Documentation- https://www.w3schools.com/whatis/
- Book: Frontend Developer Handbook (free online)
- Video Course: The Web Developer Bootcamp
- Project Ideas: Frontend Mentor
- Practice: CSS Tricks
Now,lets focus on the stuff you need to learn inorder to build websites. If you prefer to learn step by step while building projects every time you finish a language or framework, then go ahead with the README file. This type of learning is known as project-based learning (PBL), which I highly emphasize.
- Video lecture: https://www.youtube.com/watch?v=HcOc7P5BMi4
- Build Projects(Playlist): https://www.youtube.com/playlist?list=PLPppPPmk0i3hZCNmbVtcP1hlwDKOdUFX9
Css -> CSS (Cascading Style Sheets) is like the interior decorator of the web—it takes the plain, boring structure that HTML gives you and makes it look amazing. Think of HTML as a house with just the walls and floors, and then CSS comes in, adds vibrant paint, stylish furniture, and cool lighting. After css try bootstrap, it is a css framework. What are Frameworks?? Frameworks are pre-built collections of code, tools, and best practices designed to streamline the development process by providing structure and organization. They come with ready-to-use components, built-in solutions for common tasks, and promote coding best practices, which helps developers create applications more efficiently.development gets easy by the help of frameworks.
- Video lecture: https://www.youtube.com/watch?v=HcOc7P5BMi4
- Build Projects(Playlist): https://www.youtube.com/playlist?list=PLPppPPmk0i3hZCNmbVtcP1hlwDKOdUFX9
Javascript -> JavaScript is a programming language that adds interactivity and dynamic features to websites. It takes a straightforward HTML and CSS setup and enhances it by enabling functionalities like clickable buttons, form validation, animations, and real-time updates. Without JavaScript, websites would be static and unable to respond to user actions.
- Video lecture: https://www.youtube.com/watch?v=pN6jk0uUrD8&list=PLlasXeu85E9cQ32gLCvAvr9vNaUccPVNP
- Build Projects: Build 5 -10 web applications in javascript. Ex- to do app,weather api ,tic tac toe game, clones with different names and push it on your github.
Frontend frameworks -> A frontend framework is a specialized toolkit designed to streamline the development of user interfaces for web applications. Frontend frameworks offer numerous advantages over using plain HTML, CSS, and JavaScript by providing pre-built components and libraries that enhance efficiency and speed up development. They enforce a structured approach to coding, promoting organization and reusability, which is especially beneficial in larger projects or teams. Though you need very strong foundation in html,css and javascript to learn frontend frameworks, so first focus on them then move on to frameworks.
React(Recommended)
React is a JavaScript library for building user interfaces, particularly single-page applications. It allows developers to create reusable UI components and manage the application state effectively.
- Documentation: https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started
- Video lecture: https://www.youtube.com/watch?v=bMknfKXIFA8
- Projects: https://www.youtube.com/playlist?list=PL6QREj8te1P6wX9m5KnicnDVEucbOPsqR
Angular
Angular is a platform and framework for building single-page client applications using HTML and TypeScript. It offers a robust structure for developing dynamic web apps.
- Documentation: https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_getting_started
- Video lecture: https://www.youtube.com/watch?v=3qBXWUpoPHo
- Projects: https://www.youtube.com/playlist?list=PL7JmcZV0UQtU5ds45KRtSXA19sOntKTnI
Vue.js
Vue.js is a progressive JavaScript framework used for building user interfaces and single-page applications. It’s designed to be incrementally adoptable and can be integrated into projects easily.
- Documentation: https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started
- Video lecture: https://www.youtube.com/watch?v=1GNsWa_EZdw
- Projects: https://www.youtube.com/playlist?list=PL8p2I9GklV44m5tFH-zjCmTiHeq9GZrby
- Book: Node.js Design Patterns
- Video Course: The Complete Node.js Developer Course
- Website: Node.js Documentation
- Project Ideas: Backend Project Ideas
- Practice: Express.js Guide
- Book: The DevOps Handbook
- Video Course: DevOps Essentials
- Website: DevOps Roadmap
- Project Ideas: DevOps Projects
- Practice: Kubernetes Challenges
- Book: Computer Systems: A Programmer's Perspective
- Video Course: Nand to Tetris
- Website: OS Dev Wiki
- Project Ideas: Low-Level Programming Projects
- Practice: Linux From Scratch
- Book: The Web Application Hacker's Handbook
- Video Course: CompTIA Security+ Certification
- Website: OWASP
- Project Ideas: Cybersecurity Projects for Beginners
- Practice: TryHackMe
- Book: Mastering Ethereum (free on GitHub)
- Video Course: Blockchain Specialization
- Website: Ethereum.org Developers
- Project Ideas: Blockchain Project Ideas
- Practice: Solidity by Example
- Book: Introduction to Algorithms
- Video Course: Algorithms Specialization
- Website: GeeksforGeeks DSA
- Project Ideas: Data Structures and Algorithms Projects
- Practice: LeetCode
- Book: ILearn Microservices with Springboot
- Video Course: Engineering Digest
- Website: Spring Documentation
- Project Ideas: 20+ project Ideas
- Practice: Coderpad
- Extra Resource: Cheatsheet