前端分离的前端开发工具

Learning front-end development can be a bit overwhelming at times. There are so many resources and tools, and so little time. What should you pick? And what should you focus on?

有时，学习前端开发可能会有些困难。 资源和工具太多了，时间却很少。 你应该选什么？ 那你应该专注于什么？

In my previous article How I switched careers and got a developer job in 10 months, I talked about my journey. I was an English teacher with no related experience, and I managed to land a front-end developer job in a Madrid startup.

在上一篇文章《我如何改变职业并在10个月内找到开发人员的工作》中 ，我谈到了自己的旅程。 我曾是一名英语老师，没有相关经验，并且设法在马德里一家初创公司找到了前端开发人员的工作。

In this article, I would like to dive deep into the resources and tools that I used to get there.

在本文中，我想深入研究我用来实现此目标的资源和工具。

We will visit the courses I took, see their pros and cons. And talk about the projects I made with them. Then we’ll have a detailed tour around all the other cornerstones of succeeding on this journey. Things like using GitHub, building a portfolio, and staying motivated.

我们将参观我参加的课程，了解它们的优缺点。 并谈论我与他们一起完成的项目。 然后，我们将详细介绍成功完成此旅程的所有其他基石。 诸如使用GitHub，建立投资组合以及保持积极性之类的事情。

在哪里学习什么？ (What to study and where?)

I sat in front of the screen staring at an image of the sun. I wanted to scream, laugh, and cry all at once. This was not any image of the sun, this was an image that I had just pulled from the NASA database! I had finally managed it after what seemed like forever trying to figure out how to use the NASA API. I felt like a top hacker, I will soon be able to control traffic lights!

我坐在屏幕前，凝视着太阳的图像。 我想一次尖叫，大笑和哭泣。 这不是太阳的任何图像，这是我刚刚从NASA数据库中提取的图像！ 在似乎永远试图弄清楚如何使用NASA API之后，我终于对它进行了管理。 我感觉自己像个顶级黑客，很快就能控制交通信号灯！

In fact, I was nowhere near controlling traffic lights, and I still am not. But what I didn’t know at that moment was that I was only days away from getting a real job offer.

实际上，我离控制交通信号灯不远，而我却没有。 但是当时我不知道的是，我离获得一份真正的工作机会只有几天的路程。

So how does someone go from no knowledge in front-end development to a job in the field? What do you have to study and where do you do it?

那么，某人如何从对前端开发一无所知变为该领域的工作呢？ 您必须学习什么，在哪里学习？

When I first started learning, this was one of my biggest concerns. My time was precious and I needed to invest it in the best way possible. I get asked this question all the time, especially by my Twitter community. This is something that beginners always worry about.

当我刚开始学习时，这是我最大的担忧之一。 我的时间很宝贵，我需要以最好的方式进行投资。 我一直被问到这个问题，特别是在我的Twitter社区。 这是初学者一直担心的事情。

It may come as a surprise to many, but I would pick this as the least important factor out of the entire process of career change. It’s not as decisive as it may seem at first.

这可能使许多人感到意外，但我将其视为整个职业变更过程中最不重要的因素。 它并不像起初那样具有决定性。

You will learn and get better at this no matter what you use, as long as you are persistent, and remain motivated.

无论您使用什么，只要您坚持不懈并保持积极性，您都将学着并在此方面变得更好。

Don’t get me wrong, there are sub-level courses out there and others that are great. And finding out the right path to learn all the skills necessary is very important.

不要误会我的意思，那里有一些次级课程，还有其他很棒的课程。 找出学习所有必要技能的正确途径非常重要。

Yet, even the best laid out path and the greatest course would be of no use if you lose motivation halfway through. So the question is not which courses are the best, but which ones follow a method that will keep you motivated. This depends on you as an individual and how you learn.

但是，如果您在中途失去动力，即使是最好的布局路径和最大的路线也没有用。 因此，问题不是哪个课程是最好的，而是哪个课程遵循的方法可以使您保持动力。 这取决于您个人以及您的学习方式。

My tip is before you dive in, spend some time understanding your learning style. And find the methodologies that work for you. It’s also OK to try out different courses and styles before you commit.

我的技巧是在您深入之前，花一些时间来了解您的学习风格。 并找到适合您的方法。 在提交之前尝试不同的课程和样式也是可以的。

