全栈开发和web开发
Full stack web developers are the Swiss Army knife of the code world. Having that designation means you can produce end to end solutions, which is a highly marketable and agile skillset. But what does it actually take to achieve that status?
全栈Web开发人员是代码世界的瑞士军刀。 拥有该名称意味着您可以生产端到端解决方案,这是一种高度可销售且敏捷的技能组。 但是,要达到那个地位实际上需要做什么呢?
Whether you're new, seasoned, or specialized in one end of the stack, there's a lot to digest here. Feel free to dive in from the top or bounce around to where you need the most support.
无论您是新手,经验丰富的还是精通堆栈的一端,这里都有很多需要消化的东西。 随时从顶部潜入水中或弹跳到您需要最多支持的地方。
首先,是什么真正使开发人员全满? (First off, what really makes a developer full stack?)
It’s fun and buzzy to say any front end developer is a full stack developer, but being able to deploy a website to Netlify doesn’t make you full stack.
可以说任何前端开发人员都是全栈开发人员 ,这很有趣而且很嗡嗡,但是能够将网站部署到Netlify并不能使您成为全栈开发人员 。
This isn’t meant to be discouraging – just realistically, only having that experience won’t hold up well to that job title in your next interview. While you’re technically creating and deploying your work from start to finish, Netlify, Zeit, and other providers give you the power to do this with their magical tools that take the majority of the stack operations work out of the equation.
这并不是要令人沮丧-只是现实地,只有拥有这种经验才能在您的下一次面试中胜任该职位。 从技术上讲,从头到尾创建和部署工作时,Netlify, Zeit和其他提供程序使您能够使用其神奇的工具来执行此任务,这些工具使大多数堆栈操作工作变得不那么重要。
That’s not to take away from what we’re all able to accomplish now as front end devs. The growing movement to compile and deploy static websites has just made this process simpler on the later half of the stack with benefits across the board.
这并不是要摆脱我们作为前端开发人员现在能够完成的工作。 编译和部署静态网站的运动日渐增多,这使得该过程在堆栈的后半部分变得更加简单,并且全面受益。
Additionally, with the flexibility of tooling options like being able to run JS on a server, our skillsets are able to transfer to more use cases than ever before.
此外,借助工具选项的灵活性(例如能够在服务器上运行JS),我们的技能组可以转移到比以往更多的用例中。
我们来自哪里 (Where we came from)
The web development landscape has been changing rapidly. Wordpress has been king CMS for a little while now, representing over a third of websites who use a CMS and helping PHP gain popularity. But others worked off of homegrown solutions.
Web开发的格局一直在Swift变化。 Wordpress成为CMS的王者已有一段时间了,它代表使用CMS并帮助PHP普及的网站的三分之一。 但是其他人则采用了自己开发的解决方案。
These represented a more traditional web stack like LAMP. In these cases, you had web servers usually running some kind of content management system and a server side language (like PHP) that would interface with the databases and produce the code that would ultimately be delivered to the browser.
这些代表了更传统的Web堆栈,如LAMP 。 在这些情况下,您的Web服务器通常运行某种内容管理系统和服务器端语言(如PHP),该语言将与数据库交互并生成最终将传递给浏览器的代码。
On top of that, you might have Javascript making some interactive features with CSS managing the display of the page. Now in some instances, having a managed Wordpress server is all you need for certain web hosts. But other larger sites would require another team to manage those services and the deploy pipeline for getting the code out to production.
最重要的是,您可能需要Javascript通过CSS来管理页面的显示,从而实现一些交互功能。 现在,在某些情况下,某些Web主机只需要拥有托管的Wordpress服务器。 但是其他较大的站点将需要另一个团队来管理这些服务和部署管道,以将代码投入生产。
我们在哪里,我们要去哪里 (Where we are and where we’re going)
While Wordpress isn’t going anywhere, the serverless and JAMstack architectures are building momentum. For those unfamiliar, the idea isn’t that there are literally no servers, but it’s more about using servers that are managed for you in the cloud.
尽管Wordpress无处不在 ,但无服务器和JAMstack体系结构正在蓬勃发展。 对于那些不熟悉的人,并不是要真正地没有服务器,而是要使用在云中为您管理的服务器。
Services like AWS Lambda let you build a “function” that processes simple input and output. Attach that to API Gateway and you immediately have an endpoint you can interface with without ever having to actually manage a server.
诸如AWS Lambda之类的服务使您可以构建处理简单输入和输出的“功能”。 将其连接到API Gateway ,您将立即拥有一个可以与之交互的终结点,而无需实际管理服务器。
Others like S3 let you dump HTML, CSS, JS, images, and whatever other static assets into storage and serve the site directly from it. Nothing gets processed on the server, you’re simply serving the static files to the client.
其他诸如S3的功能使您可以将HTML,CSS,JS,图像以及任何其他静态资源转储到存储中,并直接从中提供服务。 服务器上没有任何处理,您只是将静态文件提供给客户端。
The brilliant part about this is there’s a lot less overhead and it's typically a whole heck of a lot cheaper. Many cases, you’ll also get a huge performance boost, where serving a site from s3 will require less processing to get that first response to the browser, which can directly equate to improved user experience.
最好的一点是,它的开销要少得多,而且通常便宜得多。 在许多情况下,您还将获得巨大的性能提升,从s3服务站点将需要更少的处理才能对浏览器产生第一React ,这可以直接等同于改善的用户体验。
This isn’t to push you to the JAMstack, but to show that the full stack paradigm is shifting and it’s something worth looking at. There still is a traditional sense of the difference in work, but it’s becoming a bit different.
这并不是要推动您进入JAMstack,而是要显示完整的堆栈范式正在发生变化,这值得一看。 人们对工作的差异仍然有传统的感觉,但情况有所不同。
DevOps teams now manage cloud resources and deploys. Backend developers now build APIs and code that interfaces with services using tools like lambda functions. And front end developers primarily work in Javascript building React or Vue apps that reach out to the services your backend developers created. Arguably, this might or might not include things like CSS, but that’s another can of worms about what title that work “officially” falls under (spoiler: depends on the team).
DevOps团队现在可以管理云资源并进行部署。 后端开发人员现在可以使用lambda函数之类的工具来构建与服务接口的API和代码。 前端开发人员主要从事Javascript构建React或Vue应用程序的工作,这些应用程序可以与您的后端开发人员创建的服务联系。 可以说,这可能包括或可能不包括CSS之类的东西,但这是另一种蠕虫,它们蠕动的是“正式”起作用的标题(破坏者:取决于团队)。
While there is still a split sense of duties, the line is blurring and makes it more manageable to spread your focus.
尽管仍然存在责任分工,但这条线越来越模糊,可以更轻松地分散您的注意力。
在我们深入之前,让我们谈谈重点 (Before we dive in, let’s talk about that focus)
It can be pretty tempting to want to dive right in and cover the full spectrum of a full stack developer, but there’s something to be said about focus. This is the basis of the expression “jack of all trades, master of none,” where you try to learn a little bit of each part of the full stack and never really master anything.
想要深入了解并涵盖全栈开发人员的全部知识可能很诱人,但是关于专注性还有很多话要说。 这是“ 万事通,万事通 ”的表达方式的基础,在这里您尝试学习整个堆栈中每个部分的一点点,而从不真正掌握任何东西。
This can be dangerous when starting off trying to build your strengths as a new developer. So try to evaluate what type of learner you are and lend your focus where it matters. If you’re struggling with a spread out curriculum, that might not necessarily help get you the experience you need to land that first job or that dream job you’re reaching for.
当开始尝试建立自己的新开发人员实力时,这可能很危险。 因此,请尝试评估您是哪种类型的学习者,并将重点放在重要的地方。 如果您正在为分散的课程而苦苦挣扎,那不一定能帮助您获得要找到的第一份工作或梦想的工作所需的经验。
A novel approach, for example, could be having an individual focus, but building the full stack skills around that strength. This might be a front end developer who can deploy their own web apps and continuing to build on that fundamental knowledge.
举例来说,一种新颖的方法可能是着眼于个人,但围绕着这种力量建立完整的堆叠技能。 这可能是前端开发人员,他们可以部署自己的Web应用程序并继续基于该基础知识进行开发。
On top of that, part of being a full stack developer isn't necessarily being able to say that you know x, y, and z languages. Understanding code and software design concepts as well as being able to tackle any challenge at hand, stack aside, is what makes a great developer.
最重要的是,成为全栈开发人员的一部分不一定能够说出您知道x,y和z语言。 理解代码和软件设计概念,以及能够应付手头的任何挑战,而不仅仅是堆栈,才是优秀的开发人员的根本。
The bottom line, try to figure out what's best for you and don't let your high ambition get in the way of mastering your journey.
最重要的是,尝试找出最适合您的方式,不要让您的雄心壮志阻碍您的旅程。
那么我们从哪里开始呢? (So where do we start?)
For the purposes of this article, we’re going to keep with the traditional breakpoints of what break up the stack (front end, back end, etc.). Though some people say it's not really a thing anymore, realistically, there are tons of jobs for full stack developers and day to day, they refer to the traditional breakpoints. "Full stack developer" definitely isn't going anywhere.
出于本文的目的,我们将保留破坏堆栈的传统断点(前端,后端等)。 尽管有人说这已不再是一回事 ,但实际上,对于全栈开发人员来说,有很多工作要做 ,他们每天都在指代传统的断点。 “全栈开发人员”绝对不会走开。
As far as the stack goes, we’re going to lean on the serverless / JAMstack architectures, as that’s just going to keep growing. And if you learn them, it will only make you more marketable with the number of jobs popping up around it.
就堆栈而言,我们将依靠无服务器/ JAMstack架构,因为这只会不断增长。 而且,如果您学习它们,它只会使您周围更多的工作机会而变得更具市场价值。
As you'll notice below, this isn't meant to be all encompassing with every type of database and every type of rendering solution. A strong developer should be able to be flexible with their tooling, reaching to understand the concepts of their work rather than being single minded and only being able to be productive in one framework.
正如您将在下面注意到的那样,这并不意味着每种类型的数据库和每种类型的呈现解决方案都将其包含在内。 一个强大的开发人员应该能够灵活地使用他们的工具,能够理解他们的工作概念,而不是一心一意,只能在一个框架中高效地工作。
While you may be working in React and comfortable with it in your current job (that's okay!), your next job could be heavy on Vue or "surprise!" your team lead wants to rewrite the app in Svelte. Try to understand why you're using a UI framework in the first place and how it's helping you solve the problem at hand.
虽然您可能正在React中工作并且对当前的工作感到满意(没关系!),但是您的下一个工作可能会是Vue或“惊喜”! 您的团队负责人想用Svelte重写应用程序。 尝试理解为什么首先要使用UI框架,以及它如何帮助您解决当前的问题。
Now let's get into it...
现在让我们开始吧...
前端 (Front End)
The front end of a website or application is typically the UI that the person using your service interacts with. The biggest language player in the game is Javascript, where you’ll typically lean on UI libraries such as React or Vue to manage the components of your project.
网站或应用程序的前端通常是使用您的服务的人与之交互的UI。 游戏中最大的语言播放器是Javascript,您通常会依靠UI库(例如React或Vue)来管理项目的组件。
Using these UI frameworks will allow you to create “components”, essentially blocks of code, that will end up producing HTML with the ability to create interactions and dynamic states right along with your code. This becomes really powerful, and while there might be a little curve to start, it becomes pretty delightful to work with once you get the hang of it.
使用这些UI框架将使您能够创建“组件”,本质上是代码块,最终将产生具有与代码一起创建交互和动态状态的功能HTML。 这变得非常强大,尽管可能会有一点曲线开始,但是一旦掌握了一些技巧,使用它就会变得非常令人愉快。
Whether new to the field or well experienced, you might eventually run into jQuery. While it has it’s merits and has served the community well, Javascript’s native features have really grown and created less demand for the functionality jQuery was able to provide. Now devs lean on the UI frameworks and native Javascript instead.
无论是新手还是经验丰富的人,您最终都可能会遇到jQuery。 尽管它有其优点并为社区提供了良好的服务,但Javascript的本机功能确实得到了发展,并且对jQuery能够提供的功能的需求也降低了。 现在,开发人员改用UI框架和本机Javascript。
So it’s good to understand what jQuery is, but I don’t recommend taking the time to learn it at this point. The good thing is, if you land a job that uses it, you can write native Javascript right along with jQuery, so learning vanilla Javascript itself is the right answer.
因此,最好理解jQuery是什么,但是我不建议您花时间学习jQuery。 好消息是,如果您找到一份使用它的工作,就可以与jQuery一起编写本机Javascript,因此学习原始Javascript本身就是正确的答案。
那我应该学什么呢? (So what should I learn?)
If you’re truly a beginner, take the time to learn basic HTML and CSS. It might not be as fun and attractive as digging right into Javascript, but building upon the fundamentals of what makes the web will be key to starting off on the right foot.
如果您是真正的初学者,请花时间学习基本HTML和CSS。 它可能不像深入研究Javascript那样有趣和有吸引力,但是基于使网络成为基础的基础将是从右脚开始的关键。
Next, learn Javascript. It will remain king for the foreseeable future. Javascript will provide the basis of any framework or library that you build upon, so getting to understand how the bits and pieces of the language itself works will help propel you through your journey of learning the front end side of things.
接下来,学习Javascript。 在可预见的将来,它将保持王者地位。 Javascript将提供您所建立的任何框架或库的基础,因此了解该语言本身的零碎工作将有助于推动您学习事物的前端。
It will also make your life easier when you’re trying to understand some of the complexities of different patterns and the concepts behind the frameworks you’ll use.
当您试图了解不同模式的某些复杂性以及将使用的框架背后的概念时,这也将使您的生活更加轻松。
Speaking of frameworks, React and Vue are probably the best candidates given their popularity. React is the most popular out of the bunch and is just going to keep growing. Its team is constantly working to mature the framework and produce APIs that will help build modern, fast web apps.
说到框架,鉴于它们的流行,React和Vue可能是最好的候选者。 React是最流行的,并且将保持增长。 它的团队一直在努力使框架成熟,并产生有助于构建现代,快速Web应用程序的API。
Getting started with Create React App or Gatsby will even help you easily spin up a React app and immediately get into a position where you can tinker around in the code.
使用Create React App或Gatsby入门甚至可以帮助您轻松启动React应用,并立即进入可以修改代码的位置。
While there would be benefits to call out CSS preprocessors and tools like Sass, there are a ton of solutions now for CSS including CSS-in-JS.
调用CSS预处理程序和工具(如Sass)可能会有好处,但现在有很多CSS解决方案,包括CSS-in-JS 。
While putting CSS inside of JS has some pros and cons, it isn't necessarily worth pointing out what to use as a particular direction, as it's really going to be team dependent.
尽管将CSS放入JS具有一些优点和缺点 ,但不一定要指出将什么用作特定方向,因为这实际上取决于团队。
Understanding the basics and power of CSS and how to use it in it's vanilla form will help prepare you for utilizing it no matter the framework.
理解CSS的基本知识和功能以及如何以原始格式使用CSS有助于您为使用CSS做好准备,无论其框架如何。
翻译自: https://www.freecodecamp.org/news/how-to-become-a-full-stack-web-developer-in-2020/
全栈开发和web开发