it guy流利说_Guy RoutledgeCSS预处理器和字体末端开发

it guy流利说

In this episode of the Versioning Show, David and Tim are joined by Guy Routledge, a front-end developer, teacher, and presenter of SitePoint’s AtoZ CSS video series. They discuss switching from Sass to PostCSS, the complexity of front-end development, jumping into frameworks versus learning the basics, building the Taj Mahal with Lego, and the joys of #HolidayCode.

在Versioning Show的这一集中，David和Tim参加了SitePoint的AtoZ CSS视频系列的前端开发人员，老师和演示者Guy Routledge。 他们讨论了从Sass转换到PostCSS，前端开发的复杂性，跳入框架而不是学习基础知识，使用Lego构建泰姬陵和#HolidayCode的乐趣。

Visit the Versioning Show Home Page

访问版本控制显示主页

Subscribe on iTunes | Subscribe on Stitcher | View All Episodes

在iTunes上订阅 | 订阅Stitcher | 查看所有剧集

显示笔记 (Show Notes)

• #HolidayCode hashtag on Twitter.

  #HolidayCode标签在Twitter上。

• Guy on Twitter: @guyroutledge

  推特上的家伙： @guyroutledge

• Guy’s IMDB page

  盖伊的IMDB页面

• AtoZ CSS

  AtoZ CSS

• SitePoint Premium HTML and CSS channel

  SitePoint Premium HTML和CSS频道

• General Assembly

  大会

• Sass

  萨斯

• PostCSS

  PostCSS

• PostCSS video on SitePoint Premium

  SitePoint Premium上的PostCSS视频

• Guy at SitePoint Premium

  SitePoint Premium的家伙

• Say hello on Twitter: @mdavidgreen | @tevko | @versioningshow | @sitepointdotcom

  在Twitter上问好： @mdavidgreen | @tevko | @versioningshow | @sitepointdotcom

对话重点 (Conversation Highlights)

I’ve always been quite a visual person. People in my family have been very visual. They’ve been to art school or what have you. I always kind of resonated with that kind of stuff, but I always felt so frustrated that I couldn’t get something looking the way that I wanted it to look.

我一直都是一个有视觉见识的人。 我家里的人非常有视觉感。 他们去过艺术学校或您去过。 我总是对这种东西产生共鸣，但是我总是感到非常沮丧，以至于我无法以我想要的外观来呈现某种东西。

---

---

as soon as you commit like pen to paper, you can’t undo. But when you get into the digital age, if you put the virtual paintbrush to the virtual canvas, if it starts looking like crap, then you can undo as many times as you need to get it back to where you need to start from again. I think that has been much more interesting for me.

只要像纸笔一样承诺，就无法撤消。 但是，当进入数字时代时，如果将虚拟画笔放到虚拟画布上，并且看起来像废话，那么您可以根据需要进行多次还原，以使其恢复到需要重新开始的位置。 我认为这对我来说更有趣。

---

---

I think when anybody is doing something that they genuinely enjoy, and kind of satisfies them and ticks all those boxes of being — you know, you get kind of that internal balance, and then you just do your best work — because you’re working towards something that you really, really enjoy.

我认为，当任何人正在做他们真正喜欢的事情，并满足他们并打勾所有存在的状态时-您知道，您会获得那种内部平衡，然后您会尽力而为-因为您正在工作朝着您真正非常喜欢的事物发展。

---

---

I much prefer to do new projects, start new things, and kind of learn new stuff as I go. When I left there and went contracting, that was actually quite satisfying, because I got to work on a lot of new things from scratch. I was able to bring that experience of kind of building something with maintainability and performance in mind.

我更喜欢做新的项目，开始新的事物，以及在学习过程中学习新的东西。 当我离开那里去签约时，这实际上是很令人满意的，因为我必须从头开始处理许多新事物。 我能够想到那种在构建具有可维护性和性能的东西的经验。

---

---

It’s kind of just been this constant journey and desire to find a good, solid system that works. The funny thing is, that is kind of not really attainable, because even when you do get something that you think is good and working and solid, you then realize, Oh, I could just improve it here. Or, I don’t need that thing anymore, because I don’t really use it. You’re constantly in this kind of evolution of improvement.

这只是不断的旅程，并渴望找到一个有效的，可靠的系统。 有趣的是，这并不是真正可以实现的，因为即使您确实获得了您认为不错的东西并且可以正常工作，但您仍然意识到， 哦，我可以在这里改善它。 或者， 我不再需要该东西，因为我并没有真正使用它。 您一直在不断进行这种改进。

---

---

When I first started, it was all on-click in the HTML. Then everyone’s like, No, this is terrible. This is not separation of concerns. Blah, blah, blah. Then now we’ve come back to Angular and React. You know, the modern JavaScript frameworks, and they’re all about putting JavaScript in the HTML, or even putting HTML in the JavaScript. It’s funny how things go around.

当我第一次开始时，全部都是在HTML中单击的。 然后每个人都喜欢， 不，这太可怕了。 这不是关注点分离。 等等等等等等。 然后，我们回到Angular和React。 您知道，现代JavaScript框架都是将JavaScript放入HTML，甚至将HTML放入JavaScript。 事情如何发展很有趣。

---

---

I think the web is changing so fast, that I guess the stance that I take is, instead of learning the latest framework and jumping straight into that, and being able to make something kind of by trial and error and working it out, then it’s always best to start with the fundamentals and start with a good foundation. Even though I love Sass, and that’s what I write all my CSS in on almost a daily basis, I advocate starting with CSS and understanding the fundamental concepts of inline and block, and how to style typography so it is readable and accessible.

我认为网络的变化是如此之快，以至于我想采取的立场是，与其学习最新的框架并直接跳入该框架，然后能够通过反复试验做出一些努力并加以解决，不如说是总是最好从基础开始，从良好的基础开始。 即使我喜欢Sass，这也是我几乎每天都写所有CSS的内容，但我还是主张从CSS入手，了解内联和块的基本概念，以及如何设置字体样式，以便于阅读和访问。

---

---

Since I’ve found my groove in tech, I’ve been able to completely turn that around and like 10x what I used to earn. If I can help anybody else kind of find their passion and find something that can open so many doors for them — if I can do that even just for one person, then that’s amazing to be able to play a part in.

自从发现自己在技术领域的专长以来，我已经能够完全扭转局面，并且将收入提高到原来的10倍。 如果我可以帮助其他人找到他们的激情，找到可以为他们打开很多门的东西-如果我甚至可以只为一个人做到，那么能够参与其中真是太棒了。

---

---

Fortunately, the developer community — also the design community — is so open and friendly and everybody shares everything. It’s quite unbelievable. It’s like you go to a conference with developers and they’re all like, Here are the secrets. All of the secrets! Have them. Go and make amazing things.

幸运的是，开发人员社区(也包括设计社区)是如此开放和友好，每个人都共享一切。 太不可思议了。 就像您去参加与开发人员的会议一样，他们都一样， 这是秘密。 所有的秘密！ 拥有他们。 去做惊人的事情。

成绩单 (Transcript)

Tim: 蒂姆：

Hey, what’s up everybody? This is Tim Evko …

嘿，大家好吗？ 这是Tim Evko…

David: 大卫：

… and this is M. David Green …

…这是大卫·格林(M. David Green)…

Tim: 蒂姆：

… and you’re listening to episode number 20 — the big 2-0 of the Versioning podcast.

…您正在收听第20集-Versioning播客的大2-0。

David: 大卫：

This is a place where we get together to discuss the industry of the web, from development to design, with some of the people making it happen today and planning where it’s headed in the next version.

在这里，我们可以聚在一起讨论从开发到设计的网络行业，其中一些人将其付诸实践，并计划下一版的发展方向。

Tim: 蒂姆：

Today we are talking with Guy Routledge, and we’re going to talk all about CSS expertise and education. Really exciting stuff. Let’s go ahead and get this version started.

今天，我们正在与Guy Routledge进行交谈，并且我们将讨论有关CSS专业知识和教育的所有内容。 真是令人兴奋的东西。 让我们继续以启动此版本。

---

---

David: 大卫：

Guy, I’m really excited to meet you. Thanks for joining us today.

伙计，我很高兴认识你。 感谢您今天加入我们。

Guy: 伙计：

Thanks for having me, guys. Really appreciate it. Thanks for adjusting your schedules for my unfortunate timezone.

谢谢你们有我。 真的很感激。 感谢您调整我不幸的时区的时间表。

David: 大卫：

That’s okay. Tim is in New York, I’m in San Francisco, and our guests are from everywhere, so we’re used to being a little bit flexible.

