Learn Full Stack Web Development in a matter of weeks

Join the 300,000+ students who have trusted Devslopes to learn to code

Learning to code on your own can be tuff. And finding good content online can be harder. Devslopes has taught over 300,000 students how to code with our engaging, hands-on learning approach. Learn real world skills that you'd actually use at a job by building real world projects.
Start Learning Now

What Will I Learn?

▶︎ Learn  HTML, CSS & Javascript ▶︎ Build full stack web applications
▶︎ Build responsive websites with Bootstrap & Flexbox ▶︎ Deploy your projects to a live server
▶︎ Learn to build web apps with React JS ▶︎ For beginners. No coding experience required

What does this course include?

  • 30 hours of content

    Learn to code like the pros. Build real world projects through our engaging hands-on training videos.

  • Unlimited access

    24/7 access from a PC, laptop/tablet or mobile device

  • Access to code forums

    Join our community of students and developers. Ask questions and get help with your code 💻

Full Stack Development

This is where it all begins! A hands-on training to all of the essential front-end and backend skills you'll need to build real, working websites.
Full Stack Development

Build professional and responsive websites

You are going to build over 10 projects. Not only will you build websites & web apps, but you'll learn best development practices and build the type of projects you might build in a full time job.
Build professional and responsive websites

Code Help

You'll get access to our code forums where you can post questions and get help from teachers and the community. This is also a great place to meet other developers!
Code Help

Guided Learning

The course is designed to take you from absolute beginner to advanced levels. If you are an experienced programmer the lessons are designed in a way to help you get up and running fast.
Guided Learning