我的课程 (My courses)

Throughout my 10-month intense study process, I navigated my way through the multitude of material available. I looked for what I needed at each moment and what kept me excited and engaged. I jumped in and out of courses, took bits from here and there and only measured my progress by what I’m learning.

在我为期10个月的紧张学习过程中，我浏览了各种可用材料。 我时刻都在寻找自己需要的东西，这让我感到兴奋和投入。 我跳入和跳出课程，从那儿到那里走了一点，只根据我所学的内容来衡量我的进步。

I had a full-time job, so I needed resources that allowed me to set the pace myself. Financially, I couldn’t afford a boot camp or expensive courses. So I made the most of all the free and discounted resources available. And by the time I got the job, I had spent under a 100€.

我有一份全职工作，因此我需要一些资源来让自己适应自己的节奏。 在财务上，我负担不起新手训练营或昂贵的课程。 因此，我充分利用了所有可用的免费和折扣资源。 而当我得到这份工作时，我已经花了不到100欧元。

There’s a link at the end of this section to all the resources I mention here.

本节末尾有一个指向我在这里提到的所有资源的链接。

YouTube优先 (YouTube first)

The first web development tutorial I watched was Jake Wright’s Learn HTML in 12 Minutes, followed by Learn CSS in 12 Minutes. This resulted in my very first web page. It took very little time and was very motivating. It is basic and a bit dated, but it’s perfect for absolute beginners with zero knowledge.

我观看的第一个Web开发教程是Jake Wright的“ 12分钟学习HTML”，然后是“ 12分钟学习CSS”。 这导致了我的第一个网页。 它花费了很少的时间，而且非常激励人。 这是基础知识，有点过时，但是对于零知识的绝对初学者来说，它是完美的选择。

I also regularly used a lot of Traversy Media and LevelUpTuts tutorial videos.

我还经常使用很多Traversy Media和LevelUpTuts教程视频。

Web开发人员训练营— Colt Steele (The Web Developer Bootcamp — Colt Steele)

This is one of Udemy’s most popular web development courses. It is often sold at a discounted price. Colt is a good instructor. It takes you from the beginning and builds slowly. And you will end up with a bunch of good-looking projects to show.

这是Udemy最受欢迎的Web开发课程之一。 它通常以折扣价出售。 柯尔特是一位好老师。 它需要您从一开始就慢慢构建。 最后，您将展示许多漂亮的项目。

However, the course is very extensive, and if you are only interested in front-end it might be too much. The code-along style is good for beginners. But it doesn’t encourage you to solve problems on your own, which is what you need to learn.

但是，该课程非常广泛，如果您仅对前端感兴趣，那么可能会太多。 附带代码的风格对初学者来说很不错。 但这并不鼓励您自己解决问题，这是您需要学习的。

I made the RGB Colour Game and Patatap Clone. They are fun and make for a good talking point in interviews. And to have a functioning web app early on is a nice boost of confidence.

我制作了RGB Color Game和Patatap Clone 。 他们很有趣，并在访谈中成为一个很好的话题。 尽早拥有可运行的Web应用程序可以极大地增强信心。

FreeCodeCamp.org (FreeCodeCamp.org)

This is my immediate first recommendation for anyone starting out in web development. You sign-up and instantly start writing code. There is zero preparation and setup time. You get hooked — need those green ticks!

对于那些刚开始进行Web开发的人来说，这是我的第一个建议。 您注册并立即开始编写代码。 准备和设置时间为零。 您会上瘾的- 需要那些绿色的勾！

The curriculum covers all you need to learn modern development. It has an active community. It is free. And on top of that, the organisation itself and its mission are great.

该课程涵盖了学习现代发展所需的全部内容。 它有一个活跃的社区。 这是免费的。 最重要的是，组织本身及其使命非常重要。

But the best part is the projects. It takes a while to get there and you got to build them from scratch. But this is exactly the kind of practice you need to develop your skills. And despite not having a direct guide to follow, the active community means you always can find an answer.

但是最好的部分是项目。 到达那里需要一段时间，您必须从头开始构建它们。 但这正是您发展技能所需的一种练习。 尽管没有直接的指导可循，活跃的社区意味着您始终可以找到答案。