没关系。 蒂姆(Tim)在纽约，我在旧金山(San Francisco)，我们的客人来自世界各地，所以我们习惯了一点灵活性。

Guy: 伙计：

Yeah, that makes sense.

是的，这很有意义。

Tim: 蒂姆：

Multinational.

跨国。

Guy: 伙计：

[Chuckles] Well, I’m joining you guys from London today. It’s dark and cold outside, but it’s nice and warm in my office, so happy to be here.

[笑声]好吧，我今天要加入伦敦的你们。 外面很黑，很冷，但是我办公室里很温暖，很高兴来到这里。

David: 大卫：

Fantastic. This is the The Versioning Show, and one of the things that we like to do here — it’s about the philosophy of web development and design. So we like to start by asking our guests a philosophical question. Your philosophical question today is, In your current career, what version are you, and why?

太棒了 这是The Versioning Show，是我们在这里想要做的一件事-它与Web开发和设计的哲学有关。 因此，我们首先要向客人提出一个哲学问题。 您今天的哲学问题是， 在您目前的职业中，您是哪个版本，为什么？

Guy: 伙计：

That’s a tough question, you know? I’m probably in something like version 5 or 6. If we count by started and failed businesses, or started and failed careers … well, failed is maybe not the right term … Yeah, maybe 5 or 6. Something like that. I’ve done a few things, but very much enjoying the tech side of stuff now. I feel like I’ve found my groove.

这是一个棘手的问题，您知道吗？ 我大概使用的是版本5或6。如果我们按创业和失败的企业，或者创业和失败的职业来计数……好吧，失败也许不是正确的用语……是的，也许是5或6。 我已经做了几件事，但是现在非常喜欢技术方面的东西。 我觉得自己找到了凹槽。

David: 大卫：

It doesn’t sound like you started out in tech.

听起来好像您不是刚开始使用技术。

Guy: 伙计：

I didn’t. Actually, funnily enough, I did, because people ask me this annoying question all the time. It’s like, Oh, so, you know, what do you do, and how did you start? It’s just like the worst thing, because nobody has a simple answer to that question. Funnily enough, now I am working in web development primarily. I actually wrote my first line of code in QBasic when I was about 11 or 12, or something like that. Then I wrote my first HTML page in 1997, I think possibly before CSS was even invented, or possibly before I knew that it was invented.

我没有 实际上，我很有趣，因为人们总是问我这个烦人的问题。 就像， 哦，所以，你知道，你在做什么，你是如何开始的？ 就像最糟糕的事情一样，因为没有人可以简单地回答这个问题。 有趣的是，现在我主要从事Web开发。 实际上，当我大约11岁或12岁时，我用QBasic写了第一行代码。 然后我在1997年编写了我的第一个HTML页面，我想可能是在CSS尚未发明之前，或者在我不知道它是发明之前。

Then I went off and did all sorts of other things in between. Then, kind of in the last 2000s, around 2010/11, came back to tech again. I ended up working … well, I did a whole load of crazy stuff in between, but then ended up working professionally in web design and development, and kind of haven’t looked back since.

然后我离开了，在这之间做了其他各种事情。 然后，在大约2000年代，即2010/11左右，又回到了技术领域。 我结束了工作……好了，我在这之间做了很多疯狂的工作，但是后来结束了专业的Web设计和开发工作，从那以后就再也没有回头。

Tim: 蒂姆：

That’s really great to hear, because I don’t think we talk about QBasic enough on this show. I was going to bring it up to David earlier.

听到那真是太好了，因为我认为我们在这场演出中对QBasic的谈论不够。 我本来打算早点带给大卫的。

Guy: 伙计：

[Chuckles] Amazing, yeah. We make these kind of — I guess it was kind of like command line games, way, way back in the day. Like drawing shapes and stuff with code, and these decision tree games and stuff. If someone showed it to me now, I would have no idea what was going on, but I’d probably pick it up if I had to.

[笑声]太好了 。 我们做这样的事情-我想这有点像命令行游戏，回到过去。 就像用代码绘制形状和东西，以及这些决策树游戏和东西。 如果有人现在向我展示它，我将不知道发生了什么，但如果有必要，我可能会选择它。

David: 大卫：

It sounds like tech was an early love, and then it drew you back in.

听起来科技是早恋，然后又吸引了您。

Guy: 伙计：

Yeah, I suppose so. I guess maybe a philosophical answer to that is, the thing that’s always worked really well for me is a combination, in almost equal measure, of creativity and science. That technical side of stuff, and then the really creative stuff. After school and university, the first thing I did was I was a camera man. I worked in the film industry for like five years. I even have an IMDB page, which is kind of a claim to fame, I suppose. I did all sorts of very interesting, sometimes somewhat dodgy independent films and stuff here in the UK.

是的，我想是的。 我猜这可能是一个哲学上的答案，对我来说一直很有效的事情是创造力和科学的结合，几乎相等。 技术方面的东西，然后是真正有创意的东西。 从学校和大学毕业后，我要做的第一件事就是我是一名摄影师。 我在电影界工作了五年。 我想我什至有一个IMDB页面 ，这有点名气。 在英国，我拍了各种各样非常有趣的电影，有时甚至有些晦涩难懂的独立电影。

That was a really interesting balance of the creativity of storytelling, and lighting and framing, composition. That kind of stuff. Then, the technical stuff of, you know, you’ve got a camera with all these buttons or you’ve got to work out things like the f-stops and the focal lengths, and all that kind of stuff of the lenses that you’re working with. It was great. I really enjoyed it, because it had that, it really satisfied that combination of the two sides. The problem with it was that it wasn’t very well paid. That became a bit of a sticking point, and I ended up going off to find the next thing.

这是讲故事，照明和取景，构图的创造力之间真正有趣的平衡。 那种东西 然后，技术上的东西，你知道，你有一个带有所有这些按钮的照相机，或者你必须弄清楚像f-光圈和焦距，以及所有这些镜头的东西。正在合作。 太好了。 我真的很喜欢它，因为有了它，它真的很满意双方的结合。 问题在于它的报酬不是很高。 那变得有点棘手，我最终去寻找下一个东西。

David [4:04]: 大卫[4:04] ：

It sounds like you were doing visual stuff right from the start.

听起来您从一开始就在做视觉工作。

Guy: 伙计：

Yeah, I think so. I’ve always been quite a visual person. People in my family have been very visual. They’ve been to art school or what have you. I always kind of resonated with that kind of stuff, but I always felt so frustrated that I couldn’t get something looking the way that I wanted it to look. Back in the day, it was like working with paint on canvas, or pen and paper, or pencil or something like that. I would do artistic kind of stuff.

是的，我是这样认为的。 我一直都是一个有视觉见识的人。 我家里的人非常有视觉感。 他们去过艺术学校或您去过。 我总是对这种东西产生共鸣，但是我总是感到非常沮丧，以至于我无法以我想要的外观来呈现某种东西。 在过去，这就像在画布上，纸和笔，铅笔或类似的东西上绘画颜料一样。 我会做一些艺术性的事情。

But the trouble with it, as soon as you commit like pen to paper, you can’t undo. But when you get into the digital age, if you put the virtual paintbrush to the virtual canvas, if it starts looking like crap, then you can undo as many times as you need to get it back to where you need to start from again. I think that has been much more interesting for me. Again, the visual side of design and development is something I did a little bit of, but I think I was better with the code.

但是麻烦的是，一旦您像纸笔一样投入，就无法撤消。 但是，当进入数字时代时，如果将虚拟画笔放到虚拟画布上，并且看起来像废话，那么您可以根据需要进行多次还原，以使其恢复到需要重新开始的位置。 我认为这对我来说更有趣。 再次，设计和开发的视觉方面是我做了一点点的工作，但是我认为使用代码会更好。

Tim: 蒂姆：

How would you say that your work in the visual artistic space in the past relates to what you’re currently doing today?

您如何看待您过去在视觉艺术领域的工作与您目前的工作有关？

Guy: 伙计：

Good question. I think it’s just given me a really good baseline for doing things to a very high level of detail. Something that I hear a lot from employers and especially from designers is, people don’t seem to get it. They don’t get the details. They don’t see the nuance. They don’t see, sometimes, the patterns in the systems. Obviously, this is not the case for everybody, but it’s something that I definitely hear a lot. Being able to kind of approach something with that creative eye, and with a maybe a slightly more understanding of things like balance and composition and that kind of thing, has been really useful.

好问题。 我认为这只是给我一个非常好的基线，可以做非常详细的事情。 我从雇主那里，尤其是从设计师那里听到的很多东西是，人们似乎没有得到。 他们没有细节。 他们看不到细微差别。 他们有时看不到系统中的模式。 显然，不是每个人都这样，但我肯定会听到很多。 能够用那种富有创造力的眼光去看待某种事物，并且也许对平衡，构图之类的东西以及诸如此类的东西有更多的了解，这真的很有用。

