开始前端 Web 开发
由 Mux 赞助的 DEV 全球展示挑战赛:展示你的项目!
学习前端Web开发已成为开发人员的必备技能之一。典型的Web应用程序包含多种技术和框架。如果未掌握Web开发的基础技能就直接使用前端框架或库,可能会导致挫败感。
本文旨在介绍一系列基本的网页开发技能以及学习这些技能的资源。
互联网是如何运作的?
作为一名网页开发人员,了解当发出访问网页的请求时会发生什么情况非常重要。
资源
- MDN Web Docs是学习它的绝佳资源。
- 这里还有一篇关于“互联网是如何运作的?”的文章,特别是这段10分钟的YouTube视频,绝对值得一看。
HTML基础知识
HTML是超文本标记语言( Hyper Text Markup Language)的缩写。HTML定义了网页的内容和结构。
要学什么?
- 网页的整体结构,包括诸如 <div>
<html>、<span><head>、 <img> 等高级标签<body>及其重要性。 - HTML5 中引入的标签。
- 浏览器是否支持较新的 HTML 标签?您可以在Can I Use网站上查看。
资源
MDN HTML基础文档是一个很好的入门资料。
CSS基础知识
CSS 是 Cascading Style Sheet 的缩写。如果说HTML定义了网页的内容,那么 CSS 则有助于打造美观专业的网站。
要学什么?
- 定义风格的不同方式以及围绕风格的最佳实践。
- CSS中如何定义不同类型的选择器?
- 什么是特异性?
- 常用的CSS属性有哪些?
- 现代 CSS 功能的跨浏览器支持
- 了解如何检查网页上给定元素使用的样式。
资源
- 学习CSS基础知识的首选是MDN文档。
- 另一个很棒的资源是Udemy 上的 CSS 课程,它涵盖了许多 CSS 基础概念以及一些高级功能。
JavaScript基础知识
如果网站需要某种动态功能,JavaScript 就必不可少。例如,有些网站需要根据用户访问的时间显示个性化问候语。要实现这类动态功能,JavaScript 就必不可少。
要学什么?
- 理解语言基础知识
- 熟悉如何通过浏览器开发者控制台进行 JavaScript 调试。
- 熟悉 ES6 特性
资源
再次强调,MDN Docs 的JavaScript 入门部分是学习 JavaScript 基础知识的好去处。
进一步学习
Free Code Camp 的响应式网页设计认证是开启网页开发之旅的另一个绝佳资源。
照片由Unsplash上的 Markus Spiske 拍摄
文章来源:https://dev.to/dev0928/get-started-with-front-end-web-development-1l5j