Mozilla开发人员网络(MDN):最佳工具和指南入门

披露: 您的支持有助于保持网站的正常运行!我们会为此页面上推荐的某些服务收取推荐费.


Mozilla开发人员网络是Web开发人员,设计师,学生,专业编码人员和热心业余爱好者的社区网站-任何对学习为Web编写代码或提高其编程技能感兴趣的人。它汇集了文档,参考资料,教程,Mozilla特定的信息以及一系列可帮助您改进代码的工具。.

此外,Mozilla开发人员网络还提供一系列社交和协作服务,包括博客和IRC频道。邀请成员建立联系,参与其中并为Mozilla的许多开源项目做出贡献.

什么是Mozilla?

Mozilla是一家非营利组织,以开源浏览器Firefox而闻名。该组织成立于1990年代后期,当时Netscape免费发布了其网络浏览器Netscape Communicator。最初,Mozilla组织只是一个主要在Netscape内部的小组,负责管理这个新开放源代码浏览器的开发。 2003年,非营利性Mozilla基金会成立。 AOL(Netscape的母公司)将相关知识产权转移到基金会,支付了员工时间,并捐赠了200万美元.

Mozilla继续开发和改进Firefox浏览器,但也大大扩展了其范围。他们的任务是“捍卫所有人的互联网自由”。他们以多种方式做到这一点,包括为各种平台提供开源浏览器,倡导与自由开放的互联网一致的公共政策,在整个行业推广开放的Web标准以及通过其Mozilla开发人员网络对开发人员进行教育。.

文档和教程

MDN的大部分工作是提供有关网络技术的大量文档。他们可以说是关于HTML的最完整参考,其中数百页详细介绍了HTML元素,浏览器API,Web套接字,脱机存储以及现代Web的所有其他细节。.

此外,还有其他基本网络技术(例如JavaScript和CSS)的开发人员文档和教程,以及有关可访问性,网络安全,网络应用程序开发以及许多其他主题的开发人员指南。.

所有这些文档和教程项目,包括它们自己项目的文档,都旨在促进使用开放式Web标准进行开发。他们的资料针对所有级别的开发人员;从对HTML的非常基础的介绍到如何在HTML5中构建游戏的教程。此外,该网站的大多数页面都被翻译成多种不同的语言,从而使MDN具备了在全球范围内教授开放式Web开发实践的独特能力.

开发者工具

除了提供有关Web技术的深入文档外,MDN还通过开发许多高质量,免费和开源的开发工具来帮助Web工作者。这些工具是Firefox浏览器项目的一部分,并且大多数内置于Firefox浏览器中(或与Firefox浏览器一起使用).

Firefox开发人员工具很多。以下是一些要点:

  • Scratchpad可让您尝试使用JavaScript,并提供一个小型JS代码编辑器。在当前网页中执行用暂存器编写的代码.
  • 样式编辑器与此类似,它允许您随时添加,编辑或删除网站上的任何CSS。.
  • Shader Editor使您可以编辑WebGL JavaScript图形渲染库使用的顶点和片段着色器.
  • 页面检查器使您可以轻松地编辑和修改页面的源HTML.
  • Web Console提供对页面渲染期间生成的性能和错误日志的访问,并允许用户执行任意行的JavaScript;类似地,浏览器控制台为整个浏览器提供相同的信息,而不仅仅是单个网页.
  • 调试器使您可以一次一行地浏览JavaScript,从而帮助您跟踪发生错误的位置.
  • 网络监视器说明了浏览器发出的所有请求,并显示了响应,错误和性能信息.
  • Storage Inspector提供了一种访问和操纵多种类型的浏览器存储的方式,例如缓存,cookie,本地存储,会话存储和IndexedDB。.
  • DOM属性查看器允许您以可扩展的树形结构查看文档对象模型(浏览器在活动内存中的网页的内部表示形式),并浏览每个DOM元素的属性.
  • 吸管的工作方式类似于Photoshop和其他图形程序中的吸管工具,可让您在浏览器中找到任何像素的确切颜色.
  • 查看源代码可让您查看当前页面的原始HTML源代码.
  • 响应式设计模式会自动将视口缩放到几种预设或自定义尺寸,以模拟小屏幕尺寸,例如在手机,平板电脑和其他设备上发现的尺寸.
  • Paint Flashing Tool突出显示了视口的某些部分,这些部分必须根据输入进行重新绘制(重新渲染).
  • 浏览器工具箱使将为网页设计的开发人员工具应用于整个浏览器以及浏览器插件和附加组件成为可能。.
  • 效果工具可提供有关网站响应速度和速度的详细信息。这包括几个用于查看网站性能各个方面的子工具:
    • 瀑布图显示了浏览器在加载和呈现时间内的活动情况.
    • 调用树使用统计分析来确定哪些JavaScript函数消耗了最多的计算时间.
    • 火焰图使用与“调用树”相同的数据集,以提供按时间顺序排列的读数,以显示何时执行JavaScript函数.
    • 分配显示执行期间每个JavaScript函数分配的内存量.
  • WebIDE是一个集成开发环境,用于构建,测试和调试为Firefox OS构建的移动应用程序。此外,WebIDE使其他Firefox开发工具与移动Web浏览器一起使用成为可能。.