Yeah, for whatever reason, it’s gone quite well. I think when anybody is doing something that they genuinely enjoy, and kind of satisfies them and ticks all those boxes of being — you know, you get kind of that internal balance, and then you just do your best work — because you’re working towards something that you really, really enjoy.

是的，无论出于什么原因，一切都进行得很好。 我认为，当任何人正在做他们真正喜欢的事情，并满足他们并打勾所有存在的状态时-您知道，您会获得那种内部平衡，然后您会尽力而为-因为您正在工作朝着您真正非常喜欢的事物发展。

David: 大卫：

Absolutely. It sounds to me like you’ve brought a lot of your design philosophy into what you’re doing as well.

绝对。 在我看来，您已经将很多设计理念带入了您正在做的事情中。

Guy: 伙计：

Quite possibly. Everything is complex. There’s no one person or no one subject area or whatever, which is purely black and white. Everything is so many different shades of gray and shades of complexity. If you’re fortunate enough to be able to, then you kind of find the combinations and the palette, if we’re going to continue with some kind of philosophical artistic discussion, that works best.

很有可能。 一切都很复杂。 没有一个人或一个主题领域，或者任何纯黑白的领域。 一切都是那么多种不同的灰色阴影和复杂阴影。 如果您足够幸运，那么您可以找到组合和调色板，如果我们继续进行某种哲学的艺术讨论，那将是最好的选择。

Tim: 蒂姆：

For any of our listeners who aren’t familiar, what sort of things are you working on right now?

对于我们不熟悉的任何听众，您现在正在做什么工作？

Guy: 伙计：

I will endeavor to focus on the tech side of things, because I actually do a few other bits and pieces as well. Maybe we can talk about those later if you’re interested.

我将努力专注于技术方面，因为我实际上还做了其他一些零碎的工作。 如果您有兴趣，也许以后我们可以再谈谈。

David: 大卫：

Absolutely. Actually, it is interesting how the tech blends into the other parts of the work that you’re doing.

绝对。 实际上，有趣的是，技术如何与您正在工作的其他部分融合在一起。

Guy: 伙计：

Okay, sure. I’ll start with the tech stuff, and then maybe talk about the other bits and pieces as well. Currently, I’m working as a contract front-end developer, and have been for the last three or four years now. In that kind of work, I work with a lot of agencies here in London, and go in to do consulting type stuff, but also to go in and deliver projects for them.

好的，当然。 我将从技术方面开始，然后也许再谈谈其他细节。 目前，我正在从事合同前端开发人员的工作，并且已经工作了三到四年了。 在这种工作中，我与伦敦的许多代理商合作，从事咨询类型的工作，也从事为他们交付项目的工作。

Sometimes people come direct to me, and I help them with whatever they need help with — whether that be just advising them on how they can get started in their business, or how they can get from point A to point B, or point B to point C. Predominantly, it’s working with brands and building interactive websites. I do occasionally do some application-level stuff as well. Currently working on an Angular app. Yeah, kind of whatever is required is what we jump into.

有时人们会直接找我，我会在需要帮助的情况下为他们提供帮助-无论是只是建议他们如何开始业务，或者如何从A点到达B点，或从B点变成C点。主要是与品牌合作并建立交互式网站。 我偶尔也会做一些应用程序级的事情。 目前正在开发Angular应用。 是的，我们所需要的只是什么。

Kind of on the side of that, a couple of years ago I was working on a side project which was an online teaching platform called AtoZ CSS. I just kind of had this idea one afternoon, and said, Hmm, CSS is kind of interesting, and kind of diverse and quite wide in specification. There’s all sorts of properties and values and sort of stuff. I wonder if there is one for every letter of the alphabet.

从某种意义上说，几年前，我正在做一个副项目，这是一个称为AtoZ CSS的在线教学平台。 我只是在一个下午有一个想法，然后说， 嗯，CSS很有意思，种类繁多，规格也相当广泛。 有各种各样的属性和值以及各种各样的东西。 我想知道字母表中的每个字母是否都有一个。

I kind of sat down one afternoon, and just made the list of A, B, C, D all the way to Z, and started trying to work out what property or value or concept might match with each of those. Then I turned it into a screencast series. It got picked up. It got seen around the place. People seem to enjoy it, and that’s actually led to me joining SitePoint as a channel editor. I’m now working with the SitePoint team to help other people contribute video for the HTML and CSS channel over there.

我有点坐下来一个下午，一直将A，B，C，D一直列出到Z，然后开始尝试确定哪些属性，值或概念可能与之匹配。 然后，我把它变成了一个电视连续剧。 它被捡起。 到处都可以看到它。 人们似乎很喜欢它，这实际上导致我加入SitePoint作为频道编辑器。 我现在正在与SitePoint团队合作，以帮助其他人在那里为HTML和CSS频道提供视频。

Yeah, quite a few bits and pieces going on. In the evenings and weekends, I teach in person as well. I’ve been teaching with General Assembly for the last three years or so. Pretty much exclusively front-end development. We do like a 10 week part time course. We do a JavaScript part time course. Then we do immersive courses across the full stack of JavaScript, a bit of Ruby, and all sorts of good stuff.

是的，持续进行着很多零碎的工作。 在晚上和周末，我也亲自授课。 在过去三年左右的时间里，我一直在大会任教。 几乎完全是前端开发。 我们确实喜欢10周的兼读课程。 我们开设了JavaScript兼职课程。 然后，我们在完整JavaScript堆栈，一点点Ruby和各种各样的好东西中进行沉浸式课程。

Tim [8:42]: 蒂姆[8:42] ：

I want to talk about your education endeavors in a second, but before we do that, I’ve always found that agency work for me was a little bit challenging, because I’m someone who likes to invest in the long-term care of the projects that I release. Have you found that as in issue, or have you been able to overcome that? How do you really look at the long-term care and performance, and maintainability of the projects that you are working on for agencies?

我想在下一秒钟谈论您的教育努力，但是在我们这样做之前，我总是发现代理机构对我来说有点挑战，因为我是一个喜欢投资于长期护理的人我发布的项目。 您是否发现有问题，还是能够克服？ 您如何看待代理机构正在从事的项目的长期护理和绩效以及可维护性？

Guy: 伙计：

That’s an interesting question, because a lot of the stuff that I did to begin with — where I was full-time, at a single agency — they had retainer clients. They would bring somebody on. Sometimes they would pick up their existing site and just kind of tweak it and maintain it. Sometimes they would start from scratch. They were ongoing projects. For example, one of the big ones was a big cereal brand that we have here in the UK called Dorset Cereals. They produced a site for them back in the mid 2000s or something. (It was only recently completely redeveloped from the ground up.)

这是一个有趣的问题，因为一开始我做的很多事情-我是在一家代理商全职工作-他们都有聘用客户。 他们会带人。 有时他们会选择他们现有的站点，只是对其进行调整和维护。 有时他们会从头开始。 他们是正在进行的项目。 例如，其中一个大品牌是谷物大品牌，我们在英国拥有一个名为多塞特谷物的品牌。 他们在2000年代中期为他们创建了一个网站。 (直到最近才完全重新开发。)

For about 10 years, it was an ongoing project where there were things being added, things being removed, things being cleaned up. Things being tweaked and monitored and all that kind of stuff. Even though it was an agency, there was an attention given to the long-term sustainability of a project. Which was quite an interesting angle.

在大约10年的时间里，这是一个正在进行的项目，其中添加了一些东西，删除了一些东西，清理了一些东西。 调整和监视事物以及所有类似的东西。 即使它是一个代理机构，也要注意项目的长期可持续性。 这是一个非常有趣的角度。

The kind of flips side of that is that I really don’t find that kind of maintenance work very interesting. I much prefer to do new projects, start new things, and kind of learn new stuff as I go. When I left there and went contracting, that was actually quite satisfying, because I got to work on a lot of new things from scratch. I was able to bring that experience of kind of building something with maintainability and performance in mind.

不利的一面是，我真的不觉得这种维护工作很有趣。 我更喜欢做新的项目，开始新的事物，以及在学习过程中学习新的东西。 当我离开那里去签约时，这实际上是很令人满意的，因为我必须从头开始处理许多新事物。 我能够想到那种在构建具有可维护性和性能的东西的经验。

David: 大卫：

One of the nice things about being able to start new projects all the time, is that you’re constantly being exposed to whatever the latest technology is. I’m curious, how do you approach structuring a project these days?

始终能够启动新项目的好处之一是，您将不断接触最新技术。 我很好奇，这些天您如何处理项目结构？

