如何成为前端开发人员(2020版)?

您希望如何在世界领先的公司工作,同时通过优美的前端开发产生影响?


对现代网络杰出艺术家的需求很高,本指南将向您展示如何入门.

而且,由于使用该软件的人员是最受好评的人,因此您值得考虑使用这项新技能。您永远不会知道,它最终可能会为您发展职业.

本指南的第一部分致力于回答有关前端开发的紧迫问题。如果您了解担任前端开发人员的职责,薪水和其他方面,则可以跳过第二部分。本指南的第二部分专门介绍资源,教程和技巧.

什么是前端开发?

前端Web开发是使用HTML,CSS和JavaScript创建独特的Web应用程序的实践。网站,移动网站等应用程序,以及移动应用程序和 渐进式Web应用.

您也可以这样想,您浏览的每个网站(包括该网站)都是由前端开发人员以某种方式构建的。至少在客户端.

新CSS如何改变Web演讲者甲板上图形设计的一切曾经需要大量工具和框架的现在可以使用本机规范来完成.

尽管前端是网站开发中最易访问的路径之一,但它也可能是最具挑战性的之一.

创建网站的技术一直在变化,这意味着开发人员必须定期使自己的技能适应最新的实践。对于初学者来说可能很累,但是经过一两年的扎实开发实践会变得更好.

您可以免费学习前端开发吗?

你绝对可以!

学习网络开发变得越来越容易,这主要归功于大量新资源,教程和开源项目的涌入.

诸如freeCodeCamp之类的项目正在帮助数百万人为他们的第一个程序编写代码。和 freeCodeCamp博客 充满了激动人心的文章,不仅涉及前端,而且涉及Web开发的其他方面。值得收藏!

代码语法示例看起来复杂吗?实践变得更容易!

尽管本指南的目的是帮助您免费学习,但我们不能忽视付费课程的好处.

那里有很多初创公司迎合了坚定的人群,我们将重点介绍一些令人惊叹的课程平台,甚至在结束时还会为您提供证书.

前端开发人员的平均工资是多少?

具有过往经验的前端开发人员可以带回家更多 每年$ 100,000 如果居住在美国.

这个数字不错!

初级开发人员可以期望从任何地方带回家 $ 60,000及以上.

美国前端开发人员的平均工资

欧洲的工资似乎也很合理。德国有 每年平均$ 50,000.

值得注意的是 远程工作的普及 近年来出现了爆炸式增长,这意味着开发人员正在寻求使他们的薪酬全面达到国际标准。这更是考虑成为前端开发人员的原因!

如何找到工作作为前端开发人员?

从技术上讲,工作应该是最后要谈论的事情。首先,您必须积累技能,然后考虑潜在的机会。但是,由于本文的结构仅供参考,您可以随时回来查看本节以供参考.

远程作业开发人员设计撰写客户支持更多远程工作正以前所未有的速度增长。毕竟,谁不喜欢在家工作,甚至不喜欢直接在海滩工作的想法?

以下是前端开发人员最受欢迎的工作板列表:

这是一个有点精简的站点列表,为您找到下一个前端工作提供了建议。您还有其他选择是进行个人项目,以期使其盈利或花费时间从事自由演出。.

资源:从哪里开始.

以下资源都是有关入门的。在这方面,我们正在采取合理的线性方法。出于简单的原因,那里有大量资源.

为使您快速入门,我们专注于编织在现代工作流程中的平台和前端工具。因此,您可以学习基础到中级的编码语法,同时了解控制现代开发人员工作流程的工具.

强烈建议您花些时间使用这些资源,因为它们将为您准备本指南第二部分中的课程和教程.

密码学

密码学

如果您花了几分钟来查找学习编码的资源,那么Codecademy无疑将是您的第一选择。这个学习编码的平台是众所周知的,在过去七年中已经为超过1亿人服务.