I made a tribute page to my favourite star (the hydrogen type, not the red carpet type), my portfolio, and a React random quote generator.

我向我最喜欢的明星(氢型，而不是红地毯型)，我的作品集和一个React 随机报价生成器 致敬 。

JavaScript 30 — Wes Bos (JavaScript 30 — Wes Bos)

Wes is one of my favourite instructors. You know when you do any of his courses that you are getting the latest and most in-depth look at the subject. I would recommend any of his courses without hesitation.

韦斯是我最喜欢的教练之一。 您知道，当您修读他的任何课程时，都会获得对这一主题的最新，最深入的了解。 我会毫不犹豫地推荐他的任何课程。

I mainly worked on his free JavaScript 30 course, and I cannot overstate how useful it was. Each one of the quick projects I did became a reference. I would come back to again and again, to remember how I did this or that. I referred to them when I was preparing technical tests, interviews, and in my first weeks on the job. That’s probably the best that can be said about a course!

我主要研究他的免费JavaScript 30课程，并且我不能高估它的用处。 我所做的每个快速项目都成为参考。 我会一遍又一遍地回想起我是如何做到的。 在准备技术测试，面试以及工作的第一周，我就提到了他们。 这可能是一门课程最好的说法！

Some of these awesome projects include a clock, a drum machine, and a search tool.

其中一些很棒的项目包括时钟 ， 鼓机和搜索工具 。

Lynda.com (Lynda.com)

I took advantage of the free trial and did a bunch of courses. I found Christina Truong to be an excellent instructor. I learned a lot from her courses about advanced CSS, workflow tools, and getting a website online. I also improved my Git skills with Ray Villalobos.

我利用了免费试用的机会，并做了很多课程。 我发现克里斯蒂娜·特朗(Christina Truong)是一位出色的教练。 我从她的课程中学到了很多有关高级CSS，工作流工具以及使网站联机的知识。 我还通过Ray Villalobos提高了Git技能。

The courses on Lynda.com were very good. But their catalogue is not specialised enough towards web development. It lacks the coherence of other more focused platforms.

Lynda.com上的课程非常好。 但是他们的目录还不足以专门用于Web开发。 它缺乏其他更集中的平台的一致性。

树屋 (Treehouse)

Speaking about specialised, Treehouse is a great example. I also only did the free trial to get a taste, and I like it. It has very well defined tracks and a lot of in-depth learning material.

说到专业，树屋就是一个很好的例子。 我也只做免费试用以尝一尝，我喜欢它。 它有非常明确的定义，并提供了许多深入的学习资料。

了解足够多的命令行危险— Michael Hartl (Learn Enough Command Line to Be Dangerous — Michael Hartl)

It’s a simple short tutorial but it gave me what I needed to demystify the command line and start using the basics.

这是一个简单的简短教程，但它为我提供了使命令行神秘化并开始使用基础知识的一切。

针对开发人员JavaScript和React — Cassidy Williams (JavaScript and React for Developers — Cassidy Williams)

Cassidy is a very knowledgeable instructor and her style is enjoyable to learn with. This course pushed me hard and forced me to deal with advanced concepts. I started it towards the end of my 10-month journey towards my first job.

卡西迪是一位非常博学的教练，她的风格很有趣。 这门课程使我难以接受，迫使我不得不处理高级概念。 我在开始第一份工作的10个月旅程即将结束时开始工作。

I learnt how to use an API to make calls and display returned data. I created a GitHub user search app which was a great moment in my learning experience. Then I started on the Nasa media search app I mentioned in the beginning.

我学习了如何使用API​​进行调用并显示返回的数据。 我创建了一个GitHub用户搜索应用程序 ，这对我的学习体验来说是非常重要的时刻。 然后，我开始使用开头提到的Nasa媒体搜索应用程序 。

I was still working on it when I had to pause to do a take-home challenge for a job interview. The challenge was pretty much exactly what I was doing on the course.

当我不得不暂停以进行面试的带回家的挑战时，我仍在努力。 挑战几乎正是我在课程中所做的。

I completed the challenge, and got the job!

我完成了挑战，得到了工作！

前端Web开发人员纳米学位(FEND)— Udacity (Front-End Web Developer Nanodegree (FEND) — Udacity)