Guy: 伙计：

Structure and site architecture is one of the things I found really fascinating. I guess it was kind of getting into that nerdy end of planning and organization and logic and stuff. I pretty much only work with the front-end side of things, but one of the things I spent quite a lot of time working on was working out the best way to start a project. How best to structure the Sass. How best to structure the JavaScript modules. How best to run all the tasks and stuff like that.

结构和站点架构是我发现真正令人着迷的事情之一。 我想这有点像进入计划，组织，逻辑和事物的书呆子了。 我几乎只在前端方面工作，但我花费大量时间进行的工作之一就是找到启动项目的最佳方法。 如何最好地构造Sass。 如何最好地构造JavaScript模块。 如何最好地运行所有任务和类似的东西。

This is something that has happened over a number of years, because when I first started I didn’t know about any of those things. It’s kind of just been this constant journey and desire to find a good, solid system that works. The funny thing is, that is kind of not really attainable, because even when you do get something that you think is good and working and solid, you then realize, Oh, I could just improve it here. Or, I don’t need that thing anymore, because I don’t really use it. You’re constantly in this kind of evolution of improvement. I think that’s important too, otherwise you end up getting stuck in the old ways and never progress.

这是多年来发生的事情，因为当我第一次开始时，我对这些事情一无所知。 这只是不断的旅程，并渴望找到一个有效的，可靠的系统。 有趣的是，这并不是真正可以实现的，因为即使您确实获得了您认为不错的东西并且可以正常工作，但您仍然意识到， 哦，我可以在这里改善它。 或者， 我不再需要该东西，因为我并没有真正使用它。 您一直在不断进行这种改进。 我认为这也很重要，否则您最终会陷入旧的困境而永无进展。

Tim: 蒂姆：

What have you come to for the current stack?

您对当前堆栈有什么看法？

Guy: 伙计：

What I’m using at the moment, I’m still favoring Sass. Although, we recently commissioned a series on PostCSS, which looked really interesting. It was one of those kind of things that, if you’ve got something that you feel is working really well for you, you don’t necessarily go looking for a solution. This thing came to me because we commissioned a short series of videos on SitePoint. It was like really interesting. I was thinking I want to get into this. It looks like it’s a bit more flexible and it can do some extra stuff, which is kind of cool.

目前，我正在使用Sass 。 虽然，我们最近委托了一系列PostCSS ，但看起来确实很有趣。 这是其中的一种，如果您发现某些东西对您来说真的很有效，那么您不一定要寻找解决方案。 之所以出现这件事，是因为我们在SitePoint上委托了一段简短的视频 。 真的很有趣。 我以为我想进入这个领域。 看起来它有点灵活，可以做一些额外的事情，这很酷。

David [12:18]: 大卫[12:18] ：

Can you explain briefly what PostCSS means for our listeners?

您能否简要说明PostCSS对我们的听众意味着什么？

Guy: 伙计：

Yeah, sure. Sorry, I should have done that. PostCSS is like a JavaScript plugin. It’s a command line tool which allows you to transform your styles using JavaScript. A bit like the way Sass works, where it goes through a compiler. PostCSS will kind of pick up your standard CSS code. Not Sass, not SCSS, not Less. Standard CSS file name. It will pick it up. It will pass it into a node tree of all the different selectors, and properties, and values, and stuff. Then it can do stuff to them. It can manipulate them in some way, and then it spits out regular CSS again. It’s kind of like a two-way transformation.

当然可以。 抱歉，我应该这样做。 PostCSS就像一个JavaScript插件。 这是一个命令行工具，可让您使用JavaScript转换样式。 有点像Sass的工作方式，即通过编译器。 PostCSS会选择您的标准CSS代码。 不是Sass，不是SCSS，不是Less。 标准CSS文件名。 它会捡起来。 它将把它传递到所有不同选择器，属性，值和内容的节点树中。 然后它可以对他们做事。 它可以某种方式操纵它们，然后再次吐出常规CSS。 这有点像双向转换。

Yeah, it kind of looked very interesting. The thing that is kind of conflicting me at the moment is I’m looking at it going, I’ve got a few projects on the go at the moment, and I’ve got a few systems that I’ve set in place for like boilerplate code, which I reuse all the time. I don’t know if I’ve got the energy to go back and change them all to just for the sake of experimenting. What I might try an do is find a standalone project where I can go and experiment with it as a one off, and see how it goes and see if it is something I want to transition to.

是的，看起来很有趣。 目前让我感到矛盾的是，我正在考虑它的发展，目前我正在处理一些项目，还为我准备了一些系统像样板代码一样，我一直都在重复使用。 我不知道我是否有足够的精力回去将它们全部更改为仅出于实验目的。 我可以尝试做的是找到一个独立的项目，在这里我可以将其作为一个整体进行试验，然后看看它如何进行，看看它是否是我要转换的东西。

David: 大卫：

These days, front-end code is becoming so much more complex. I remember the days when you used to just write a line of JavaScript, stick it in and you were done.

如今，前端代码变得越来越复杂。 我记得曾经写过一行JavaScript的日子，坚持做完就可以了。

Guy: 伙计：

Yeah, although things they go in circles. When I first started, it was all on-click in the HTML. Then everyone’s like, No, this is terrible. This is not separation of concerns. Blah, blah, blah. Then now we’ve come back to Angular and React. You know, the modern JavaScript frameworks, and they’re all about putting JavaScript in the HTML, or even putting HTML in the JavaScript. It’s funny how things go around.

是的，尽管事情会转圈。 当我第一次开始时，全部都是在HTML中单击的。 然后每个人都喜欢， 不，这太可怕了。 这不是关注点分离。 等等等等等等。 然后，我们回到Angular和React。 您知道，现代JavaScript框架都是将JavaScript放入HTML，甚至将HTML放入JavaScript。 事情如何发展很有趣。

Tim: 蒂姆：

Speaking about some of the education that you do. I was a content or a curriculum advisor for General Assembly’s JavaScript course for a brief period of time, and I found that there’s something that sells in this industry, wherein you can get a lot of people to sign up for a course if you promise to teach them about the latest framework. Which is not necessarily something that I think is helpful for people who are actually looking to learn the most they can about web development. Have you found that there is, in the education space, a gap between what brings in the most students, versus what you think students should really be learning?

谈到您所接受的一些教育。 我曾在短时间内担任过大会JavaScript课程的内容或课程顾问，但我发现在这个行业中有很多东西可以出售，如果您承诺可以使很多人报名参加课程教他们有关最新框架的知识。 我认为这不一定对真正想要学习有关Web开发的最大知识的人有所帮助。 您是否发现在教育领域中，吸引最多学生的是什么与您认为学生应该真正学习的之间存在差距？

Guy: 伙计：

I think there is certainly an imbalance between the kinds of things that people either think they should know, or want to know, and what they need to know. You’re absolutely right. There’s a lot of talk about the new hotness of whatever framework, be it a JavaScript app framework, or be it like a front-end framework — like Bootstrap or Foundation or something. It’s more often the case with people thinking they’ve heard of something, and someone said, Oh, this thing’s really cool. And without having done maybe a huge amount of research, they’ve just gone, Oh, this person that I know and trust, and like, and understand, and believe, says something’s pretty cool, so it must be pretty cool. If I have an opportunity to go and ask a question like, Oh, are we learning this?, or Are we learning that? then maybe it just comes out with too much thought.

我认为人们认为自己应该知道或想要知道的事情与需要知道的事情之间肯定存在不平衡。 你是绝对正确的。 无论是JavaScript应用程序框架，还是像前端框架(如Bootstrap或Foundation之类)的框架，都有很多关于新热点的讨论。 人们通常以为自己听说过某件事，而有人说， 哦，这件事真的很酷。 而且，他们没有做大量的研究，就走了， 噢，我认识，信任，喜欢，理解和相信的那个人说的很不错，所以一定很不错。 如果我有机会去问一个问题，例如， 哦，我们正在学习吗？ ，还是我们正在学习？ 那么也许只是想得太多。

I can’t really speak for the people who manage the curriculums and stuff at General Assembly. I think the web is changing so fast, that I guess the stance that I take is, instead of learning the latest framework and jumping straight into that, and being able to make something kind of by trial and error and working it out, then it’s always best to start with the fundamentals and start with a good foundation. Even though I love Sass, and that’s what I write all my CSS in on almost a daily basis, I advocate starting with CSS and understanding the fundamental concepts of inline and block, and how to style typography so it is readable and accessible. How to build up your layouts, starting with small things, moving on to things like float, inline-block. Then moving to positioning. Then all these other things. Just layering it on bit by bit.

