Files

1 line
27 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html><html lang="zh-CN"><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width,initial-scale=1" /><meta name="generator" content="VuePress 2.0.0-rc.24" /><meta name="theme" content="VuePress Theme Plume 1.0.0-rc.164" /><script id="check-mac-os">document.documentElement.classList.toggle('mac', /Mac|iPhone|iPod|iPad/i.test(navigator.platform))</script><script id="check-dark-mode">;(function () {const um= localStorage.getItem('vuepress-theme-appearance') || 'auto';const sm = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;const isDark = um === 'dark' || (um !== 'light' && sm);document.documentElement.dataset.theme = isDark ? 'dark' : 'light';})();</script><script type="application/ld+json">{"@context":"https://schema.org","@type":"Article","headline":"Web 概览与学习路径","image":[""],"dateModified":"2025-10-28T15:43:05.000Z","author":[]}</script><meta property="og:url" content="https://notes.simengweb.com/programming/web/"><meta property="og:site_name" content="仲夏夜之梦"><meta property="og:title" content="Web 概览与学习路径"><meta property="og:description" content="Web万维网是一个基于浏览器与服务器的“信息与应用平台”。用户通过浏览器访问网站浏览器通过 HTTP/HTTPS 与服务器交互,服务器返回页面或数据,最终在浏览器中呈现并产生交互。 浏览器渲染页面HTML/CSS/JS、执行脚本、发起网络请求。 服务器:处理业务逻辑、读写数据库、对外提供 API。 数据库持久化存储MySQL/Postg..."><meta property="og:type" content="article"><meta property="og:locale" content="zh-CN"><meta property="og:updated_time" content="2025-10-28T15:43:05.000Z"><meta property="article:modified_time" content="2025-10-28T15:43:05.000Z"><link rel="icon" type="image/png" href="https://theme-plume.vuejs.press/favicon-32x32.png"><title>Web 概览与学习路径 | 仲夏夜之梦</title><meta name="description" content="Web万维网是一个基于浏览器与服务器的“信息与应用平台”。用户通过浏览器访问网站浏览器通过 HTTP/HTTPS 与服务器交互,服务器返回页面或数据,最终在浏览器中呈现并产生交互。 浏览器渲染页面HTML/CSS/JS、执行脚本、发起网络请求。 服务器:处理业务逻辑、读写数据库、对外提供 API。 数据库持久化存储MySQL/Postg..."><link rel="preload" href="/assets/style-PWY98LJg.css" as="style"><link rel="stylesheet" href="/assets/style-PWY98LJg.css"><link rel="modulepreload" href="/assets/app-COnnofor.js"><link rel="modulepreload" href="/assets/index.html-Bbbe_5Dq.js"></head><body><div id="app"><!--[--><!--[--><div class="theme-plume vp-layout" vp-container data-v-f73ca3da><!--[--><!--[--><!--]--><!--[--><span tabindex="-1" data-v-17e3d305></span><a href="#VPContent" class="vp-skip-link visually-hidden" data-v-17e3d305> Skip to content </a><!--]--><!----><header class="vp-nav" data-v-f73ca3da data-v-e98a6132><div class="vp-navbar" vp-navbar data-v-e98a6132 data-v-2c31ea5e><div class="wrapper" data-v-2c31ea5e><div class="container" data-v-2c31ea5e><div class="title" data-v-2c31ea5e><div class="vp-navbar-title has-sidebar" data-v-2c31ea5e data-v-1a4f50af><a class="vp-link link no-icon title" href="/" data-v-1a4f50af><!--[--><!--[--><!--]--><!--[--><!--[--><!--[--><img class="vp-image dark logo" style="" src="/plume.svg" alt data-v-480e858a><!--]--><!--[--><img class="vp-image light logo" style="" src="/plume.svg" alt data-v-480e858a><!--]--><!--]--><!--]--><span data-v-1a4f50af>仲夏夜之梦</span><!--[--><!--]--><!--]--><!----></a></div></div><div class="content" data-v-2c31ea5e><div class="content-body" data-v-2c31ea5e><!--[--><!--]--><div class="vp-navbar-search search" data-v-2c31ea5e><div class="search-wrapper" data-v-97535d1e><!----><div id="local-search" data-v-97535d1e><button type="button" class="mini-search mini-search-button" aria-label="搜索文档" data-v-97535d1e><span class="mini-search-button-container"><span class="mini-search-search-icon vpi-mini-search" aria-label="search icon"></span><span class="mini-search-button-placeholder">搜索文档</span></span><span class="mini-search-button-keys"><kbd class="mini-search-button-key"></kbd><kbd class="mini-search-button-key">K</kbd></span></button></div></div></div><!--[--><!--]--><nav aria-labelledby="main-nav-aria-label" class="vp-navbar-menu menu" data-v-2c31ea5e data-v-d43c1732><span id="main-nav-aria-label" class="visually-hidden" data-v-d43c1732>Main Navigation</span><!--[--><!--[--><a class="vp-link link navbar-menu-link" href="/" tabindex="0" data-v-d43c1732 data-v-d4acf911><!--[--><!----><span data-v-d4acf911>首页</span><!----><!--]--><!----></a><!--]--><!--[--><a class="vp-link link navbar-menu-link" href="/blog/" tabindex="0" data-v-d43c1732 data-v-d4acf911><!--[--><!----><span data-v-d4acf911>博客</span><!----><!--]--><!----></a><!--]--><!--[--><div class="vp-flyout vp-navbar-menu-group" data-v-d43c1732 data-v-86530b6c><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-86530b6c><span class="text" data-v-86530b6c><!----><!----><span data-v-86530b6c>学科知识</span><!----><span class="vpi-chevron-down text-icon" data-v-86530b6c></span></span></button><div class="menu" data-v-86530b6c><div class="vp-menu" data-v-86530b6c data-v-709dc2b1><div class="items" data-v-709dc2b1><!--[--><!--[--><div class="vp-menu-link" data-v-709dc2b1 data-v-1ff1855f><a class="vp-link link" href="/subject/english/" data-v-1ff1855f><!--[--><!----> 英语学习笔记 <!----><!--]--><!----></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--[--><div class="vp-flyout vp-navbar-menu-group active" data-v-d43c1732 data-v-86530b6c><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-86530b6c><span class="text" data-v-86530b6c><!----><!----><span data-v-86530b6c>编程笔记</span><!----><span class="vpi-chevron-down text-icon" data-v-86530b6c></span></span></button><div class="menu" data-v-86530b6c><div class="vp-menu" data-v-86530b6c data-v-709dc2b1><div class="items" data-v-709dc2b1><!--[--><!--[--><div class="vp-menu-link" data-v-709dc2b1 data-v-1ff1855f><a class="vp-link link" href="/programming/leetcode/" data-v-1ff1855f><!--[--><!----> LeetCode <!----><!--]--><!----></a></div><!--]--><!--[--><div class="vp-menu-link" data-v-709dc2b1 data-v-1ff1855f><a class="vp-link link" href="/programming/cplusplus/" data-v-1ff1855f><!--[--><!----> C++ <!----><!--]--><!----></a></div><!--]--><!--[--><div class="vp-menu-link" data-v-709dc2b1 data-v-1ff1855f><a class="vp-link link" href="/programming/solidity/" data-v-1ff1855f><!--[--><!----> Solidity <!----><!--]--><!----></a></div><!--]--><!--[--><div class="vp-menu-link" data-v-709dc2b1 data-v-1ff1855f><a class="vp-link link active" href="/programming/web/" data-v-1ff1855f><!--[--><!----> Web 开发 <!----><!--]--><!----></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--[--><div class="vp-flyout vp-navbar-menu-group" data-v-d43c1732 data-v-86530b6c><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-86530b6c><span class="text" data-v-86530b6c><!----><!----><span data-v-86530b6c>技术理论</span><!----><span class="vpi-chevron-down text-icon" data-v-86530b6c></span></span></button><div class="menu" data-v-86530b6c><div class="vp-menu" data-v-86530b6c data-v-709dc2b1><div class="items" data-v-709dc2b1><!--[--><!--[--><div class="vp-menu-link" data-v-709dc2b1 data-v-1ff1855f><a class="vp-link link" href="/theory/cryptography/" data-v-1ff1855f><!--[--><!----> 密码学基础 <!----><!--]--><!----></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--[--><div class="vp-flyout vp-navbar-menu-group" data-v-d43c1732 data-v-86530b6c><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-86530b6c><span class="text" data-v-86530b6c><!----><!----><span data-v-86530b6c>运维</span><!----><span class="vpi-chevron-down text-icon" data-v-86530b6c></span></span></button><div class="menu" data-v-86530b6c><div class="vp-menu" data-v-86530b6c data-v-709dc2b1><div class="items" data-v-709dc2b1><!--[--><!--[--><div class="vp-menu-link" data-v-709dc2b1 data-v-1ff1855f><a class="vp-link link" href="/ops/blockchain/" data-v-1ff1855f><!--[--><!----> 区块链运维 <!----><!--]--><!----></a></div><!--]--><!--[--><div class="vp-menu-link" data-v-709dc2b1 data-v-1ff1855f><a class="vp-link link" href="/ops/linux/" data-v-1ff1855f><!--[--><!----> Linux 运维 <!----><!--]--><!----></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--[--><a class="vp-link link navbar-menu-link" href="/tools/" tabindex="0" data-v-d43c1732 data-v-d4acf911><!--[--><!----><span data-v-d4acf911>工具</span><!----><!--]--><!----></a><!--]--><!--[--><a class="vp-link link navbar-menu-link" href="/about/" tabindex="0" data-v-d43c1732 data-v-d4acf911><!--[--><!----><span data-v-d4acf911>关于</span><!----><!--]--><!----></a><!--]--><!--[--><a class="vp-link link navbar-menu-link" href="/friends/" tabindex="0" data-v-d43c1732 data-v-d4acf911><!--[--><!----><span data-v-d4acf911>友情链接</span><!----><!--]--><!----></a><!--]--><!--]--></nav><!--[--><!--]--><!----><div class="vp-navbar-appearance appearance" data-v-2c31ea5e data-v-a295abf6><button class="vp-switch vp-switch-appearance" type="button" role="switch" title aria-checked="false" data-v-a295abf6 data-v-596c25a9 data-v-7eb32327><span class="check" data-v-7eb32327><span class="icon" data-v-7eb32327><!--[--><span class="vpi-sun sun" data-v-596c25a9></span><span class="vpi-moon moon" data-v-596c25a9></span><!--]--></span></span></button></div><div class="vp-social-links vp-navbar-social-links social-links" data-v-2c31ea5e data-v-ad52545c data-v-40bac536><!--[--><a class="vp-social-link no-icon" href="/" aria-label="github" target="_blank" rel="noopener" data-v-40bac536 data-v-67b21932><span class="vpi-social-github" /></a><!--]--></div><div class="vp-flyout vp-navbar-extra extra" data-v-2c31ea5e data-v-652282fd data-v-86530b6c><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-86530b6c><span class="vpi-more-horizontal icon" data-v-86530b6c></span></button><div class="menu" data-v-86530b6c><div class="vp-menu" data-v-86530b6c data-v-709dc2b1><!----><!--[--><!--[--><!----><div class="group" data-v-652282fd><div class="item appearance" data-v-652282fd><p class="label" data-v-652282fd>外观</p><div class="appearance-action" data-v-652282fd><button class="vp-switch vp-switch-appearance" type="button" role="switch" title aria-checked="false" data-v-652282fd data-v-596c25a9 data-v-7eb32327><span class="check" data-v-7eb32327><span class="icon" data-v-7eb32327><!--[--><span class="vpi-sun sun" data-v-596c25a9></span><span class="vpi-moon moon" data-v-596c25a9></span><!--]--></span></span></button></div></div></div><div class="group" data-v-652282fd><div class="item social-links" data-v-652282fd><div class="vp-social-links social-links-list" data-v-652282fd data-v-40bac536><!--[--><a class="vp-social-link no-icon" href="/" aria-label="github" target="_blank" rel="noopener" data-v-40bac536 data-v-67b21932><span class="vpi-social-github" /></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="vp-navbar-hamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="nav-screen" data-v-2c31ea5e data-v-2b50024d><span class="container" data-v-2b50024d><span class="top" data-v-2b50024d></span><span class="middle" data-v-2b50024d></span><span class="bottom" data-v-2b50024d></span></span></button></div></div></div></div><div class="divider" data-v-2c31ea5e><div class="divider-line" data-v-2c31ea5e></div></div></div><!----></header><div class="vp-local-nav reached-top" data-v-f73ca3da data-v-3944d8e8><button class="menu" aria-expanded="false" aria-controls="SidebarNav" data-v-3944d8e8><span class="vpi-align-left menu-icon" data-v-3944d8e8></span><span class="menu-text" data-v-3944d8e8>Menu</span></button><div class="vp-local-nav-outline-dropdown" style="--vp-vh:0px;" data-v-3944d8e8 data-v-4114a62c><button data-v-4114a62c>返回顶部</button><!----></div></div><aside class="vp-sidebar" vp-sidebar data-v-f73ca3da data-v-95211354><div class="curtain" data-v-95211354></div><nav id="SidebarNav" class="nav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-95211354><span id="sidebar-aria-label" class="visually-hidden" data-v-95211354> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="no-transition group" data-v-473fd05b><section class="vp-sidebar-item sidebar-item level-0 has-active" data-v-473fd05b data-v-12048f0f><!----><div data-v-12048f0f data-v-12048f0f><div class="items" data-v-12048f0f><!--[--><div class="vp-sidebar-item sidebar-item level-1 is-link" data-v-12048f0f data-v-12048f0f><div class="item" data-v-12048f0f><div class="indicator" data-v-12048f0f></div><!----><a class="vp-link link link" href="/programming/web/" data-v-12048f0f><!--[--><p class="text" data-v-12048f0f><span data-v-12048f0f>Web 开发学习笔记</span><!----></p><!--]--><!----></a><!----></div><!----></div><!--]--></div></div></section></div><div class="no-transition group" data-v-473fd05b><section class="vp-sidebar-item sidebar-item level-0" data-v-473fd05b data-v-12048f0f><div class="item" role="button" tabindex="0" data-v-12048f0f><div class="indicator" data-v-12048f0f></div><!----><h2 class="text" data-v-12048f0f><span data-v-12048f0f>基础知识</span><!----></h2><!----></div><div data-v-12048f0f data-v-12048f0f><div class="items" data-v-12048f0f><!--[--><div class="vp-sidebar-item sidebar-item level-1 is-link" data-v-12048f0f data-v-12048f0f><div class="item" data-v-12048f0f><div class="indicator" data-v-12048f0f></div><!----><a class="vp-link link link" href="/programming/web/basic-syntax/html-css-js/" data-v-12048f0f><!--[--><p class="text" data-v-12048f0f><span data-v-12048f0f>Web 前端基础讲解</span><!----></p><!--]--><!----></a><!----></div><!----></div><div class="vp-sidebar-item sidebar-item level-1 is-link" data-v-12048f0f data-v-12048f0f><div class="item" data-v-12048f0f><div class="indicator" data-v-12048f0f></div><!----><a class="vp-link link link" href="/programming/web/basic-syntax/html-tags-attributes/" data-v-12048f0f><!--[--><p class="text" data-v-12048f0f><span data-v-12048f0f>HTML 常用标签与属性</span><!----></p><!--]--><!----></a><!----></div><!----></div><div class="vp-sidebar-item sidebar-item level-1 is-link" data-v-12048f0f data-v-12048f0f><div class="item" data-v-12048f0f><div class="indicator" data-v-12048f0f></div><!----><a class="vp-link link link" href="/programming/web/basic-syntax/html-lists-and-semantic-layout/" data-v-12048f0f><!--[--><p class="text" data-v-12048f0f><span data-v-12048f0f>HTML 列表与语义布局</span><!----></p><!--]--><!----></a><!----></div><!----></div><div class="vp-sidebar-item sidebar-item level-1 is-link" data-v-12048f0f data-v-12048f0f><div class="item" data-v-12048f0f><div class="indicator" data-v-12048f0f></div><!----><a class="vp-link link link" href="/programming/web/basic-syntax/javascript-basics/" data-v-12048f0f><!--[--><p class="text" data-v-12048f0f><span data-v-12048f0f>JavaScript 基础知识</span><!----></p><!--]--><!----></a><!----></div><!----></div><!--]--></div></div></section></div><!--]--><!--[--><!--]--></nav></aside><!--[--><div id="VPContent" vp-content class="vp-content has-sidebar" data-v-f73ca3da data-v-b2beaca7><div class="vp-doc-container has-sidebar has-aside" data-v-b2beaca7 data-v-23f6ad98><!--[--><!--]--><div class="container" data-v-23f6ad98><div class="aside" vp-outline data-v-23f6ad98><div class="aside-curtain" data-v-23f6ad98></div><div class="aside-container" data-v-23f6ad98><div class="aside-content" data-v-23f6ad98><div class="vp-doc-aside" data-v-23f6ad98 data-v-5976474c><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="vp-doc-aside-outline" role="navigation" data-v-5976474c data-v-aa56eba0><div class="content" data-v-aa56eba0><div class="outline-marker" data-v-aa56eba0></div><div id="doc-outline-aria-label" aria-level="2" class="outline-title" role="heading" data-v-aa56eba0><span data-v-aa56eba0>此页内容</span><span class="vpi-print icon" data-v-aa56eba0></span></div><ul class="root" data-v-aa56eba0 data-v-3e6b023c><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-5976474c></div><!--[--><!--]--></div></div></div></div><div class="content" data-v-23f6ad98><div class="content-container" data-v-23f6ad98><!--[--><!--]--><main class="main" data-v-23f6ad98><nav class="vp-breadcrumb" data-v-23f6ad98 data-v-1ae4ad7a><ol vocab="https://schema.org/" typeof="BreadcrumbList" data-v-1ae4ad7a><!--[--><li property="itemListElement" typeof="ListItem" data-v-1ae4ad7a><a class="vp-link link breadcrumb" href="/" property="item" typeof="WebPage" data-v-1ae4ad7a><!--[-->首页<!--]--><!----></a><span class="vpi-chevron-right" data-v-1ae4ad7a></span><meta property="name" content="首页" data-v-1ae4ad7a><meta property="position" content="1" data-v-1ae4ad7a></li><li property="itemListElement" typeof="ListItem" data-v-1ae4ad7a><a class="vp-link link breadcrumb current" href="/programming/web/" property="item" typeof="WebPage" data-v-1ae4ad7a><!--[-->Web 概览与学习路径<!--]--><!----></a><!----><meta property="name" content="Web 概览与学习路径" data-v-1ae4ad7a><meta property="position" content="2" data-v-1ae4ad7a></li><!--]--></ol></nav><!--[--><!--]--><!--[--><h1 class="vp-doc-title page-title" data-v-ba8d1a1e><!----> Web 概览与学习路径 <!----></h1><div class="vp-doc-meta" data-v-ba8d1a1e><!--[--><!--]--><p class="reading-time" data-v-ba8d1a1e><span class="vpi-books icon" data-v-ba8d1a1e></span><span data-v-ba8d1a1e>约 739 字</span><span data-v-ba8d1a1e>大约 2 分钟</span></p><!----><!--[--><!--]--><p class="create-time" data-v-ba8d1a1e><span class="vpi-clock icon" data-v-ba8d1a1e></span><span data-v-ba8d1a1e>2025-10-28</span></p></div><!--]--><!--[--><!--]--><div class="_programming_web_ external-link-icon-enabled vp-doc plume-content" vp-content data-v-23f6ad98><!--[--><!--]--><div data-v-23f6ad98><p>Web万维网是一个基于浏览器与服务器的“信息与应用平台”。用户通过浏览器访问网站浏览器通过 <strong>HTTP/HTTPS</strong> 与服务器交互,服务器返回页面或数据,最终在浏览器中呈现并产生交互。</p><ul><li>浏览器渲染页面HTML/CSS/JS、执行脚本、发起网络请求。</li><li>服务器:处理业务逻辑、读写数据库、对外提供 API。</li><li>数据库持久化存储MySQL/PostgreSQL/MongoDB 等)。</li></ul><p>简而言之:浏览器负责“看与用”,服务器负责“算与存”。</p><h2 id="前端基础概念" tabindex="-1"><a class="header-anchor" href="#前端基础概念"><span>前端基础概念</span></a></h2><ul><li>HTML结构与语义页面“骨架”</li><li>CSS表现与布局页面“外观”</li><li>JavaScript交互与逻辑页面“大脑”</li><li>现代前端模块化、构建工具、组件化框架Vue/React/Svelte 等)。</li></ul><p>入门建议:先掌握原生 HTML/CSS/JS再学习框架。你可以从本站文章开始</p><ul><li>基础教程 → <code>/programming/web/basic-syntax/html-css-js/</code></li></ul><h2 id="后端基础概念" tabindex="-1"><a class="header-anchor" href="#后端基础概念"><span>后端基础概念</span></a></h2><ul><li>服务器与框架Node.jsExpress/NestJS、PythonFlask/Django/FastAPI、JavaSpring Boot、GoGin/Fiber</li><li>API 风格REST常见、GraphQL灵活查询</li><li>数据库与 ORMMySQL/PostgreSQL关系型、MongoDB文档型ORM 如 Prisma/TypeORM/SQLAlchemy。</li><li>常见能力认证授权Session/JWT/OAuth、文件上传、任务队列、缓存、日志与监控。</li></ul><h2 id="前后端如何协作" tabindex="-1"><a class="header-anchor" href="#前后端如何协作"><span>前后端如何协作</span></a></h2><ul><li>约定接口路径、方法GET/POST/PUT/DELETE、参数与返回 JSON。</li><li>跨域与安全CORS、CSRF/XSS/SQL 注入防护、HTTPS。</li><li>开发流程: <ol><li>需求与原型 → 2) API 设计 → 3) 前端页面与交互 → 4) 后端实现与测试 → 5) 联调与验收 → 6) 部署与监控。</li></ol></li></ul><h2 id="学习路径-从-0-到-1" tabindex="-1"><a class="header-anchor" href="#学习路径-从-0-到-1"><span>学习路径(从 0 到 1</span></a></h2><ol><li>基础三件套HTML + CSS + JavaScript建议用 VSCode + Live Server</li><li>工具与方法Git/GitHub、浏览器开发者工具、HTTP/REST、请求调试Postman/Insomnia</li><li>进阶前端布局Flex/Grid、响应式、ES6+、模块化、打包与构建Vite/Webpack</li><li>后端入门:选择一种语言与框架(如 Node.js + Express完成 CRUD 与认证。</li><li>数据库:会建表、会写基本查询;理解事务与索引。</li><li>部署与上线Nginx 反向代理、Docker、环境变量、日志与监控。</li></ol><p>建议开发一个“待办清单 + 登录 + 数据持久化”的完整小项目,贯穿前后端与部署。</p><h2 id="推荐学习资源" tabindex="-1"><a class="header-anchor" href="#推荐学习资源"><span>推荐学习资源</span></a></h2><p>通用与入门:</p><ul><li><a href="https://developer.mozilla.org/" target="_blank" rel="noopener noreferrer">MDN Web DocsHTML/CSS/JS 全面权威)</a></li><li><a href="https://www.freecodecamp.org/" target="_blank" rel="noopener noreferrer">freeCodeCamp系统课程与练习</a></li><li><a href="https://roadmap.sh/" target="_blank" rel="noopener noreferrer">Roadmap.sh前端/后端学习路径图)</a></li></ul><p>前端:</p><ul><li><a href="https://developer.mozilla.org/en-US/docs/Learn" target="_blank" rel="noopener noreferrer">HTML/CSS 基础MDN</a></li><li><a href="https://css-tricks.com/" target="_blank" rel="noopener noreferrer">CSS-Tricks样式与布局技巧</a></li><li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript" target="_blank" rel="noopener noreferrer">JavaScript 基础与进阶MDN</a></li><li><a href="https://vuejs.org/" target="_blank" rel="noopener noreferrer">Vue 官方文档</a></li></ul><p>后端:</p><ul><li><a href="https://nodejs.org/en/docs" target="_blank" rel="noopener noreferrer">Node.js 文档</a></li><li><a href="https://expressjs.com/" target="_blank" rel="noopener noreferrer">Express</a></li><li><a href="https://docs.nestjs.com/" target="_blank" rel="noopener noreferrer">NestJS</a></li><li><a href="https://spring.io/projects/spring-boot" target="_blank" rel="noopener noreferrer">Spring Boot</a></li><li><a href="https://docs.djangoproject.com/" target="_blank" rel="noopener noreferrer">Django</a></li><li><a href="https://flask.palletsprojects.com/" target="_blank" rel="noopener noreferrer">Flask</a></li><li><a href="https://fastapi.tiangolo.com/" target="_blank" rel="noopener noreferrer">FastAPI</a></li></ul><p>数据库与 ORM</p><ul><li><a href="https://dev.mysql.com/doc/" target="_blank" rel="noopener noreferrer">MySQL</a></li><li><a href="https://www.postgresql.org/docs/" target="_blank" rel="noopener noreferrer">PostgreSQL</a></li><li><a href="https://www.mongodb.com/docs/" target="_blank" rel="noopener noreferrer">MongoDB</a></li><li><a href="https://www.prisma.io/docs" target="_blank" rel="noopener noreferrer">PrismaNode.js ORM</a></li><li><a href="https://typeorm.io/" target="_blank" rel="noopener noreferrer">TypeORM</a></li></ul><p>工具:</p><ul><li><a href="https://code.visualstudio.com/" target="_blank" rel="noopener noreferrer">VSCode</a></li><li><a href="https://www.postman.com/" target="_blank" rel="noopener noreferrer">Postman</a></li><li><a href="https://insomnia.rest/" target="_blank" rel="noopener noreferrer">Insomnia</a></li><li><a href="https://docs.docker.com/" target="_blank" rel="noopener noreferrer">Docker</a></li></ul><h2 id="本站相关内容" tabindex="-1"><a class="header-anchor" href="#本站相关内容"><span>本站相关内容</span></a></h2><ul><li>Web 前端基础讲解 → <code>/programming/web/basic-syntax/html-css-js/</code></li><li>后续将补充:前端工程化、接口联调、部署与运维实战等专题。</li></ul></div><!----><!----><!----></div></main><footer class="vp-doc-footer" data-v-23f6ad98 data-v-7138e2cb><!--[--><!--]--><!----><div class="contributors" aria-label="Contributors" data-v-7138e2cb><span class="contributors-label" data-v-7138e2cb>贡献者: </span><span class="contributors-info" data-v-7138e2cb><!--[--><!--[--><span class="contributor" data-v-7138e2cb>祀梦</span><!----><!--]--><!--]--></span></div><nav class="prev-next" data-v-7138e2cb><div class="pager" data-v-7138e2cb><!----></div><div class="pager" data-v-7138e2cb><a class="vp-link link pager-link next" href="/programming/web/basic-syntax/html-css-js/" data-v-7138e2cb><!--[--><span class="desc" data-v-7138e2cb>下一页</span><span class="title" data-v-7138e2cb>Web 前端基础讲解</span><!--]--><!----></a></div></nav></footer><div id="comment" class="waline-wrapper vp-comment" vp-comment darkmode="false" style="display:block;" data-v-23f6ad98><!----></div><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!--]--><button style="display:none;" type="button" class="vp-back-to-top" aria-label="back to top" data-v-f73ca3da data-v-bcf8d9a6><span class="percent" data-allow-mismatch data-v-bcf8d9a6>0%</span><span class="show icon vpi-back-to-top" data-v-bcf8d9a6></span><svg aria-hidden="true" data-v-bcf8d9a6><circle cx="50%" cy="50%" data-allow-mismatch style="stroke-dasharray:calc(0% - 12.566370614359172px) calc(314.1592653589793% - 12.566370614359172px);" data-v-bcf8d9a6></circle></svg></button><svg style="display:none;" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" aria-label="sign down" class="vp-sign-down" aria-hidden="true" data-v-f73ca3da data-v-900978de><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" data-v-900978de><path d="m19 11l-7 6l-7-6" data-v-900978de></path><path d="m19 5l-7 6l-7-6" opacity="0.6" data-v-900978de></path></g></svg><footer class="vp-footer has-sidebar" vp-footer data-v-f73ca3da data-v-400675cf><!--[--><div class="container" data-v-400675cf><p class="message" data-v-400675cf>Powered by <a target="_blank" href="https://v2.vuepress.vuejs.org/">VuePress</a> & <a target="_blank" href="https://theme-plume.vuejs.press">vuepress-theme-plume</a></p><!----></div><!--]--></footer><!--[--><!--]--><!--]--></div><!----><!--]--><!--[--><!--]--><!--]--></div><script type="module" src="/assets/app-COnnofor.js" defer></script></body></html>