A few months after I started learning I got a Google scholarship to do a front-end course on Udacity . Then I was selected for the second phase which was actually the full Udacity FEND program. That was very fortunate for me.

开始学习几个月后，我获得了Google奖学金，以开设有关Udacity的前端课程。 然后我被选为第二阶段，实际上是完整的Udacity FEND程序。 这对我来说是非常幸运的。

But, it’s important to stress a point here. If you don’t get a scholarship or can’t afford a nanodegree it has no influence on your chances of making it. While this was a positive experience that helped me a lot, it was not the deciding factor. In fact, I got the job months before I finished the FEND program.

但是，在这里强调一点很重要。 如果您没有获得奖学金或负担不起纳米学位，则对您获得奖学金的机会没有影响。 虽然这是一次积极的经历，对我有很大帮助，但这不是决定因素。 实际上，我在完成FEND程序之前的几个月就找到了工作。

By the time I got the scholarship, I knew I was serious about making a career change. So without it, I would have started investing more money into my education. I would have gone the monthly subscription route in Treehouse or Udacity for example.

当我获得奖学金时，我知道我很认真地改变职业。 因此，如果没有它，我将开始在教育上投入更多的资金。 例如，我本来会选择Treehouse或Udacity中的每月订阅路线。

The course itself is of excellent quality. The instructors are top industry practitioners with real knowledge and experience in the subject. The projects are challenging and exciting. You get mentors and very valuable code review for your projects.

该课程本身具有卓越的品质。 讲师是在该领域具有真正知识和经验的顶尖行业从业者。 这些项目充满挑战，令人兴奋。 您将获得项目的指导者和非常有价值的代码审查。

But without a doubt, the best thing about the course and this experience was the active and highly engaged community. This should always be the first thing you look for in any resource. You end up learning as much from course mates as from instructors.

但是，毫无疑问，课程和这种经验的最大好处是活跃且高度参与的社区。 这应该始终是您在任何资源中寻找的第一件事。 您最终从同伴那里学到的东西和从教官那里学到的东西一样多。

The Pixel Art project was only one of the many excellent projects of the course. It was the most complex project I had built up to that point. It really engaged me and helped me “think like a programmer” as I tried to add more features.

像素艺术项目只是该课程众多优秀项目之一。 那是当时我建立的最复杂的项目。 当我尝试添加更多功能时，它确实吸引了我，并帮助我“像程序员一样思考”。

学习追踪器 (Learning Tracker)

If you would like to see more details about exactly what I did those first 10 months, checkout My-Learning-Tracker. It’s a GitHub repo where you can find every course I did and links to it. Plus many other useful resources. You can even fork it and use it as a template for your own learning tracker.

如果您想详细了解我前10个月的工作，请查看My-Learning-Tracker 。 这是一个GitHub存储库，您可以在其中找到我做过的每门课程并链接到它。 加上许多其他有用的资源。 您甚至可以将其分叉并将其用作您自己的学习跟踪器的模板。

超越课程：成功的基石 (Beyond courses: the cornerstones of success)

Courses and tutorials are great, but on their own they aren’t enough. There are plenty of other essential tools to succeed. You should give these at least as much importance as the courses you choose.

课程和教程很棒，但仅靠它们还不够。 还有很多其他必不可少的成功工具。 您应至少选择与所选课程同样重要的内容。

Here are the things I found invaluable on my way from zero to a developer job.

这是我发现从零到开发人员的工作中无价的东西。

保持动力 (Staying motivated)

This was the top priority. Lose that and I got nothing. There were three things that helped me stay motivated when things got tough.

这是当务之急。 输了，我什么也没得到。 当事情变得艰难时，有三件事可以帮助我保持动力。

First was my goal. I had set an objective to get a front-end developer job in a startup within a year. That made it easier to stay focused and push through moments of self-doubt and low motivation.

首先是我的目标。 我设定的目标是在一年内在一家初创公司获得前端开发人员的工作。 这使得保持专注和克服自我怀疑和动力不足的时刻变得更加容易。

Second, my network of close people. Especially my partner and a close friend who were both learning at the same time. It was very helpful doing the process with other people. They were going through the same feelings. And it was great being able to bounce ideas off of each other, reinforce our learning, and pick up tips.