我真的不能代表在大会上管理课程和资料的人发言。 我认为网络的变化是如此之快，以至于我想采取的立场是，与其学习最新的框架并直接跳入该框架，然后能够通过反复试验做出一些努力并加以解决，不如说是总是最好从基础开始，从良好的基础开始。 即使我喜欢Sass，这也是我几乎每天都写所有CSS的内容，但我还是主张从CSS入手，了解内联和块的基本概念，以及如何设置字体样式，以便于阅读和访问。 如何构建布局，从小事情开始，到浮动，内联块之类的东西。 然后移动到定位。 然后是所有其他这些东西。 只是一点一点地分层。

David [16:17]: 大卫[16:17] ：

Absolutely. If you don’t understand those things, it’s impossible to really make to take advantage of what Sass or the other frameworks. If you don’t understand Ruby, you can’t really take advantage of Rails. If you don’t understand JavaScript, you can’t really take advantage of Angular.

绝对。 如果您不了解这些内容，那么就不可能真正利用Sass或其他框架。 如果您不了解Ruby，那么您将无法真正利用Rails。 如果您不了解JavaScript，那么您将无法真正利用Angular。

Guy: 伙计：

Yeah, absolutely. I put myself in a situation once where I started a business. It was probably not the best decision given the team that we had, but I was like, I quite fancy learning Rails, so we’re going to do the MVP in Rails. I didn’t really know much Ruby, but I was able to throw something together in a week, a couple of weeks, a month — whatever it was. I was able to get an understanding of Rails through doing that. It wasn’t something that I really understood on the ground level. It was an interesting exercise, but it was doing it the wrong way.

是的，绝对。 我刚开始做生意时就陷入困境。 对于我们所拥有的团队来说，这可能不是最好的决定，但是我想我很想学习Rails，所以我们将在Rails中做MVP。 我对Ruby的了解并不多，但是无论如何，我都能在一周，几周，一个月的时间内完成一些工作。 通过这样做，我能够对Rails有所了解。 我并不是从地面上真正理解的东西。 这是一个有趣的练习，但是做错了方法。

Tim: 蒂姆：

One of the things that helps me best in my career was the progression between learning more JavaScript syntax and how the language worked, to learning design patterns in software. I think that helps so much. It really is easy to reach for the latest framework, and you can probably get a lot done in that. Just learning the design patterns of software along with the fundamentals, syntax, basics, things like that, really helps you to get a better grasp of what it is that you’re working on, and common pitfalls, and where something might go wrong in the future.

在我的职业生涯中帮助我最好的事情之一就是在学习更多JavaScript语法和语言的工作方式到学习软件的设计模式之间的过渡。 我认为这很有帮助。 对于最新的框架，确实很容易达到，并且您可以在其中完成很多工作。 仅学习软件的设计模式以及基础知识，语法，基础知识之类的东西，就可以真正帮助您更好地了解所从事的工作，常见的陷阱以及可能出现问题的地方。未来。

Guy: 伙计：

Yeah. One of the examples I’ve often given in the classroom is if I went to the shop and bought like a Lego set. Which was how to build a Death Star in Lego. You have all the pieces, and you have the instructions. You could probably build that just by following the bits and pieces along. Following all the pictures and whatever. That’s cool. You made a thing and it works and maybe it looks good. Maybe you show it off to your friends. Whatever. If then you kind of say right now, Get rid of all the instructions. Here is another set of bricks. Different colors, different shapes, different sizes, but there’s no instructions. Make the Taj Mahal out of Lego. You’d be like, I have no idea how to even start.

是的 我经常在教室里举一个例子，就是我去商店买东西像乐高玩具一样。 这就是在乐高积木中打造死星的方法。 您已掌握所有内容，并获得了说明。 您可能只需遵循点点滴滴就可以构建它。 跟随所有图片以及其他内容。 这很酷。 您做了一件事情，它起作用了，也许看起来不错。 也许您向朋友炫耀一下。 随你。 如果那样的话，您现在就说吧， 摆脱所有指示。 这是另一套砖块。 不同的颜色，不同的形状，不同的大小，但没有说明。 用乐高积木制作泰姬陵。 您可能会想， 我什至不知道如何开始。

Understanding what the tools are, understanding what the building blocks are, allows you to then make whatever you need, through your own creativity rather than just blindly following along and going, Oh, step 1: put this here. Step 2: put this there.

了解工具是什么，了解构件是什么，可以让您通过自己的创造力来做所需的事情，而不仅仅是盲目跟进， 哦，第一步：将其放在此处。 第2步：将其放在此处。

David: 大卫：

Absolutely. I think I’ve made the joke before, that if you want to build Basecamp, start with Rails. Knowing what a framework is good for, kind of implies what you’re going to be creating with it.

绝对。 我想我曾经开过一个玩笑，如果您想构建Basecamp，请从Rails开始。 知道框架有什么用，就意味着您将要使用它来创建什么。

Guy: 伙计：

Yeah, quite possibly.

是的，很有可能。

David: 大卫：

One of the things that interests me about your career is a lot of people get into tech, and they love developing the stuff, but you’ve actually made a point of going out there and teaching, and educating, and getting in touch with the community, and sharing your knowledge. I’m curious how that started for you.

我对您的职业感兴趣的一件事是，很多人都喜欢技术，他们喜欢开发这些东西，但实际上，您已经提出了去那里进行教学，教育和联系的观点。社区，并分享您的知识。 我很好奇这是如何开始的。

Guy: 伙计：

It’s a good question. It’s something that I don’t think I sought it out intentionally. I was working at an agency at the time, and I was their lead front-end developer. We had an intern come in for a short period of time. Couple of weeks or so. She was allocated to me as someone who can teach her a thing or two on a project that we were working on. I got her to help out with some fairly low-level stuff. Kind of watched. It was like we were pet programming together.

这是一个好问题。 我认为这不是我有意寻找的东西。 当时我在一家代理商工作，我是他们的前端前端开发人员。 我们有一个短期实习生。 几个星期左右。 她被分配给我，可以在我们正在进行的项目中教她一两件事。 我请她帮忙一些低级的工作。 有点受关注。 就像我们在一起一起编程一样。

She was really good, and I was a bit surprised, because I had been told, Oh yeah, we got this intern coming in. She’s interested in code and wants to kind of see what it’s like to work in an agency and stuff. She was really genuinely good. I was chatting to her and I said, Where did you learn all this stuff, because it seems like you kind of know what you’re doing, and you could probably be paid to work here, rather than interning for free. She said, Oh, well, I went to General Assembly in New York. Yeah, I think it was in New York that she actually went. I said, Oh, what’s General Assembly? She said, Oh, well it’s this place where you go and learn about this stuff. It’s like bootcamp style where they take you for three months and it’s pretty intense every day for five, six days a week. Now I’ve come back to London and I’m actually assisting on one of the courses that they’re running here.

她真的很好，让我有些惊讶，因为有人告诉我， 哦，是的，我们有这个实习生。她对代码感兴趣，想了解一下在代理机构或其他部门工作的感觉。 她真的很善良。 我在和她聊天，我说： “您从哪里学到了这些东西，因为您似乎知道自己在做什么，并且可能会得到报酬在这里工作，而不是免费实习。 她说， 哦，好吧，我去了纽约的大会。 是的，我认为她实际上是在纽约。 我说， 哦，什么大会？ 她说， 哦，好吧，这是您去那里学习相关知识的地方。 就像训练营式的那样，他们要花三个月的时间，而且每周五，六天每天都很紧张。 现在我回到伦敦，实际上我正在协助他们在这里进行的其中一门课程。

I said, Oh, that sounds pretty cool. Do you think they need any other front-end instructors? She said, Yeah, I’ll ask the question. Why not? About a week later I was having lunch with the producer of all the courses. The following week I think I was teaching my first lesson. It was just one of those things. You see an opportunity, you ask the right question. Yeah, the rest is history, as they say.

我说， 哦，听起来很酷。 您认为他们需要其他任何前端讲师吗？ 她说， 是的，我会问这个问题。 为什么不？ 大约一周后，我与所有课程的制作人共进午餐。 接下来的一周，我想我正在教第一堂课。 那只是其中之一。 您看到机会，问正确的问题。 是的，正如他们所说，其余就是历史。

David [20:35]: 大卫[20:35] ：

You’re teaching for General Assembly. You were writing that course that you released yourself and that’s now part of SitePoint. You’re running channels for SitePoint. It’s wonderful to be giving back to the community. Also getting back in the process, I imagine.

您正在为大会教学。 您正在编写自己发布的课程，现在已成为SitePoint的一部分。 您正在运行SitePoint的频道。 回馈社区真是太好了。 我想也将重新回到这一过程中。