当时,Codecademy的动态和交互式编码界面是一个革命性的东西。尽管许多人都走同样的路,但Codecademy保持了一致的记录.

如今,您可以在结业后获得证书,并且许多人已经使用了该证书将自己找到工作。 顶级启动;作为初级开发者,不少于.

一直以来 认为Codecademy不够的论点.

从经验丰富的开发人员的角度来看-当然,这个平台可能太简单了。但是,如果您只是在学习前端开发,那么没有比按照逐步说明获得实时结果更令人满意的了.

Codecademy提供有关HTML5,CSS3,SASS,Python,JavaScript,Ruby,SQL和Java的类.

了解CSS布局

了解CSS布局

作为前端开发人员,您将花费合理的时间来处理布局。布局是您用来构建网站的画布。此博客文本位于一行内,该行是较大容器的一部分.

这适用于所有网页设计。使用Learn CSS Layout,您可以基本了解容器和行的工作方式,以及如何将内容准确定位在所需的位置.

您可以探索的其他工具是 Flexbox Froggy 对于 弹性盒 基本面和 网格花园 对于 格网 基本面.

布局是一个非常重要的主题,因此请花大量时间深入了解您的布局经验。最好的学习方法是通过练习.

引导程序

博客模板·引导程序

了解布局的工作原理后,就该进行一些具体的实验了。当然,您可以继续尝试将自定义用户界面开发为您的第一个项目,但这可能会吓跑您,而不仅仅是鼓励您继续.

因此,您需要了解一两个框架。框架是开始任何类型的Web开发的简单方法。您将获得在第一天就开始构建交互式网站的工具和文档。 Bootstrap是有史以来最好的方法之一.

自举线框套件使用世界上最受欢迎的前端组件库,在网络上构建响应式,移动优先的项目。 Bootstrap是一个用于使用HTML,CSS和JS开发的开源工具包.

Bootstrap在所有Web上都得到了广泛使用,毫无疑问,它是世界上最受欢迎的前端框架之一.

哎呀,您每天访问的网站中有很大一部分都在使用某些Bootstrap功能.

关于Bootstrap的奇妙事情之一是 您可以多快开始. 文档页面包含示例和用例。最重要的是,Bootstraps布局系统在设计时就考虑了响应式设计。因此,您基于Bootstrap的网站会自动移动友好.

而且,如果您喜欢Bootstrap所提供的功能,那么以下是流行的前端框架上的其他资源:

  • 您应该知道的10个最佳JavaScript框架
  • 适用于前端开发人员的10个最佳CSS框架

前端清单

前端清单

尽管使用了用于构建网站的技术,但仍必须遵守某些规则和规定。当然,可以选择忽略这些要求,但要以牺牲用户体验和数字兼容性为代价.

前端清单是一个出色的工具,您可以在其中提供网站URL,平台会审核您的网站,以获得前端开发中的最佳实践。这包括检查您是否优化了图像或是否遵循了最佳SEO做法.

只要您需要了解专业网站和应用程序的现代要求,就应该尝试使用该应用程序。此外,非侵入式且流畅的UI是与之共事的绝对乐趣.

Vue.js

Vue js

Vue.js是一个很好的示例,它展示了一个小想法/概念如何发展成为世界上最受认可的事物之一。确实,Vue.js席卷了前端社区.

这个渐进式框架可帮助开发人员使用HTML和JavaScript构建出色的用户界面.

该框架完全由社区支持-在金融和发展方面.

这是开源如何融合在一起并使伟大的事情发生的完美示例。而且,作为前端开发人员,您应该学习更多有关 开源及其重要性.

以下是有关Vue.js的一些强烈推荐的读物:

最后但并非最不重要的一点是,在以下位置检查使用Vue.js构建的不同项目 Vue.js展示 网站.

前端基础知识

前端基础知识

到目前为止,我们观察到的所有内容大部分都是免费和开源的。您只需要抓住自己 崇高文字, 而且您可以很好地进行前端实验,绝对应该!阅读教程和框架文档只是成功的一半.

