Learning web development


Welcome to the MDN learning area. This series of articles is designed to provide pure web developers with everything they need to start writing a simple website.

The goal of this learning area is not to let you from "rookie" to "expert", but to lead you from "Introduction" to "adaptation". In this way, you will be able to learn by yourself Other parts of MDN They also have enough basic knowledge to learn intermediate and even advanced resources.

For pure beginners, web development can be challenging - we'll provide enough detailed information to help you learn relevant topics easily and happily. Whether you're a student learning web development (self-study or participating in courses), a teacher looking for classroom materials, a programming enthusiast, or just trying to learn more about web technology, you can find the information you need.

important : the content of the learning area is added periodically. If you want the learning area to include topics that you are interested in, or if you feel that some content is missing, please go below contact us Get ways to contact us.

Where to start?

be careful : you can glossary Query term definitions.

Random term entry

Dynamic typing
Dynamically-typed languages  are those (like JavaScript) where the interpreter assigns variable a type at runtime based on the variable's value at the time.

Topics covered

The following is a list of all the topics covered by the MDN learning area:

Getting started with the web
For beginners to provide a practical web development entry.
HTML - building websites
Html is the language we use to construct different parts of the content of a website and define their meaning or purpose. This topic teaches HTML in detail.
CSS - beautify websites
We can use CSS to design and layout our web content and add behaviors like animation. This topic provides detailed CSS guidance.
JavaScript -- dynamic client scripting language
JavaScript is a scripting language for adding dynamic functionality to web pages. This topic covers all the basic points you need to write and understand JavaScript.
Accessibility - making the site accessible to all
Accessibility is the practice of making web content available to as many people as possible, regardless of disability, device, region, or other different factors. This topic gives you everything you need to know.
Web Performance - make websites fast and responsive
Web performance is an art to ensure that web applications download quickly and respond to user interaction. User bandwidth, screen size, network, and device performance should not be obstacles to the realization of these two things.
Toolset and testing
This topic introduces the tools that developers use to promote their work, such as cross browser testing tools, code error checking tools, code formatting tools, conversion tools, version control systems, and development tools.
Server side website programming
Even if you focus on client-side web development, it's still useful to understand how server-side and server-side code functions work. This topic provides an overview of how server and server-side code features work, and details how to build a server-side application using the two most popular frameworks, Django (Python) and express (node. JS).

Get our code sample

All code examples in the learning area can be found in the GitHub It's on it. If you want to copy them to your computer, the easiest way is Download the latest master branch

If you want to use more flexible functions such as automatic update, you can follow the steps below:

  1. On the computer Install Git The version control system used by GitHub.
  2. Turn on the computer command prompt (Windows) or terminal( Linux , macOS )。
  3. Enter the following command in the command prompt / terminal to copy the learning area warehouse to the learning area directory under the current directory:
     git clone https://github.com/roy-tian/learning-area
  4. You can now use MacOS, windows or CD command Enter the directory and look for the required files.

Now, if you go to GitHub learning-area If there are any changes to the master branch of the warehouse, update your own warehouse with the following command:

  1. In the command prompt / terminal, use the cd Command to enter learning-area catalog. If the current directory is learning-area You can:
     cd learning-area
  2. Use the following command to update the warehouse:
     git pull

contact us

If you want to contact us, the best way is through Learning area exchange post perhaps IRC channel Leave a message. You are welcome to contact us no matter where you think there are mistakes or omissions on the website, want to see new learning topics, ask for help for content you don't understand, or have any other ideas.

If you are interested in helping us develop or improve community content, please take a look How to help And contact us. Whether you are a student, a teacher, an experienced web developer, or you want to help us improve your self-learning experience, we welcome your participation!


Mozilla developer news
Our newsletters for web developers are useful for developers of all levels.
Web Demystified
One by Jérémie Patonnier This is a series of videos about the foundation of web.
Free and open courses, learning technical skills, mentoring and project-based learning
Great interactive learning site to help you learn programming languages from scratch.
Basic programming theory and practice, mainly for children and complete beginners.
Use tutorials and project exercises to learn about interactive web sites for web development.
Web Literacy Map
An entry-level framework for web literacy and common skills in the 21st century, as well as providing classified teaching activities.
Mozilla teaching activities
A series of teaching and learning activities created by Mozilla foundation introduce basic web literacy, privacy, JavaScript, how to play minecraft and so on.
Hundreds of free interactive programming challenges in different programming languages.