Guy: 伙计：

Absolutely. There is something really satisfying about being able to help people. I think that’s where it comes from. It’s just having a genuine interest in a topic. I get this kind of huge sense of pride for my students when I see that similar kind of spark in them. They come in and they say, Oh, I was working till like 3:00 in the morning on my homework. It was really tough, but then I did it and it was amazing. It’s just so rewarding to hear somebody get excited about that kind of thing.

绝对。 能够帮助人们的确令人满足。 我认为那是它的来历。 它只是对某个主题有真正的兴趣。 当我看到学生身上出现类似的火花时，我为他们感到非常自豪。 他们进来，他们说， 哦，我一直在工作直到凌晨3:00。 这真的很艰难，但是后来我做到了，这真是太神奇了。 听到有人对这种事情感到兴奋，真是令人兴奋。

I guess the reason that really kind of brings it home for me is that, when I was doing my first thing out of university, I was trying to pursue this passion of making films and being this kind of creative technical person with the cameras and stuff. I was making no money, quite frankly. It was like, there was maybe a week’s work, and then a month off. Then a couple of days' work, and then a month off.

我想让我真正回到家的原因是，当我大学毕业时做第一件事时，我试图追求拍摄电影的热情，并成为具有摄影机和摄影器材的创意技术人员。 坦率地说，我没有赚钱。 好像有一个星期的工作，然后一个月休息。 然后工作几天，然后休息一个月。

Since I’ve found my groove in tech, I’ve been able to completely turn that around and like 10x what I used to earn. If I can help anybody else kind of find their passion and find something that can open so many doors for them — if I can do that even just for one person, then that’s amazing to be able to play a part in. I don’t even need to know if I played that part. It’s just if somebody else can reap the benefits themselves, well then that’s awesome.

自从发现自己在技术领域的专长以来，我已经能够完全扭转局面，并且将收入提高到原来的10倍。 如果我可以帮助其他人找到他们的激情，找到可以为他们打开很多门的东西-如果我即使只为一个人也可以做到，那么能够参与其中真是太棒了。我没有甚至需要知道我是否扮演过这一角色。 只是别人可以自己获得收益，那就棒极了。

David: 大卫：

Where do you think people should get started if they wanted to get involved in the type of work that you’re doing? In terms of publishing information and sharing it out with people?

如果人们想参与您正在从事的工作类型，您认为应该从哪里开始？ 在发布信息并与人们共享方面？

Guy: 伙计：

I think the barrier to entry is pretty low. It’s something that you could just pick up a text editor. If you’re already writing code, then you already know what one of those is. You can just crack open a new tab, and just start writing down — even just start writing down topics that you’re interested in. Then from there, take one of those and start writing a blog post. Then before you know it, you’ve got something which is unique and interesting and valuable. You can post that anywhere online, or join a forum. Get a Medium account. Break it up into 140 character bits and post it on Twitter as a Twitter stream of consciousness.

我认为进入的门槛很低。 您可以选择一个文本编辑器。 如果您已经在编写代码，那么您已经知道其中之一。 您可以打开一个新选项卡，然后开始写下-甚至只是开始写下您感兴趣的主题。然后从那里开始，选择其中一个并开始撰写博客文章。 然后，在您知道它之前，您就会得到一些独特，有趣和有价值的东西。 您可以在网上任何地方发布该帖子，也可以加入论坛。 获取一个中等帐户。 将其分解为140个字符位，并作为Twitter意识流发布到Twitter上。

The barrier to entry for actually putting stuff out there is really low these days. The issue is, that it’s really hard to get noticed, so it can be a bit demoralizing if you’re putting stuff out there and nobody sees it. But it depends what you’re doing it for. Are you doing it for yourself? Are you doing it to help other people? Everybody will have a different stance on why they’re doing something.

如今，将物品实际放到外面的壁垒确实很低。 问题是，很难真正注意到它，因此如果您将东西放到那里而没人看到它，那可能会令人沮丧。 但这取决于您要做什么。 你是自己做的吗？ 您是在帮助别人吗？ 每个人对于为什么要做某事都会有不同的立场。

Fortunately, the developer community — also the design community — is so open and friendly and everybody shares everything. It’s quite unbelievable. It’s like you go to a conference with developers and they’re all like, Here are the secrets. All of the secrets! Have them. Go and make amazing things. You go to like a standard car salesman conference. I don’t know if they have those, but maybe they do. They’re like, We did this amazing thing. We made all this money, and I’m not telling you any of the secrets. Go and work it out yourself. I’m guessing, but I imagine that it’s maybe not as friendly and open as our industry. So yeah, embrace that. Embrace the fact that people love learning stuff and love sharing stuff. Just dive in.

幸运的是，开发人员社区(也包括设计社区)是如此开放和友好，每个人都共享一切。 太不可思议了。 就像您去参加与开发人员的会议一样，他们都一样， 这是秘密。 所有的秘密！ 拥有他们。 去做惊人的事情。 您可以参加标准的汽车推销员会议。 我不知道他们是否有，但也许他们有。 他们就像， 我们做了一件了不起的事情。 我们赚了这么多钱，我没有告诉你任何秘密。 去自己动手做吧。 我在猜测，但我想它可能不像我们的行业那么友好和开放。 是的，拥抱那个。 拥抱人们喜欢学习和共享知识的事实。 潜入。

Tim: 蒂姆：

That is certainly sound advice, and if you are one of our listeners just getting started into this and are looking to learn more, just do exactly what Guy said. I don’t have anything to add to that. Guy, thank you so much for joining us today. How can people connect with you, find out more about what you do, and learn and attend your courses?

当然，这是正确的建议，如果您是我们的听众之一，并且刚刚开始阅读并希望学习更多，请按照Guy所说的去做。 我没有什么要补充的。 盖伊，非常感谢您今天加入我们。 人们如何与您建立联系，了解有关您的工作的更多信息，以及学习和参加课程？

Guy [24:10]: 盖伊[24:10] ：

I’m kind of a bit dark online at the moment. I haven’t even opened my Twitter since about May last year. Normally I would say that was the easiest way to get ahold of me. Yeah, you can tweet me @guyroutledge. You can check out the stuff that we’ve got on SitePoint, and I think there is ways to connect with me on there if you want to — well if you just drop us an email. Drop us a comment on one of the posts, and we’ll find it and we will be able to start a conversation.

我目前在线上有点黑。 自去年五月以来，我什至没有打开过Twitter。 通常，我会说这是了解我的最简单方法。 是的，你可以发给我@guyroutledge 。 您可以查看SitePoint 上的内容，如果您愿意的话 ，我认为可以通过多种方式与我联系 -如果您给我们发送电子邮件，那么很好。 在其中一个帖子上给我们留言，我们将找到它，我们将可以开始对话。

David: 大卫：

Fantastic. Well I’m hoping a lot of those conversations get started as a result of this. Thank you so much for joining us today on The Versioning Show.

太棒了 好吧，我希望很多这样的对话能因此而开始。 非常感谢您今天加入我们的Versioning Show。

---

---

Well, you pronounced his name right. I was impressed by that.

好吧，你的名字叫对。 令我印象深刻。

Tim: 蒂姆：

I did. I was very nervous that even though he told me how to pronounce it, I was still going to get it wrong.

是的 我很紧张，即使他告诉我如何发音，我仍然会弄错它。

David: 大卫：

I’m sure he gets that all the time. It’s amazing the stuff that he’s publishing out there. Have you seen his AtoZ CSS thing?

我相信他会一直得到。 他在那里发布的东西真是太神奇了。 您看过他的AtoZ CSS东西吗？

Tim: 蒂姆：

I have, and I' ha’ve learned a few things. CSS is one of those things — I don’t know if I should call CSS a language, but I’m going to do it anyway. CSS is one of those languages that no matter how much you know, there are always so many different things you can continue to learn about it. One of the things I find interesting is with certain properties that take multiple values, like border, for example. A lot of people are like border: 1px red solid;, but I just learned recently you can just write border: solid red 1px;, and it just knows where to put all of those values in the right places.

我已经学到了一些东西。 CSS是其中之一-我不知道是否应该将CSS称为一种语言，但是无论如何我都会这样做。 CSS是其中的一种语言，无论您了解多少，都可以继续学习很多不同的东西。 我发现有趣的事情之一是某些属性带有多个值，例如border。 很多人都喜欢border: 1px red solid; ，但我最近才了解到，您可以只写border: solid red 1px; ，它只知道将所有这些值放在正确的位置。

I think his series definitely brings to light some of those lesser-known things about CSS. It’s always fun when you get something like that just to — it just helps you write better code at the end of the day.

