LabEx
Log InJoin For Free

Web Development Tutorials

Web development provides a structured learning path for creating modern websites and web applications. Our tutorials cover front - end and back - end technologies, suitable for both beginners and intermediate developers. With free labs and practical code examples, you'll gain hands - on experience in HTML, CSS, JavaScript, and popular frameworks. Our interactive web environment enables you to experiment with different technologies and see real - time results.

Other Skill Trees

LinuxDevOpsCybersecurityPythonDockerKubernetesGitShellNmapWiresharkHydraJavaBig DataDatabaseMySQLMongoDBGolangC++CAnsibleData ScienceMachine LearningPandasNumPyscikit-learnMatplotlibWeb DevelopmentHTMLCSSJavaScriptReact
Understand flex-basis Property in CSS Flexbox

Understand flex-basis Property in CSS Flexbox

Learn how flex-basis controls the initial size of flex items in a flexbox layout, exploring its usage, interactions, and impact on responsive web design.
CSSHTMLJavaScript
Style Web Elements with Border and Padding in CSS

Style Web Elements with Border and Padding in CSS

Learn how to enhance web page design by applying CSS border styles and padding to HTML elements, improving visual appearance and layout.
CSSJavaScriptHTML
Style Text with CSS Font Properties

Style Text with CSS Font Properties

Learn how to enhance web typography by applying CSS font properties, including family, size, style, weight, and line height to create visually appealing and readable text.
JavaScriptCSSHTML
Semantic HTML Tags in Web Development

Semantic HTML Tags in Web Development

Learn how to use semantic HTML tags to create more meaningful and accessible web page structures, improving code readability and search engine optimization.
CSSJavaScriptHTML
Insert and Style Images in HTML

Insert and Style Images in HTML

Learn how to add, style, and manipulate images in HTML using various attributes like src, alt, width, height, and title.
HTML
Understand flex-grow Property in CSS Flexbox

Understand flex-grow Property in CSS Flexbox

Learn how flex-grow works in CSS Flexbox, explore its values, and understand how to control element sizing and distribution within a flex container.
CSSHTMLJavaScript
Use Time Tag for Semantic HTML

Use Time Tag for Semantic HTML

Learn how to use the HTML5 time tag to add semantic meaning to dates and times, improving web page structure and accessibility.
CSSHTMLJavaScript
Understand HTML Heading Tags

Understand HTML Heading Tags

Learn how to use HTML heading tags from H1 to H6, explore their sizes, rendering, and best practices for creating structured web page content.
HTML
Style Text with CSS Text Properties

Style Text with CSS Text Properties

Learn how to enhance text appearance using CSS text properties like line height, indentation, alignment, character spacing, and text decoration.
CSSHTMLJavaScript
Style Lists with CSS Attributes

Style Lists with CSS Attributes

Learn how to customize list styles using CSS attributes, including changing markers, adding images, and adjusting list positioning for enhanced web design.
CSSHTMLJavaScript
Use Conditional Operator in JavaScript

Use Conditional Operator in JavaScript

Learn how to use the conditional (ternary) operator in JavaScript to create concise conditional statements and simplify decision-making logic in your code.
HTMLJavaScriptCSS
Build a Tic-Tac-Toe Web App

Build a Tic-Tac-Toe Web App

In this project, you will learn how to create a Tic-Tac-Toe game using HTML, CSS, and JavaScript. Tic-Tac-Toe is a two-player game where players take turns marking X or O in a 3x3 grid. The objective is to get three marks in a row, either horizontally, vertically, or diagonally. You will create the necessary HTML, CSS, and JavaScript files and implement the game logic step by step.
CSS
Build URL Shortener with Flask MySQL

Build URL Shortener with Flask MySQL

This project guides you through creating a simple URL shortener service using Flask and MySQL. You'll learn to set up a database, design a web interface, and implement functionality to shorten URLs, search for URLs by tags, and view analytics. The project is beginner-friendly and offers a comprehensive insight into web development with Python and database management.
HTML
Build an VSCode Extension with ChatGPT

Build an VSCode Extension with ChatGPT

In this project, we will create a VSCode extension that lets the user adjust the heading level of selected Markdown text.
JavaScript
2048 Web Game Using jQuery

2048 Web Game Using jQuery

2048 is an extremely popular and easy-to-learn game that has taken the world by storm. If you haven't played it yet, you can download it on your mobile phone to give it a try. This project will guide you in using HTML, CSS, JavaScript, and jQuery to create a web version of the 2048 game.
JavaScript
Build an Image Cropping Tool Using HTML5

Build an Image Cropping Tool Using HTML5

This project will guide you through the process of creating a simple image cropping tool. By the end, you'll have an interactive application that allows users to upload, display, and crop images.
JavaScript
Build a Sliding Puzzle Game with JavaScript

Build a Sliding Puzzle Game with JavaScript

Welcome to this project on building a simple Sliding Puzzle game using JavaScript. By the end of this guide, you'll have a functioning 3x3 sliding puzzle game that you can play in your browser. The game will feature numbered tiles, a timer, and controls to start, pause, and reset the game.
JavaScript
jQuery Flip Puzzle Game

jQuery Flip Puzzle Game

This project, the 'jQuery Flip Puzzle Game,' provides a hands-on experience in web development, focusing on JavaScript, jQuery, and Bootstrap. It involves object-oriented programming in JavaScript and addresses the common issue of 'this' binding in the context of web development. The game is implemented using jQuery and Bootstrap 3 for the user interface. While familiarity with Bootstrap is helpful, the project's core logic is built with jQuery and JavaScript.
JavaScript
  • Prev
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • ...
  • 54
  • Next