这些开发工具可以扩展,并且MDN提供用于扩展开发的附加SDK。扩展可以用网络语言(HTML,CSS,JavaScript)编写。该SDK为浏览器的几乎每个方面都提供了JavaScript API.

Firefox开发人员版

Firefox Developer Edition是Firefox的专业发行版,它使开发人员工具居于首位。此版本中的开发人员工具是顶级GUI的一部分,没有隐藏在菜单后面。此外,开发人员版中包括新工具的实验版和Beta版,然后才发布到主浏览器中。最后,元素检查器中的代码视图,源代码视图和其他工具以深色主题显示,让人联想到Sublime和Atom等流行代码编辑器.

与MDN社区连接

Mozilla开发人员网络不仅是一组资源,而且Mozilla基金会也不只是一个非营利组织。 Mozilla是一个世界性的社区,成员广泛,从基金会聘用的核心开发人员到翻译页面或修正错字的志愿者.

有很多连接和参与的方式:

  • Mozilla IRC Server是与Mozilla社区成员聊天最活跃的场所之一。他们针对不同主题运行多个渠道。如果您只是想找路,不妨尝试#newbies.
  • Mozilla Wiki是社区创建的网站,其中包含与Mozilla相关的所有信息.
  • Mozilla开发人员网络站点上的几乎每个页面都是社区编辑的。如果发现拼写错误或有待改善的地方,则可以注册一个帐户,然后正确解决问题。不过,请务必先阅读如何进行社论审查.
  • 如果您想以开发人员的身份参与Mozilla的任何工具,可以找到相应的GitHub页面并开始使用.
  • 您甚至可以在Mozilla找工作或成为志愿者.

摘要

Mozilla开发人员网络以及更大的Mozilla基金会,是最重要的组织,旨在为开放Web进行宣传,倡导和教育。他们的工具和教程将使您成为更好的Web开发人员,并且与更大的社区一起参与将以其他方式无法扩展的专业网络。从许多方面来说,它们都是网络的核心。如果那是您想要的地方,那么您最好去探索他们所能提供的东西,并参与其中.

进一步阅读和资源

我们有更多与编码和开发有关的指南,教程和信息图:

  • 撰写优质的HTML和验证器:在网络上呈现信息的基础.
  • JavaScript简介:世界上最流行的编程语言,现在也用在服务器端.
  • CSS3 —简介,指南和资源:有关如何显示现代网页的所有信息.

您应该学习什么代码?

对应该学习哪种编程语言感到困惑?查看我们的信息图,您应该学习什么代码?它不仅讨论了语言的不同方面,还回答了一些重要问题,例如:“我将以编程为生赚多少钱?”

您应该学习什么代码?
您应该学习什么代码?

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map