我认为他的系列文章肯定会揭示一些关于CSS的鲜为人知的东西。 It's always fun when you get something like that just to — it just helps you write better code at the end of the day.

David: 大卫：

It’s sort of like the fun that you get when you’re browsing the stacks in a library. Or looking through a dictionary. Looking for random words that you might not know. It presents the information in a different way than you would expect. You’re exposed to all of these obscure little properties and things that you never would have thought about in CSS. Once you know that the opportunity is there, you learn about them and then you find a way to apply them because, of course, as soon as you learn about something, you realize immediately, Oh, I should have used that!

It's sort of like the fun that you get when you're browsing the stacks in a library. Or looking through a dictionary. Looking for random words that you might not know. It presents the information in a different way than you would expect. You're exposed to all of these obscure little properties and things that you never would have thought about in CSS. Once you know that the opportunity is there, you learn about them and then you find a way to apply them because, of course, as soon as you learn about something, you realize immediately, Oh, I should have used that!

Tim: 蒂姆：

Yeah, and that brings another point to mind. This is something that I touched on. In our industry, all the secrets are out in the open. I remember realizing that for the first time. I thought to myself, why? Why does everybody just give away everything they know? In regards to other industries where there are trade secrets is a literal thing. David, why do you think that’s a thing in our industry, and not a thing in others?

Yeah, and that brings another point to mind. This is something that I touched on. In our industry, all the secrets are out in the open. I remember realizing that for the first time. I thought to myself, why? Why does everybody just give away everything they know? In regards to other industries where there are trade secrets is a literal thing. David, why do you think that's a thing in our industry, and not a thing in others?

David: 大卫：

Well, for one thing it’s very difficult to hide anything in this industry, because everything is out there on the web. It’s published. You can download somebody’s code. Well, at least for front-end, anyway. You can download somebody’s code and look at it, but actually in terms of back-end, I think the people are just as open about sharing. It can’t just be the fact that the technology encourages that environment. I wonder if it has something to do with how quickly things move, in that you may have a trade secret, but that trade secret is only going to last you for a short period of time. Whereas the industry that you’re in is moving so quickly, that you can share everything you know right now, and in six months everything that you’ve shared may or may not be as relevant. The fact that you shared it is always going to be there. That in itself has value.

Well, for one thing it's very difficult to hide anything in this industry, because everything is out there on the web. It's published. You can download somebody's code. Well, at least for front-end, anyway. You can download somebody's code and look at it, but actually in terms of back-end, I think the people are just as open about sharing. It can't just be the fact that the technology encourages that environment. I wonder if it has something to do with how quickly things move, in that you may have a trade secret, but that trade secret is only going to last you for a short period of time. Whereas the industry that you're in is moving so quickly, that you can share everything you know right now, and in six months everything that you've shared may or may not be as relevant. The fact that you shared it is always going to be there. That in itself has value.

Tim: 蒂姆：

I also have a theory of my own. It’s probably stupid, but I’m going to try and just broadcast it. I think because of the distribution of what we do. For example, I’m here writing code on my computer in New York. You’re doing the same thing in … San Francisco.

I also have a theory of my own. It's probably stupid, but I'm going to try and just broadcast it. I think because of the distribution of what we do. For example, I'm here writing code on my computer in New York. You're doing the same thing in … San Francisco.

David: 大卫：

San Francisco.

San Francisco.

Tim [27:48]: Tim [27:48] :

San Francisco. Yes, I remember things. [Laughter] Then there are people all over the world doing this. There’s just so much work to be done. It’s not like I can grow my website building empire and handle all of the websites on the eastern seaboard. That’s just not a possibility. If I’m a car salesman, for example, that is a much more realistic possibility. I think if you could start your own car business, with nothing but a computer or some small tool that everybody, or almost everybody, had access to, I think the willingness to share secrets would be a lot more open. Because, let’s face it, the work’s going to be available for you. There’s room for everybody, and there’s just no way that you would be able to sell all of the cars on the eastern seaboard. Does that kind of make a little bit of sense?

San Francisco. Yes, I remember things. [Laughter] Then there are people all over the world doing this. There's just so much work to be done. It's not like I can grow my website building empire and handle all of the websites on the eastern seaboard. That's just not a possibility. If I'm a car salesman, for example, that is a much more realistic possibility. I think if you could start your own car business, with nothing but a computer or some small tool that everybody, or almost everybody, had access to, I think the willingness to share secrets would be a lot more open. Because, let's face it, the work's going to be available for you. There's room for everybody, and there's just no way that you would be able to sell all of the cars on the eastern seaboard. Does that kind of make a little bit of sense?

David: 大卫：

I suppose. It actually it brings to mind there are other industries where information sharing is similar to what I’ve seen in tech. For example, in education, I was trained to teach English as a second language. One of the things that impressed me about that community when I started getting involved in it, was how freely people share lesson plans and ideas and books. People are always out there sharing, This is what worked for my students. If you’re teaching English to somebody who speaks Turkish, then these are the specific things that are different between this language and that language, and the places where you’ll need to focus. These are the pronunciation issues around Arabic.

我想。 It actually it brings to mind there are other industries where information sharing is similar to what I've seen in tech. For example, in education, I was trained to teach English as a second language. One of the things that impressed me about that community when I started getting involved in it, was how freely people share lesson plans and ideas and books. People are always out there sharing, This is what worked for my students. If you're teaching English to somebody who speaks Turkish, then these are the specific things that are different between this language and that language, and the places where you'll need to focus. These are the pronunciation issues around Arabic.

It’s an area where there is, as you said, an unlimited supply of students. There’s no way that one teacher could monopolize that entire industry, so sharing the information not only spreads that knowledge around, but it also builds up the reputation of the person who’s sharing it. Which I think is a key point.

It's an area where there is, as you said, an unlimited supply of students. There's no way that one teacher could monopolize that entire industry, so sharing the information not only spreads that knowledge around, but it also builds up the reputation of the person who's sharing it. Which I think is a key point.

Tim: 蒂姆：

Yeah. It just helps you get better at your job, at the end of the day. The other thing that I really like that Guy touched on, was his illustration of building the Taj Mahal out of Legos, without any steps. Every day I believe this idea more — that following steps can be helpful in some areas, but if you really want to get better at building things for the web, knowing the fundamentals, and the building blocks, and the patterns, and the syntax, gets you so much further than copying and pasting codes and just going through the motions or going through the steps.

是的 It just helps you get better at your job, at the end of the day. The other thing that I really like that Guy touched on, was his illustration of building the Taj Mahal out of Legos, without any steps. Every day I believe this idea more — that following steps can be helpful in some areas, but if you really want to get better at building things for the web, knowing the fundamentals, and the building blocks, and the patterns, and the syntax, gets you so much further than copying and pasting codes and just going through the motions or going through the steps.

David: 大卫：

That stuff isn’t sexy, but it’s very important. It’s something that if you don’t know it, you’re going to find yourself lost at some point. You will know how to build as many Death Stars as you want out of the Legos, as long as the Legos are configured to look like Death Star pieces. As soon as you’re presented with a Taj Mahal, you have no idea where to go.

That stuff isn't sexy, but it's very important. It's something that if you don't know it, you're going to find yourself lost at some point. You will know how to build as many Death Stars as you want out of the Legos, as long as the Legos are configured to look like Death Star pieces. As soon as you're presented with a Taj Mahal, you have no idea where to go.

Tim: 蒂姆：

Sometimes it’s a trap I get caught in myself. You know, I store a lot of boilerplate code for example. Every once in a while I’ll be building something. I’ll be like just copy paste this to step one, and then I stop and I’m like, Wait a second. Why does this work? Why is this thing doing what I want it to be doing right now? Why is the code all falling into place? I know the steps, but I don’t know the background. The behind the scenes stuff that’s going on that’s making this thing do what I want it to do.

Sometimes it's a trap I get caught in myself. You know, I store a lot of boilerplate code for example. Every once in a while I'll be building something. I'll be like just copy paste this to step one, and then I stop and I'm like, Wait a second. Why does this work? Why is this thing doing what I want it to be doing right now? Why is the code all falling into place? I know the steps, but I don't know the background. The behind the scenes stuff that's going on that's making this thing do what I want it to do.

It’s helpful, because when I learn that, I can branch out. I can tweak things. I can get more results by changing how this one function runs, and tailor it to the specific type of application that I’m building. The customization becomes a lot easier and better for each project. Instead of just following a boilerplate.

It's helpful, because when I learn that, I can branch out. I can tweak things. I can get more results by changing how this one function runs, and tailor it to the specific type of application that I'm building. The customization becomes a lot easier and better for each project. Instead of just following a boilerplate.

David: 大卫：