Course curriculum

  • 01
    Intro to Web Development
    Show details
    • What is web development?
    • What you can do as a web developer
    • Where should I start as a beginner?
    • Frontend vs Backend development
    • Installing an IDE
  • 02
    Getting Started With HTML
    Show details
    • Building your first website
    • Intro to HTML, HEAD, BODY, and HEADER
    • Working with HTML lists, paragraphs, and text styling
    • Displaying data with tables
    • Images & forms in HTML
    • Images & forms in HTML source
    • WebStorm IDE: Basic Setup
    • WebStorm IDE: Navigating your project
    • WebStorm IDE: Performing searches
    • WebStorm IDE: Mastering the editor
  • 03
    Introduction to CSS
    Show details
    • What is CSS?
    • How to use inline, internal and external CSS
    • Element, ID & Class Selectors
    • Element, ID & Class Selectors source
    • CSS: Colors
    • CSS: Backgrounds & borders
    • Using browser inspector tools
    • CSS Combinators
    • CSS Grouping
    • CSS: Specificity
  • 04
    Intermediate CSS
    Show details
    • Text styling & formatting
    • Google Fonts
    • CSS: Images
    • CSS: Padding & Margin
    • Rows & Columns
    • Rows & Columns source
  • 05
    Advanced CSS: Building and styling website
    Show details
    • Intro to your first CSS Website
    • starter source
    • Building the navbar
    • Making the navbar mobile responsive: Part 1
    • Making the navbar mobile responsive: Part 2
    • Creating the form group
    • Working with iframes
    • Working with images and box shadows
    • Working with text and image spacing
    • Building the footer
    • final source
  • 06
    Computers and Code
    Show details
    • How Computers Work
    • source code
    • Understanding Binary
    • Heap vs Stack
    • How code works
    • Variables & storage capacity
    • Understanding hexadecimal
  • 07
    Version Control With Git
    Show details
    • Git & Version Control: The fun way
    • Terminal Basics: Changing directories
    • Terminal Basics: Creating directories & files
    • Terminal Basics: Copying & renaming files
    • Terminal Basics: Deleting files & directories
    • Git Basics
    • Setting up Github
    • Working with Local & remote repositories
    • Handling git merge conflicts
  • 08
    Learning to Code With Javascript
    Show details
    • Time to Javascript
    • Javascript reference
    • Javascript comments & how to link scripts
    • Javascript variables & strings
    • Numbers in Javascript
    • Comparison operators in Javascript
    • Logical operators in Javascript
    • Javascript arrays
    • Javascript loops
    • Javascript functions
    • Javascript objects
    • Javascript bind
    • Calculator: Setting up the form
    • Calculator: Grabbing elements with Javascript
    • Calculator - Using event listeners
    • Calculator - Algorithm & prevent default
    • Javascript source code
  • 09
    Introduction to Bootstrap 4
    Show details
    • What is Bootstrap 4?
    • Downloading Bootstrap 4
    • How to setup a Bootstrap 4 project
    • Bootstrap 4 components overview
    • Understanding Bootstrap 4 classes
    • Using the grid system
  • 10
    Bootstrap 4: Creating a Login Portal
    Show details
    • Intro to Bootstrap Login Portal project
    • starter source
    • Bootstrap Cards: Creating the sign in inputs
    • Bootstrap Forms: Adding the input fields
    • Bootstrap Buttons: Adding the sign in button and Labels
    • Bootstrap Grids: Making the form mobile responsive
    • final source
  • 11
    Bootstrap 4: Skate or Die Website
    Show details
    • Skate or Die Intro
    • starter source
    • Bootstrap 4: Working with navbars
    • Bootstrap 4: Using carousels
    • Bootstrap 4: Nesting rows and columns
    • Bootstrap 4: First modal
    • Bootstrap 4: Adding images and buttons
    • Bootstrap 4: Sizing modals
    • Bootstrap 4: Building the footer
    • final source
    • Bootstrap 4: Working with Font Awesome favicons
  • 12
    Intro to Flexbox
    Show details
    • What is flexbox?
    • Flexbox fundamentals
    • Flexbox fundamentals source
    • Intro to flexbox landing page
    • Landing page starter source
    • Building the navbar: Part 1
    • Building the navbar: Part 2
    • Designing the navbar for mobile
    • Making the dropdown menu functional
    • Creating the landing page header
    • Building the Services section
    • Creating the first Media Object
    • Flexbox ordering
    • Adding the Quote button
    • Making Media Objects mobile compatible
    • Designing the portfolio object
    • Making the portfolio object mobile compatible
    • Creating the contact form
    • Making the contact form mobile compatible
    • Landing page final source
  • 13
    Beginner Sass
    Show details
    • Intro to Sass
    • What is Sass?
    • How to install SASS and compile it to CSS
    • Compile Sass source
    • Your FIRST Sass Website!
    • Different tools to compile Sass
    • Sass Architecture
    • Sass architecture source
    • Sass Partials: Maintainable Styles Rules
    • Partials source
    • Sass Variables and Imports: Create a clean Scalable Stylesheet
    • Sass variables source
    • Sass Mixins: Save time & recycle styles
    • Sass Extends: Share style properties between other selectors
    • Extends source
    • Final Project: Intro to our Landing Page
    • Project starter source
    • Final Project: Setting up our Variables
    • Final Project: Styling our Navbar with Sass
    • Final Project: Creating the Banner Container
    • Final Project: Adding Content to our Banner Container
    • Final Project: Doing some quick cleanup in our Sass files
    • Final Project: Using the Extend method
    • Final Project: Styling a section splitter with Sass
    • Final Project: Using advanced Mixins
    • Final Project: Styling the next Container with Sass
    • Final Project: Finishing our Landing Page, Congrats!
    • Final project source
  • 14
    Setting up web hosting
    Show details
    • Web Hosting
    • Creating a server
    • Accessing your server
    • Installing Nginx
    • Creating server SSH Keys
    • sample project source
    • Uploading files to your server
    • Setting up a domain
    • Final Step: Configuring Nginx
  • 15
    Intro to Node, Mongo, & REST APIs
    Show details
    • Understanding Web Requests
    • Installing Node on macOS
    • All About JSON
    • Basics of Node
    • Node Modules
    • Building Your First API
    • First API source
    • Postman, GET & POST Requests
    • URL Parameters & Delete Requests
    • Installing MongoDB on macOS
    • Working With the Mongo Shell
    • Searching for Documents
    • Deletions & Documentation
    • Swag Shop API: Project Creation
    • Swag Shop API: Creating the Models
    • Swag Shop API: Posting Products
    • Swag Shop API: Fetching Products
    • Swag Shop API: Populating Data
    • Swag shop source
  • 16
    Intro to React
    Show details
    • Swag Shop: Setting Up React Tooling
    • Swag Shop: Installing Bootstrap
    • Swag shop API source
    • Swag Shop: Setting Up the API
    • Swag Shop: Creating a HTTP Service
    • Swag Shop: Promises With ES6 & React
    • Swag Shop: Components in React - Website Product
    • Swag Shop: Props in React
    • Swag Shop: Working With State in React
    • Swag Shop: Creating a WishList Component
    • Swag Shop: Building a Singleton Data Service
    • Swag Shop: Creating a Notification Service
    • Swag Shop: Posting Notifications to React Components
    • Swag Shop: Observing Notifications in React
    • Swag Shop: Finishing Our Full Stack React App