真正的学习发生在您的文本编辑器和浏览器中。这种方法的唯一缺点是,它不是完全系统的。您采用的是免费模式,结果可能会因您自律的能力而异.

除非您决定投资并通过投资,否则我的意思是花一笔象征性的款项从中购买任何前端书籍 一本书. 这些家伙是业内最好的一些,资深的前端开发人员反复推荐他们的书.

前端基础知识部分有一本有关SVG,CSS,HTML,JavaScript和Sass的书,这是现代前端工作流的理想起点.

的GitHub

的github

GitHub是您进行所有内容编码和开发的数字办公室。它是世界上最大的开源平台,是世界上大多数最受欢迎的框架和工具的所在地.

使用GitHub,您可以托管您的项目,并欢迎其他人提交他们的文稿。您可以自己向其他项目提交文稿.

您还可以浏览GitHub及其提供的所有内容。例如,GitHub是著名的Awesome列表的所在地,这些列表包含了大量针对特定框架和技术的教程,资源,工具和其他内容。.

例如., 很棒的前端列表 包括有关前端及其去向的最新信息。.

堆栈溢出

堆栈溢出徽标

Stack Overflow以最严格的Q而闻名&世界上的一个编程站点. 真的是这样.

Stack Overflow的用户不会轻易提出尚未研究或适当分析的问题。虽然这可能令人反感,但有助于建立强烈的目标感.

您会看到,每当一个用户提交问题答案时,其他用户都可以挺身而出并投票赞成该答案。最后,您会获得几个“已验证”的答案,可以彻底回答用户的问题。结果,该站点的层次结构保持清晰一致.

作为初学者前端开发人员,您将需要使用Stack Overflow来了解某些主题,还可以询问是否必须这样做。不过,对于大多数初学者而言,您应该能够在几秒钟内找到简洁的答案.

讲解 & 课程:掌握生态系统.

第一部分完全致力于可帮助您入门的资源和平台。您应该在我们列出的每种资源上花费合理的时间,以便对前端开发的期望有一个实际的感受。.

完成所有这些操作后,您就可以将注意力转向教程和课程。这些是组织更严格的资源,非常注重学习.

前端频谱前端开发是工具,框架,库,测试软件等等的集合。但是,不要让它的纯粹范围吓到你!

值得注意的是,以下一些课程不是免费提供的。但是,我们向您保证,以下建议绝对是最重要的.

此外,像Frontend Masters这样的平台将使您掌握世界上最成功的初创公司使用的所有技术.

这篇文章的目的不是要作为一种兴趣来促进前端开发,而是要为您提供可触知的资源,以便您可以利用自己的所有知识来建立自己的职业.

MDN网络文档

MDN网络文档

MDN(Mozilla开发人员网络)将使您相识。该Web文档平台完全致力于推广Web的工作方式。在这里,您可以了解开发人员工具,Web技术和Web开发本身.

当您搜索CSS或HTML上的某些详细信息时,通常是MDN成为Google和其他搜索引擎上的第一个结果。指南,规范和整体见解的结构对于前端开发人员来说是有意义的.

edX前端课程

前端Web开发edX

如本指南前面所述,遵循严格的课程是学习和适应的线性方式。为了让您开始学习这些课程,您必须查看edX提供的内容。您不仅可以在完成课程后获得证书,还可以按照自己的喜好学习.

edX课程结构全面,重点明确地放在帮助学生理解每个课程主题的基础上。目前,您可以学习JavaScript,HTML5,CSS3等技术.

如果您希望获得完整的前端证书,则必须进行$ 500的少量投资-但这也使您可以直接与课程讲师联系,甚至更多。许多公司已使用edX将其员工注册为该特定计划.

前端大师

前端大师

前端大师类似于训练营的经验。您可以在此平台上找到非常全面的课程,重点是长篇内容和面向项目的学习.