That’s what terrifies me about starting any project these days, because you’ve got this whole stack. You’ve got this Grunt project, you’ve got npm installing all of these different pieces, and they all work together. It’s like you’ve created this complex tower that’s based on these fundamental building blocks that you have no idea about. You can go in and you can learn the APIs for these things, but you don’t really understand how they’re doing what they’re doing. You’re not really in control of your own project. Yet, if you don’t do that, you have to build so many pieces from the ground up, that you never get anything started.

That's what terrifies me about starting any project these days, because you've got this whole stack. You've got this Grunt project, you've got npm installing all of these different pieces, and they all work together. It's like you've created this complex tower that's based on these fundamental building blocks that you have no idea about. You can go in and you can learn the APIs for these things, but you don't really understand how they're doing what they're doing. You're not really in control of your own project. Yet, if you don't do that, you have to build so many pieces from the ground up, that you never get anything started.

Tim [31:53]: Tim [31:53] :

That’s why I think, again Guy touched on this. He touched on a lot of things. He’s a very smart person. I think that 2017 is going to be the year of simplification. The year of fewer tools and maybe doing a little bit more work with the trade off of being not having to manage yet another dependency. I’ve always favored in my work, as few dependencies, as few single points of failure as possible. There’s always another tool that you can use. I use Gulp for most things. I use Sass for most things. I use npm for most things. I try to keep those things doing as little work as possible. I try to make sure that if I had to remove one of those tools, I could still use my project.

That's why I think, again Guy touched on this. He touched on a lot of things. He's a very smart person. I think that 2017 is going to be the year of simplification. The year of fewer tools and maybe doing a little bit more work with the trade off of being not having to manage yet another dependency. I've always favored in my work, as few dependencies, as few single points of failure as possible. There's always another tool that you can use. I use Gulp for most things. I use Sass for most things. I use npm for most things. I try to keep those things doing as little work as possible. I try to make sure that if I had to remove one of those tools, I could still use my project.

That’s not always possible if I’m working on an Express application. I need npm. That just has to work. But if I am, as I’m doing right now, I’m building basically just a brochure site for a company that my brother works at. I spun up Gulp just for Sass, and then I realized that I don’t need any JavaScript for this site except for this off-canvas menu. I just basically inlined the three lines of JavaScript to make that off-canvas navigation transition.

That's not always possible if I'm working on an Express application. I need npm. That just has to work. But if I am, as I'm doing right now, I'm building basically just a brochure site for a company that my brother works at. I spun up Gulp just for Sass, and then I realized that I don't need any JavaScript for this site except for this off-canvas menu. I just basically inlined the three lines of JavaScript to make that off-canvas navigation transition.

I thought to myself, I could have over-tooled for this very easily, but in keeping things simple, that there’s so much less stress. So much less things I have to worry about. It’s not the most beautiful and elegant thing, but it gets the job done and someone can go and maintain it, and it’s going to be fine.

I thought to myself, I could have over-tooled for this very easily, but in keeping things simple, that there's so much less stress. So much less things I have to worry about. It's not the most beautiful and elegant thing, but it gets the job done and someone can go and maintain it, and it's going to be fine.

David: 大卫：

You used the word over-tooled. I think that it’s a word that people have not been using enough. That it’s a word that people are going to start using if we push this, in 2017. When people are going to start realizing that over-tooling is a very dangerous approach to the way that we’re building these things, and we’re creating these monsters that are going to be very difficult to step into and maintain in the future.

You used the word over-tooled . I think that it's a word that people have not been using enough. That it's a word that people are going to start using if we push this, in 2017. When people are going to start realizing that over-tooling is a very dangerous approach to the way that we're building these things, and we're creating these monsters that are going to be very difficult to step into and maintain in the future.

Tim: 蒂姆：

I think we should push this concept. I think that developer convenience should not get in the way of building maintainable — and I’m not going to say long-lasting — but software that lasts as long as it needs to, and benefits the users first. I think tooling can get in the way of that, and I think maybe we haven’t seen it happen yet, but I think we’re getting to that point. That’s just a theory. If you disagree, if you love tools, let us know, because we want to hear more points of view. We certainly don’t want to live in an echo chamber.

I think we should push this concept. I think that developer convenience should not get in the way of building maintainable — and I'm not going to say long-lasting — but software that lasts as long as it needs to, and benefits the users first. I think tooling can get in the way of that, and I think maybe we haven't seen it happen yet, but I think we're getting to that point. That's just a theory. If you disagree, if you love tools, let us know, because we want to hear more points of view. We certainly don't want to live in an echo chamber.

David: 大卫：

Yes, and if you’re out there developing the next tool that everybody’s supposed to be using, you might have an opinion on this. So tweet us at @VersioningShow and let us know.

Yes, and if you're out there developing the next tool that everybody's supposed to be using, you might have an opinion on this. So tweet us at @VersioningShow and let us know.

Tim: 蒂姆：

Yes, definitely. Because tools are interesting. Tools do make things fun, but yeah, again, I’ve always favored doing just a little bit more work on my side so things are better for the other person. That’s that.

当然是。 Because tools are interesting. Tools do make things fun, but yeah, again, I've always favored doing just a little bit more work on my side so things are better for the other person. 就是这样。

David: 大卫：

Well, cool. I was glad you brought up the issue of code maintainability and agency work in particular, because I think that relates to what we’re talking about here. It’s about how long the code needs to last, and putting the user first. With agency work, I think you get the opportunity to be exposed to work that may not need to last as long, but that needs to address specific needs for specific user bases.

Well, cool. I was glad you brought up the issue of code maintainability and agency work in particular, because I think that relates to what we're talking about here. It's about how long the code needs to last, and putting the user first. With agency work, I think you get the opportunity to be exposed to work that may not need to last as long, but that needs to address specific needs for specific user bases.

Tim: 蒂姆：

Very true, and in those cases, you do have a little bit more room to experiment, as Guy mentioned. He really enjoys trying out new things and new approaches. You know, if you’re working for an agency that says, Hey, we need a website for Thanksgiving that markets our product. Damn it, go have fun, because that’s always a good fun thing to maybe try using the next module bundler or something.

Very true, and in those cases, you do have a little bit more room to experiment, as Guy mentioned. He really enjoys trying out new things and new approaches. You know, if you're working for an agency that says, Hey, we need a website for Thanksgiving that markets our product. Damn it, go have fun, because that's always a good fun thing to maybe try using the next module bundler or something.

David: 大卫：

I like that. It’s like holiday code. It’s a holiday for the developer, because they get to play. It’s a holiday for the user, because it’s only going to be relevant for that holiday, and that’s the opportunity to experiment with all of those deep stacks and strange tools.

我喜欢。 It's like holiday code. It's a holiday for the developer, because they get to play. It's a holiday for the user, because it's only going to be relevant for that holiday, and that's the opportunity to experiment with all of those deep stacks and strange tools.

Tim: 蒂姆：

That’s a real thing, holiday code. Especially if you work in ecommerce, for example. Wherein you have to put up a landing page to sell six products that are discounted just for the holidays. You know what? Also listeners, aside from tools, tell us about your best experiences with holiday code — or worst, because both of those things exist.

That's a real thing, holiday code. Especially if you work in ecommerce, for example. Wherein you have to put up a landing page to sell six products that are discounted just for the holidays. 你知道吗？ Also listeners, aside from tools, tell us about your best experiences with holiday code — or worst, because both of those things exist.

David: 大卫：

Hash tag #HolidayCode.

Hash tag #HolidayCode.

Tim: 蒂姆：

All right. Now it’s going to be in the show notes, and I can guarantee that’s going to be a thing when this episode releases.

行。 Now it's going to be in the show notes, and I can guarantee that's going to be a thing when this episode releases.

David: 大卫：

Well, thank you so much for listening, everybody. We always enjoy getting to talk technology with all of you.

好，非常感谢大家的倾听。 我们总是喜欢与大家交谈技术。

Tim: 蒂姆：

We would also like to thank SitePoint.com, and our producers, Adam Roberts and Ophelie Lechat, with production help from Ralph Mason. Please feel free to send us your comments on Twitter — @versioningshow — and give us a rating on iTunes and let us know how we’re doing.

我们还要感谢SitePoint.com以及我们的制作人Adam Roberts和Ophelie Lechat，以及Ralph Mason的制作帮助。 Please feel free to send us your comments on Twitter — @versioningshow — and give us a rating on iTunes and let us know how we're doing.

David: 大卫：

We’ll see you next time, and we hope you enjoyed this version.

下次见，我们希望您喜欢这个版本。

翻译自: https://www.sitepoint.com/versioning-show-episode-20-with-guy-routledge/

it guy流利说