目录
JavaScript 全栈开发者路线图 1. 基础知识2. 前端开发3. 后端开发4. 数据库与 API5. MERN Stack 和 React Native6. 工程化与部署7. 安全与测试8. 未来趋势JavaScript 历史JavaScript 社区推荐探讨计算机教育软件随想录,赛博土木与技术哲学
探讨概念与杂书推荐斗气三段:技术、工程、哲学
1. 基础知识
HTML5 和 CSS3
HTML5:学习 HTML5 的新标签(如article
, section
, header
, footer
)、语义化元素、表单增强和音视频功能。CSS3:学习 CSS3 的新特性(如 Flexbox、Grid、动画和过渡),理解响应式设计和媒体查询。 推荐书籍: 《HTML5与CSS3基础教程(第8版)》- Terry Felke-Morris《CSS揭秘》- Lea Verou(中文译版) 推荐博主/作者: 张鑫旭:前端开发专家,CSS 技术分享Kevin Powell:CSS 教程(YouTube) JavaScript (ES6+)
JavaScript:学习现代 JavaScript 的 ES6+ 特性: 箭头函数、解构赋值、扩展运算符、类、Promises 和 Async/Await。模块化 (ES Modules):使用import
和 export
模块化代码,提高可维护性。推荐书籍: 《JavaScript高级程序设计(第4版)》- Nicholas C. Zakas(中文译版)《你不知道的JavaScript(上、下卷)》- Kyle Simpson(中文译版) 推荐博主/作者: 阮一峰:JavaScript 教程与深入解析MDN Web Docs:权威的 JavaScript 文档与示例 函数式编程
函数式编程:学习函数式编程的基础概念,如纯函数、高阶函数和不可变性,提升代码的可测试性和可维护性。 推荐书籍: 《JavaScript 函数式编程》- 方励 推荐博主/作者: Eric Elliott:JavaScript 专家,推广函数式编程2. 前端开发
前端框架
React.js:学习 React 框架,掌握 Hooks(如useState
, useEffect
)和状态管理技术,构建动态的用户界面。Vue.js 或 Angular:学习 Vue 或 Angular 等其他流行框架,适应不同项目需求。Svelte:了解 Svelte,它是一个新兴的前端框架,具有编译时优化,能生成高效的原生 JavaScript。 推荐书籍:
《Svelte和Sapper入门》- 朱贺《Svelte 3 Up and Running》- Alessandro Segala(英文)推荐博主/作者:
Rich Harris:Svelte 创始人,YouTube 和 Twitter 上分享 Svelte 的最新动态。推荐书籍:
《React进阶实践指南》- 张鹏《Vue.js权威指南》- 尹成《深入浅出Angular》- 渠成推荐博主/作者:
Evan You:Vue.js 创始人Maximilian Schwarzmüller:JavaScript 和前端框架(YouTube)Tailwind CSS
Tailwind CSS:学习 Tailwind CSS,这是一款功能强大的实用工具类 CSS 框架,可快速构建响应式页面。 推荐书籍: 《Tailwind CSS实战》- Robin Wieruch 推荐博主/作者: Adam Wathan:Tailwind CSS 创始人,发布官方教程和实践Web Components
Web Components:掌握 Web Components 的三个核心技术:Custom Elements、Shadow DOM 和 HTML Templates,构建可重用的前端组件。 推荐书籍: 《Web Components:入门与实践》- 张晓菲 推荐博主/作者: Addy Osmani:谷歌开发者,专注 Web 性能和组件化3. 后端开发
Node.js
Node.js:学习 Node.js 的事件驱动、非阻塞 I/O 模型,构建高效的后端服务,掌握fs
和 http
模块。 推荐书籍: 《深入浅出Node.js》- 朴灵 推荐博主/作者: Ryan Dahl:Node.js 创始人 Express.js 和 Koa.js
Express.js:学习 Express 框架,掌握路由、中间件、错误处理和 RESTful API 开发。Koa.js:了解 Koa,这是由 Express 团队开发的更轻量级框架,使用 async/await 处理中间件。 推荐书籍: 《Express Web应用开发》- Ethan Brown《Koa与Node.js开发实战》- 孙金城 推荐博主/作者: TJ Holowaychuk:Express 和 Koa 的创始人Deno
Deno:学习 Deno 作为 Node.js 的替代品,掌握其原生的 TypeScript 支持和权限控制模型。Oak 框架:使用 Oak 框架开发 RESTful API 或 Web 应用。 推荐书籍: 《Deno 从入门到实践》- 李静 推荐博主/作者: Ryan Dahl:Deno 创始人Next.js
Next.js:使用 Next.js 构建基于 React 的全栈应用,学习服务端渲染 (SSR)、静态生成 (SSG) 和 API 路由。 推荐书籍: 《Next.js全栈开发指南》- 王川 推荐博主/作者: Vercel 官方博客:Next.js 的创造者Fresh.js
Fresh.js:学习 Deno 上的新框架 Fresh.js,支持零 JavaScript 运行时和服务端渲染 (SSR),构建快速的现代 Web 应用。 推荐学习资源: Fresh.js 官方文档和 Deno 社区教程4. 数据库与 API
MongoDB 和 Mongoose
MongoDB:学习 MongoDB 的基础操作,包括 CRUD 操作、集合和索引管理。使用 Mongoose 建立 MongoDB 数据模型,进行验证和查询。 推荐书籍: 《MongoDB权威指南》- Kristina Chodorow(中文译版) 推荐博主/作者: MongoDB 官方博客:提供最新数据库动态和实战案例GraphQL
GraphQL:使用 GraphQL 构建灵活的数据查询 API,掌握如何定义类型、查询和变更。使用 Apollo Server 集成服务端。 推荐书籍: 《GraphQL实战》- 吴金良 推荐博主/作者: Ben Awad:GraphQL 教程分享(YouTube)5. MERN Stack 和 React Native
MERN Stack
MERN Stack:学习 MERN Stack,包括 MongoDB、Express.js、React.js 和 Node.js,掌握如何使用这些技术堆栈构建全栈应用。 推荐书籍: 《Fullstack React》- Anthony Accomazzo 等 推荐博主/作者: Traversy Media:提供 MERN Stack 实战项目教程(YouTube)React Native
React Native:学习如何使用 React Native 开发跨平台移动应用,掌握组件、状态管理和路由的使用。 推荐书籍: 《React Native实战》- 黄轶 推荐博主/作者: The Net Ninja:React Native 教程(YouTube)6. 工程化与部署
前端工程化
Webpack 和 Vite:学习使用 Webpack 或 Vite 进行模块打包和项目构建,提升开发效率和性能。 推荐书籍: 《深入浅出Webpack》- 陈利兴《Vite 实战开发》- 郑林森 推荐博主/作者: 胡子大哈:Webpack 和前端工程化教程(YouTube)Docker
Docker:学习使用 Docker 容器化应用,掌握 Dockerfile、镜像和容器管理,提升开发和部署效率。 推荐书籍: 《Docker入门与实践》- 朱双印Bret Fisher:Docker 教程和课程的专家,提供从基础到进阶的 Docker 资源持续集成与部署 (CI/CD)
GitHub Actions:学习如何使用 GitHub Actions 进行持续集成(CI)和自动化部署(CD)。设置 GitHub Actions 工作流来测试、构建和部署项目,确保代码质量,优化交付周期。 推荐书籍: 《持续交付:发布可靠软件的系统方法》- Jez Humble(中文译版) 推荐博主/作者: 李运华:DevOps 和 CI/CD 专家,分享自动化部署和持续集成的最佳实践Stackless 和 JAMstack
Stackless:一种简化的开发架构,强调最小化堆栈依赖和减少复杂性,适合构建高性能和可扩展的应用。JAMstack:学习 JAMstack(JavaScript, APIs, Markup),理解其构建静态网站的理念,提升性能和安全性。JAMstack 通过预构建和动态请求减少服务器负担。 推荐书籍: 《JAMstack:现代网站开发》- Mathias Biilmann 和 Phil Hawksworth 推荐博主/作者: Netlify 和 Vercel 官方博客:提供 JAMstack 的最佳实践和示例7. 安全与测试
Web 安全
JWT 和 OAuth:学习使用 JSON Web Token (JWT) 和 OAuth 实现用户认证和授权,确保 Web 应用的安全性。 推荐书籍: 《Web安全深度剖析》- 毛向辉 推荐博主/作者: Troy Hunt:安全专家,Have I Been Pwned 创始人测试
Jest 和 Mocha:掌握 Jest 和 Mocha 测试框架,编写单元测试,确保代码质量和可靠性。 推荐书籍: 《JavaScript测试驱动开发》- 李松峰 推荐博主/作者: Kent C. Dodds:前端测试和 React 教程分享8. 未来趋势
WASM(WebAssembly)
WASM:了解 WebAssembly 作为一种新兴技术,能够在浏览器中高效运行编译后的代码。学习如何使用 Rust 等语言生成 WASM 模块,以提高性能和安全性。Rust 的重要性:Rust 在 WASM 中的重要性日益凸显,因其内存安全、并发性和高性能,适合开发高效且安全的 Web 应用,成为 WebAssembly 的热门选择。 推荐书籍: 《Programming WebAssembly with Rust》- Kevin Hoffman(尽管是 Rust 的书,但强调了 Rust 在 WASM 中的重要性) 推荐博主/作者: Luca Pucella:分享 WebAssembly 相关内容的博主Web Components
Web Components:掌握 Web Components 的概念,构建可重用和独立的组件,促进组件化开发,增强前端的可维护性和可扩展性。 推荐书籍: 《Web Components:入门与实践》- 张晓菲 推荐博主/作者: Addy Osmani:谷歌开发者,专注 Web 性能和组件化Stencil
Stencil:学习 Stencil.js,这是一个用于构建可复用 Web 组件的编译器,结合了现代框架的优点,能够生成高效的 Web Components。 推荐书籍: Stencil 官方文档(https://stenciljs.com/docs/overview) 推荐博主/作者: Ionic Team:Stencil 的开发团队,提供丰富的资源和文档Svelte
Svelte:深入学习 Svelte 及其编译时优化特性,生成高效、最小化的代码,省去运行时开销,打造性能优越的 Web 应用。 推荐书籍: 《Svelte和Sapper入门》- 朱贺《Svelte 3 Up and Running》- Alessandro Segala 推荐博主/作者: Rich Harris:Svelte 创始人,YouTube 和 Twitter 上分享 Svelte 的最新动态Deno
Deno:进一步学习 Deno 的现代化特性,如内置 TypeScript 支持、简单的模块导入、优雅的权限控制等。 推荐书籍: 《Deno 从入门到实践》- 李静 推荐博主/作者: Ryan Dahl:Deno 创始人,分享 Deno 的发展和应用案例GraphQL
GraphQL:学习 GraphQL 的灵活性和强大功能,了解如何在复杂应用中有效管理数据交互。 推荐书籍: 《GraphQL实战》- 吴金良 推荐博主/作者: Ben Awad:GraphQL 教程分享(YouTube)Island 架构
Island 架构:一种新的网页架构理念,允许在页面中只加载必要的部分(即“岛屿”),以提高性能和用户体验。这种方法强调模块化和懒加载。 推荐资源:查阅相关的技术博客和文章,例如 Partytown 相关文档模块化与组件化
模块化与组件化:在前端开发中,强调代码的模块化和组件化,使用现代 JavaScript 工具(如 ES Modules、Webpack 等)将代码拆分为小模块,提高代码的可读性和可维护性。 推荐书籍:一般性书籍,如《JavaScript设计模式》可以提供相关的模块化与组件化思维。推荐博主/作者:关注各大前端开发者的个人博客和技术分享真实 DOM 和零开销
真实 DOM:理解真实 DOM 与虚拟 DOM 的区别,及其对性能的影响,掌握在实际应用中如何优化渲染性能。
零开销:在现代 Web 开发中,追求零开销的理念,减少不必要的代码和资源消耗,提升应用的响应速度和用户体验。
JavaScript 历史
JavaScript 自 1995 年由 Brendan Eich 在 10 天内开发完成以来,经历了巨大的变化。以下是 JavaScript 的重要历史节点及相关浏览器技术的发展:
1995:JavaScript(最初称为 Mocha,后更名为 LiveScript,再更名为 JavaScript)由 Netscape(网景) 在其 Netscape Navigator 浏览器中首次引入。Netscape Navigator 是当时最流行的浏览器之一。
1996:微软推出了 JScript,这是微软的 JavaScript 实现,并首次集成在 Internet Explorer 3.0 中,标志着浏览器大战的开始。
1997:JavaScript 第一个版本的标准化,由 ECMA 发布为 ECMAScript 1,奠定了 JavaScript 成为全球浏览器标准的基础。
1998:Netscape 宣布其浏览器的源代码开放,创建了 Mozilla 项目。这个项目最终演变成今天的 Firefox 浏览器。
2004:Mozilla Firefox 1.0 发布,它是 Netscape Navigator 的开源继承者。Firefox 专注于标准化和用户体验,成为了 IE 的主要竞争对手之一。
2008:Google Chrome 浏览器发布,基于 V8 JavaScript 引擎,大大提升了 JavaScript 的执行速度。Chrome 迅速成为全球最流行的浏览器,推动了现代 Web 开发的发展。
2015:发布了 ES6(ECMAScript 2015),引入了包括箭头函数、类、模块、模板字面量、let/const 变量等重要特性,极大提升了语言的现代化水平。
2017:Google 将 Chrome 浏览器的引擎作为开源项目发布,命名为 Chromium,为包括 Microsoft Edge 在内的多个浏览器提供内核支持。
2019:Deno 作为 Node.js 的现代替代品由 Ryan Dahl 发布,专注于安全性和原生 TypeScript 支持。
2020:JavaScript 迎来 25 周年,成为世界上使用最广泛的编程语言之一。
现代:JavaScript 继续发展,每年通过 ECMAScript 更新引入新特性,推动 Web 和全栈开发的技术进步。Chrome、Firefox 和其他基于 Chromium 的浏览器继续主导现代 Web 的发展。
推荐资源
《JavaScript 20年》 - Allen Wirfs-Brock 和 Brendan Eich:记录 JavaScript 历史、发展及演变的里程碑之作,展现了 JavaScript 从诞生到成为全球最流行编程语言的全过程。JavaScript 社区推荐
JavaScript 拥有全球最大的开发者社区,以下是一些推荐的社区和平台,帮助你保持与最新技术的同步,并从社区中学习和分享经验。
社区和论坛
Stack Overflow(JavaScript 板块)
Stack Overflow 是开发者首选的问答平台,JavaScript 板块是其中最活跃的部分之一。你可以通过提问、回答问题、查看其他开发者的讨论来解决技术难题。
https://stackoverflow.com/questions/tagged/javascript
Reddit(/r/javascript)
一个活跃的 JavaScript 讨论社区,定期发布最新的工具、技术和最佳实践。
https://www.reddit.com/r/javascript/
Hashnode
这是一个开发者博客平台,你可以在这里阅读到 JavaScript 开发者分享的文章和教程,参与讨论,甚至创建自己的技术博客。
https://hashnode.com/
TC39
TC39 是负责 JavaScript(ECMAScript)标准制定的技术委员会,任何新的 JavaScript 语言特性都会通过 TC39 提案讨论和采纳。你可以在 TC39 的 GitHub 上了解新提案进展和标准化过程。
https://github.com/tc39
Vue.js 官方社区
Vue.js 是由尤雨希(Evan You)创建的轻量级前端框架,Vue 的官方社区提供开发者讨论、插件共享和问题解答等丰富内容。
https://forum.vuejs.org/
JavaScript 大会和线上活动
JSConf
JSConf 是全球最大的 JavaScript 开发者大会之一,吸引了来自世界各地的 JavaScript 开发者和专家。大会讨论前端、后端、全栈开发,以及 JavaScript 生态系统中的新兴技术。
https://jsconf.com/
Node.js Interactive
这是专注于 Node.js 生态的年度大会,主要面向全栈和后端开发者,内容包括 Node.js 的最新功能、性能优化及最佳实践。
https://events.linuxfoundation.org/
State of JS
每年发布的 JavaScript 社区调查报告,展示了 JavaScript 生态系统中最流行的框架、库、工具及未来趋势,是开发者了解行业动态的重要参考。
https://stateofjs.com/
JavaScript 新闻和博客
JavaScript Weekly
一份每周发布的 JavaScript 邮件新闻,汇总最新的 JavaScript 文章、教程、工具和库。订阅后可以快速了解 JavaScript 领域的最新动向。
https://javascriptweekly.com/
Dev.to
开发者分享博客和社区,涵盖 JavaScript、前端开发、全栈开发等话题,拥有丰富的开发者内容。
https://dev.to/
Echo JS
JavaScript 专题的新闻聚合网站,提供最新的库、工具和开发实践。
http://www.echojs.com/
JavaScript 社区贡献者
Brendan Eich:JavaScript 创始人,Mozilla 和 Brave 的创始人,持续推动 Web 技术创新。
Twitter
Addy Osmani:谷歌 Chrome 团队成员,专注于 Web 性能优化和 JavaScript 开发最佳实践。
Twitter
尤雨希(Evan You):Vue.js 的创始人,专注于轻量化和高性能的前端框架,在开源社区中非常活跃。
Twitter
Sarah Drasner:著名前端开发者,专注于 Vue.js 和 D3.js,活跃于开源社区。
Twitter
Kent C. Dodds:React 和前端测试领域的专家,JavaScript 教育者,著有多个 React 教程和测试工具的贡献者。
Twitter