其次，我的人脉网络很亲密。 特别是我的伴侣和密友，他们都在同时学习。 与其他人一起完成此过程非常有帮助。 他们正在经历同样的感受。 能够互相启发，加强我们的学习和掌握技巧真是太好了。

And third was the online communities. I learned a lot from people around me and constantly got encouragement and understanding.

第三是在线社区。 我从周围的人那里学到了很多东西，并且不断得到鼓励和理解。

Staying motivated is a challenge but it can be done. It’s all about feeling that we are progressing. Keep building things, no matter how small. And don’t replicate learning methods that have failed you in the past.

保持动力是一个挑战，但可以做到。 一切都是关于我们正在进步。 不管大小，继续建造东西。 而且不要重复过去失败的学习方法。

社交工具 (Social tools)

Top of this list for me is Twitter. It put me in touch with professionals and learners alike. It kept me informed and was a constant source of material and resources. And it helped me network and in the end, played a role in helping me find a job.

对我而言，此列表的顶部是Twitter。 它使我与专业人士和学习者保持联系。 它使我随时了解情况，并且一直是物质和资源的来源。 它帮助我建立了网络，并最终帮助我找到了工作。

At the heart of my Twitter experience are the closely related communities of freeCodeCamp, #100DaysOfCode, and #CodeNewbie. These are very active and supportive communities that helped me every step of the way. Alexander Kallaway’s #100DaysOfCode challenge is a beautifully simple idea that really works. Code every day a minimum of an hour, commit publicly, encourage others.

我的Twitter经验的核心是紧密相关的freeCodeCamp，＃100DaysOfCode和#CodeNewbie社区。 这些社区非常活跃，相互支持，为我提供了帮助。 亚历山大· 卡洛威( Alexander Kallaway )的＃100DaysOfCode挑战是一个很简单的想法，确实有效。 每天至少编码一个小时，公开承诺，鼓励他人。

I can’t say enough about the great role played by this community in keeping me motivated and accountable. A warm shout-out to all the good friends I made on this journey.

对于这个社区在保持我的积极性和责任心方面发挥的巨大作用，我还说得不够。 热烈欢迎我在旅途中结识的所有好朋友。

的GitHub (GitHub)

The minute you enter into the world of code you immediately start hearing about GitHub. It can be a very intimidating place when you visit it for the first time. And since it is all about open source and collaboration you might not think that it is relevant to you as a beginner. Trust me it is.

在进入代码世界的那一刻，您立即开始听说有关GitHub的信息。 第一次访问时，它可能是一个非常令人生畏的地方。 而且由于这一切都与开源和协作有关，所以您可能不认为它与您初学者有关。 相信我。

It’s the cornerstone of your work as a programmer. You are going to use Git with a Git hosting service on a daily basis in any job. And you quickly realise that the basics are quite simple.

这是您作为程序员工作的基石。 您将在任何工作中每天将Git与Git托管服务一起使用。 您很快就会意识到基础非常简单。

Once I got past my initial confusion, GitHub became the centre of my learning experience. It essentially became my default portfolio. That’s where all my code lived. And using GitHub Pages I got a place to host all my projects for free. I also used it to keep track of my learning, and to collaborate.

一旦我摆脱了最初的困惑，GitHub便成为我学习经验的中心。 它本质上成为我的默认投资组合。 那就是我所有代码所住的地方。 使用GitHub Pages，我可以免费托管所有项目。 我还用它来跟踪我的学习并进行协作。

This was even more important since I had no previous experience in the field. I only had my GitHub to show what I knew. It became the best reflection of what I could do and what I was learning, and it’s the first place most employers will look at. So I made sure it was full of projects and detailed documentation.

由于我以前没有该领域的经验，因此这一点甚至更为重要。 我只有GitHub可以显示我所知道的。 它成为我能做什么和正在学习什么的最好反映，并且它是大多数雇主都会关注的第一个地方。 因此，我确保它充满了项目和详细的文档。

A highlight moment in my learning process came when I decided to help my course mates at Udacity. I noticed that many were intimidated by GitHub. So I created a simple project for contribution with a step by step tutorial. I creatively named it Contribute-To-This-Project. Teaching is the best way to learn, and no matter how little you know, you can still help someone learn something.