在这里,您可以了解React,Vue,Angular,Node.js等技术。生产质量非常高,因此您可以享受与实际的Bootcamp课程类似的体验.

作为注册用户,您可以在 学习 页。此页面跟踪您的学习进度,分别显示每种技术的百分比,还显示整个堆栈的百分比。这是保持动力的有趣方式.

最后但并非最不重要的一点是,您的雇主不会忽略在您的履历上完成“前端硕士”课程的情况.

蛋头

蛋头

Egghead与上面提到的平台非常相似,但是在更加坚定和精练的课程中脱颖而出。例如,“使用ListViews在Flutter中构建动态列表”课程只有2分钟,尽管它为您提供了足够的学习材料来真正理解该概念.

Egghead提供有关框架,库,语言,工具和平台的教程和课程。想了解移动开发吗?没问题,Egghead拥有适用于iOS,Android和其他平台的课程资料.

年度定价为$ 250美元,但您可以使用该网站上的每门课程和教程。您还可以与其他社区成员讨论每节课。值得投资!

CSS技巧

CSS技巧

克里斯·科耶尔 是CSS社区中的绝对传奇。他不仅跟上了CSS-Tricks长达十年之久,还是他的联合创始人 密码笔 — Web开发人员的流行代码共享平台.

关于CSS-Tricks,您可以指望的一件事是它始终保持更新,并且根据当前流行的主题和技术来发布故事。因此,您可以使用该网站许多作者提供的教程来快速提高技能.

简而言之,这是一个有用的网站,可保存您的书签并每天检查一次。您将从教程本身中获得巨大的价值,并且从中获得建议.

苏格兰人

顶级货架Web开发培训―苏格兰

Scotch既是学习资源,又是Web开发最新动态的场所。自2014年以来一直存在-该网站已吸引了众多关注者以及数千个免费的Web开发教程.

苏格兰作家非常关注Vue,React,Laravel,Angular,JavaScript,Node.js等技术。而且也不认为这些是一些入门教程.

在大多数情况下,您将要构建真实且有形的应用程序。例如。您是否想学习如何构建Twitter克隆Vue和Adonis?没问题,只需注册免费课程,您就会被设置.

很棒的网站,不能为任何新的和现有的前端开发人员推荐它!

提示:如果没有斗争,就没有进步.

既然您已经做到了这一点,那么您不妨沉迷于以下一些技巧。尽管前端是一种有利可图的职业选择,但它涉及到相当陡峭的学习曲线,并且在当前时间轴上缠头时会有些头疼.

不过,对于您可以吸引的机会而言–进行艰苦的战斗是值得的!

理性学习.

为什么要学习编程?您想找到更好的工作吗?您想建立有创意的网站吗?找出您的原因,因为它将派上用场。当您将头撞在墙上时,即使在几天甚至几周内,它也会派上用场-质疑其中的任何一项是否值得.

找到你的部落.

您将需要与志趣相投的人至少建立一些联系,甚至可能与导师建立联系。当我去老学校的CS老师那里借一本Pascal的书时,他非常友好,乐于接受帮助我解决任何可能出现的问题的想法。通过查找本地社区或在线社区中的其他开发人员,考虑类似的路线。当有人将手指指向您需要看的地方时,学习起来要容易得多.

避免学习一切.

不必承担必须自己了解所有事情的负担。说到前端,从HTML5和CSS3开始已经绰绰有余。 JavaScript就像锦上添花,因此要小心获得多少糖衣,因为这可能会肿自己!熟悉基础知识之后,探索新领域,主题和框架。小而紧凑的学习咬是关键.

如果您想了解更多,请阅读 这个帖子由阿里·斯皮特尔(Ali Spittel) 她为新开发者分享了25多个技巧.

走出去

你在等什么?出去那里,开始学习!确保每隔几个月复查一次有关前端开发的指南,以获取新的更新和提示.

祝好运!

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