Full Stack Development Course for Beginners | TheDevSpace
Want to build your own AI powered applications? Ready to start your career as a full stack developer?
🎉 You've come to the right place!
This course covers everything you need to master full-stack development, from fundamentals to frameworks, from concepts to real projects.
With 12 real-life projects, you will learn how to build simple calculators, weather apps, blogs, SaaS platforms, as well as your own AI apps.
To get started, you can subscribe below to get our free Full-Stack Developer Starter Kit ⬇️
The Starter Kit includes a crash course on HTML, CSS and JavaScript, as well as a set of cheatsheets and resources to kickstart your development journey.
Also follow us onwhere we share coding tips, cheatsheets, and quizzes regularly.
Introduction
Your full stack journey begins here. The following lessons explain some of the most fundamental concepts in full stack development.
HTML & CSS: Fundamentals
HTML and CSS are the two most fundamental building blocks of modern web applications. HTML describes the content while CSS defines their appearance.
- 1.1Preparations
- 1.2HTML Elements
- 1.3Text Elements
- 1.4Layout Elements
- 1.5Cascading Style Sheet
- 1.6Basic Selectors
- 1.7Advanced Selectors
- 1.8Colors
- 1.9Loading Font
- 1.10Font Customization
- 1.11Text Customization
- 1.12Text Spacing
- 1.13Text Alignment
- 1.14Functions
- 1.15@ Rules
- 1.16Links
- 1.17Lists
- 1.18Tables
- 1.19Forms
- 1.20Form Fields
- 1.21Media Files
- 1.22Aspect Ratio
- 1.23Object Fit
- 1.24Cursor & Scroll Behavior
HTML & CSS: Advanced Patterns
Layout techniques and other advanced CSS topics used to build larger applications.
- 2.1The Box Model
- 2.2Display Types
- 2.3Overflow
- 2.4Float
- 2.5Position
- 2.6The Column Layout
- 2.7The Grid Layout
- 2.8The Flexbox Layout
- 2.9Justify & Align
- 2.10Z index
- 2.11Visibility & Opacity
- 2.12Box Shadow
- 2.13Backgrounds
- 2.14Gradient
- 2.15Blend Modes
- 2.16Filters
- 2.17Transforms
- 2.18Transitions
- 2.19Animations
- 2.20Responsive Design
- 2.21Responsive Media & Text
- 2.22Responsive Layout
- 2.23Best Practices
- 2.24Recreating YouTubeProject
- 2.25CalculatorProject
JavaScript Basics
JavaScript was created to power interactivity on the web. Nowadays, it has grown into the foundation of many full stack web applications by running both in the browser and on the server.
- 3.1Introduction
- 3.2Basic Syntax
- 3.3Variables
- 3.4Data Types
- 3.5Numbers & BigInt
- 3.6Strings
- 3.7Boolean Values
- 3.8Undefined & Null
- 3.9Type Conversion
- 3.10If Statements
- 3.11Switch Statements
- 3.12While Loops
- 3.13For Loops
- 3.14Introducing Functions
- 3.15Variable Scope
- 3.16Arrays
- 3.17Mutating Array
- 3.18Searching Array
- 3.19Sorting Array
- 3.20Looping Array
- 3.21Objects
- 3.22Looping Object
- 3.23JSON
- 3.24Symbols
- 3.25Maps
- 3.26Sets
- 3.27Define Functions
- 3.28Function Arguments
- 3.29Rest Parameter & Spread Syntax
- 3.30Error Handling
Advanced JavaScript
Advanced JavaScript topics used to build larger applications.
- 4.1Pure Functions
- 4.2Functions as Value
- 4.3Higher Order Functions
- 4.4Function Factory
- 4.5Function Currying
- 4.6Function Wrapper
- 4.7Recursion
- 4.8Closure
- 4.9Methods
- 4.10Investigating "this"
- 4.11Losing "this"
- 4.12Constructor Functions
- 4.13Getters & Setters
- 4.14Prototypes Introduction
- 4.15Creating Prototypes
- 4.16Inspecting Prototypes
- 4.17Constructor with Prototype
- 4.18The Class Notation
- 4.19Class Inheritance
- 4.20Static Properties
- 4.21Private Properties
- 4.22Object Oriented Programming
- 4.23A Banking AppProject
- 4.24Working with Date
- 4.25The Math Object
- 4.26JavaScript Modules
- 4.27Throwing Errors
- 4.28Asynchronous Programming
- 4.29Promise
- 4.30Resolve Promise
- 4.31Promise Chaining
- 4.32Async & Wait
- 4.33Best Practices
JavaScript in the Frontend
Frontend-specific JavaScript topics and browser APIs.
- 5.1The DOM Tree
- 5.2Selecting Elements in the DOM
- 5.3DOM Navigation
- 5.4Changing Elements
- 5.5Adding Elements
- 5.6Removing Elements
- 5.7Event Handling
- 5.8Event Propagation
- 5.9Some Common Events
- 5.10Image Slider: Creating HTMLProject
- 5.11Image Slider: Adding Styles
- 5.12Image Slider: Adding Scripts
- 5.13Image Slider That "Slides"
- 5.14Regular Expressions
- 5.15Regex Flags
- 5.16Regex Matching Character Sets
- 5.17Regex Boundary
- 5.18Regex Groups & Quantifiers
- 5.19Regex Lookahead & Lookbehind
- 5.20Regex Related Methods
- 5.21CalculatorProject
Backend with Express.js
Express.js is a backend framework for Node.js and a key part of many full stack web applications. In this chapter, we'll explore how to build server-side logic and APIs to support dynamic frontend applications.
- 6.1Setting Up a Dev Environment
- 6.2Network & HTTP
- 6.3A Basic Web AppProject
- 6.4Express.js
- 6.5Routing
- 6.6MVC Architecture
- 6.7The Model Layer
- 6.8CRUD Operations
- 6.9The Controller Layer
- 6.10The View Layer
- 6.11BlogProject
- 6.12ORM Integration
- 6.13Creating a Post
- 6.14Uploading Files
- 6.15Showing a Post
- 6.16Updating a Post
- 6.17Deleting a Post
- 6.18Database Relations
- 6.19CRUD Tags
- 6.20Adding & Removing Tags
- 6.21Showing Tags & Posts
- 6.22Middleware
- 6.23Browser Data Storage
- 6.24User Registration
- 6.25User Authentication
- 6.26User Authorization
- 6.27User Management
- 6.28Going to Production
Frontend with React.js
React.js is a powerful frontend library used in modern full stack applications. In this chapter, you'll learn how to build dynamic interfaces using React.js, and how to interact with external data and APIs.
- 7.1Fundamentals
- 7.2JSX
- 7.3Conditional Rendering
- 7.4List Rendering
- 7.5Components
- 7.6Props
- 7.7Adding Styles
- 7.8Event Handling
- 7.9Introducing State
- 7.10State Management
- 7.11Form Handling
- 7.12Reducer
- 7.13Context
- 7.14Refs
- 7.15Effects
- 7.16Hooks
- 7.17Rules of React
- 7.18Todo ListProject
- 7.19Weather AppProject
- 7.20Blog AppProject
- 7.21React.js Optimization
Full-Stack with Next.js
Next.js is a framework for building production-grade full stack applications. This chapter shows you how to create server and client rendered pages, APIs, and SaaS features such as user auth and payment processing, all in one codebase. *This chapter is still under construction.
- 8.1Next.js Basics
- 8.2Routing
- 8.3Pages & Layout
- 8.4Server vs. Client Components
- 8.5API Routes
- 8.6Server Actions
- 8.7Database Integration
- 8.8Data Fetching
- 8.9Error Handling
- 8.10Middleware
- 8.11Links, Navigation & Redirection
- 8.12Images
- 8.13Scripts
- 8.14Fonts
- 8.15Lazy Loading
- 8.16Caching
- 8.17Loading UI
- 8.18SaaS PlatformProject
- 8.19User Authentication
- 8.20Magic Link
- 8.21Custom Emails
- 8.22Protecting Routes
- 8.23OAuth Providers
- 8.24Dashboard
- 8.25Role Based Access Control
- 8.26Payment Integration
- 8.27Pricing Page
- 8.28Stripe Checkout
- 8.29Payment Webhook
Building AI Apps
Building your first AI app and learn the fundamental concepts in AI development, including tokens, temperature, top p, streaming, prompt engineering, and more.