当我决定帮助Udacity的同学时，是学习过程中最重要的时刻。 我注意到很多人被GitHub吓倒了。 因此，我创建了一个简单的项目，并提供了逐步教程。 我创造性地将其命名为Contribute-To-This-Project 。 教书是最好的学习方法，无论您了解多少，仍然可以帮助某人学习一些东西。

建立投资组合 (Build a portfolio)

Even with an active GitHub profile, you still need a portfolio to show your work. It’s also good practice to build a fully functional website. If you have no projects to put in your portfolio, make it and then start adding things to it as you go.

即使拥有活跃的GitHub个人资料，您仍然需要一个作品集来展示您的工作。 建立功能齐全的网站也是一个好习惯。 如果您没有项目可放入投资组合中，请制作它，然后随即开始向其中添加内容。

I came up with an idea for my portfolio very early on. I drew it on a page and imagined it would be a long time before I have the skills to make it a reality. In fact, I started building it much sooner than I thought. And that is good because that first grand vision is never going to be perfect.

我很早就想出了一个投资组合的想法。 我将其绘制在页面上，并认为要使它成为现实需要很长时间。 实际上，我开始构建它的时间比我想象的要早得多。 这样做很好，因为第一个宏伟愿景永远不会完美。

It was the most complex thing I had attempted on my own from scratch. A deep learning experience that benefited me enormously. I had to constantly research to figure out how to do what I wanted to do. I spent loads of time reading MDN documentation and Stack Overflow. I had to deal with frustrations, waste hours trying to fix a bug which would turn out to be a single spelling mistake.

这是我从头开始独自尝试的最复杂的事情。 深度学习经验使我受益匪浅。 我必须不断研究以找出如何做自己想做的事。 我花了大量时间阅读MDN文档和Stack Overflow。 我不得不处理挫败感，浪费时间试图修复一个错误，而这个错误原来只是一个拼写错误。

But this is exactly what learning to program is all about. Those are precisely the skills I use every day on the job. Learning how to research, debug, problem-solve, and deal with frustration are the keys to becoming a developer.

但这正是编程学习的全部内容。 这些正是我每天在工作中使用的技能。 学习如何进行研究，调试，解决问题和解决挫败感是成为开发人员的关键。

Then I finished my portfolio, and it looked and worked almost exactly as I’d hoped. I was over the moon -Behold my creation!- and almost immediately aware that it was totally useless as a portfolio! I took a deep breath, accepted it, and started building my new portfolio the next day. I wanted this one to be simple and functional. A place to showcase my work and a bit about me. It needed to work on every device. It didn’t need fireworks and magic.

然后我完成了我的投资组合，它的外观和工作几乎完全符合我的期望。 我在月球上- 看我的创造！ -几乎立即意识到，作为投资组合完全没有用！ 我深吸了一口气，接受了它，第二天开始建立我的新投资组合。 我希望这个简单而实用。 一个展示我的作品以及一些关于我的地方。 它需要在所有设备上工作。 它不需要烟花和魔术。

This brings me nicely to my next related point.

这很好地带我到下一个相关点。

自己建造东西 (Build things on your own)

Those two sites I built from scratch were the foundation of my learning. Doing something without a tutorial can be daunting. But it is great for learning, even if the result is not great. Those early pitfalls are a treasure of learning that helped prepare me during the first tough weeks on the job.

我从头开始建立的这两个站点是我学习的基础。 在没有教程的情况下做一些事情可能令人生畏。 但这对学习很有帮助，即使结果并不理想。 这些早期的陷阱是学习的宝藏，它帮助我在工作的头几个艰难星期做好了准备。

It doesn’t mean that I shunned tutorials and directed projects. But it pushed me to add extra features to anything I was building, to take it further and do more on my own.

这并不意味着我回避了教程和指导的项目。 但这促使我向正在构建的任何事物添加额外的功能，以使其更进一步并自行完成更多工作。

It’s not important what you build, you will learn from it. For instance, I built a very simple temperature converter. That’s not exactly an exciting project but it was a challenge that I had to figure out completely on my own. And I was proud to have it working properly when I finished.

构建什么并不重要，您将从中学到东西。 例如，我构建了一个非常简单的温度转换器。 那并不是一个令人兴奋的项目，但这是一个挑战，我必须自己独自弄清楚。 我为完成后能够正常工作而感到自豪。

播客，文章，演讲，聚会 (Podcasts, articles, talks, meetups)

There is so much to learn if you are starting from scratch. Active learning time was not enough for me. I used my passive time to immerse myself and understand as much as possible about this new world I wanted to enter.

如果您是从头开始，还有很多东西要学习。 主动学习时间对我来说还不够。 我度过了消极的时间，沉迷于自己，并尽可能多地了解我想进入的这个新世界。

I read articles, watched videos of talks, listened to podcasts. I generally tried to use every opportunity I had to get deeper into the concepts beyond the syntax.

我读文章，看演讲视频，听播客。 我通常尝试利用每一次机会，深入了解语法之外的概念。

Meetups and conferences are great. I lived in a small town and managed a single tech-related event throughout that time. But if you have the chance don’t be intimidated. No one will stop you and demand you prove yourself worthy!

聚会和会议很棒。 在那段时间里，我住在一个小镇上，管理过一次与技术相关的活动。 但是，如果您有机会，不要被吓倒。 没有人会阻止您并要求您证明自己的价值！

Here are some of my favourite resources:

以下是一些我最喜欢的资源：

• Command Line Heroes — Red Hat Podcast命令行英雄-红帽播客
• Base.cs — Computer science podcast with Vaidehi JoshiBase.cs — Vaidehi Joshi的计算机科学播客
• Syntax.fm — Wes Bos and Scott Tolinski podcastSyntax.fm-Wes Bos和Scott Tolinski播客
• CodeNewbie — Saron Yitbarek podcastCodeNewbie — Saron Yitbarek播客
• FreeCodeCamp Medium publicationFreeCodeCamp中型出版物
• Hacker Noon articles黑客中午文章
• Smashing Magazine — CSS articlesSmashing Magazine — CSS文章
• CSS-TricksCSS技巧
• Newsletters: JavaScript Weekly and Frontend Focus.时事通讯：JavaScript Weekly和Frontend Focus。
• Crash Course: Computer Science — YouTube series速成班：计算机科学-YouTube系列
• CS50 — YouTube videos of CS Harvard lecturesCS50-CS哈佛讲座的YouTube视频

• And of course YouTube in general for talks and non-technical aspects of the field. Here’s a link to my playlist containing many of my favourite programming YouTubers.

  当然，YouTube通常用于该领域的讨论和非技术方面。 这是指向我的播放列表的链接，其中包含我最喜欢的编程YouTuber。

祝好运 (Good Luck)

My learning process was intense and sometimes relentless. But it’s important to avoid burnout. I put a lot of effort into taking regular breaks, eating well, working out regularly, and resting every now and then. When it started to feel too much, I would take an afternoon or a full day off to disconnect completely.

我的学习过程非常激烈，有时甚至是无情的。 但是重要的是要避免倦怠。 我付出了很大的努力来定期休息，吃得好，定期锻炼和不时休息。 当开始感觉太多时，我需要休息一个下午或一整天才能完全断开连接。

It was a lot of hard work and sacrifice, but for me, it was worth every second. I am very happy with my new career as a front-end developer and I would do it all again if I have to.

这是很多艰苦的工作和牺牲，但是对我而言，这值得每一秒钟。 我对作为前端开发人员的新职业感到非常满意，如果需要的话，我会再做一次。

And don’t be hard on yourself, your journey and the difficulties you will face will be different. Just keep going.

而且，不要为自己而努力，您的旅程和将要面对的困难将有所不同。 尽管继续。

I really hope you enjoyed this article and found it useful. If you did, please click the clap button — lots of times :). And if you share it even more people will get to see it, and that would be awesome!Follow me on Twitter and let me know if there’s anything you would like me to write about in more detail.

我真的希望您喜欢这篇文章并觉得它有用。 如果您这样做了，请单击拍手按钮-很多次：)。 如果您分享它，那么就会有更多的人看到它，那真棒！ 在Twitter上关注我 ，让我知道您是否想写些更详细的信息。

Check out my article about getting that first job

查看我关于获得第一份工作的文章

翻译自: https://www.freecodecamp.org/news/the-tools-and-resources-that-landed-me-a-front-end-developer-job-1314c6f1fa7f/

前端分离的前端开发工具