205: Rapidfire 55

00:55:42   Download

This week we have another RAPIDFire episode digging way back into the question archive to answer questions about stolen SVGs, getting started writing for the web, dealing with small styles, the best library for DOM manipulation, and Dropbox Driven Development.

Q & A

  • 2:00 What could I do to make them understand that the web is moving forward, and their websites should too? I know the websites I make is for them and not for me, but it feels a bit strange.
  • 5:30 Given that SVG files are the raw and un-rendered, it’s much easier to take bits of pieces of it versus a PNG image. Are you ever worried that someone will come along and steal parts of the SVG file?
  • 9:10 Do you know any other way to concatenate javascript while keeping the list of js paths out of the gulp file?
  • 12:50 Sometimes I run into problems with how I have wrote the html or css in a way that makes it hard to position a div or tab. What are some best practices when coding the html and css so that the page comes together in an efficient and predictable manner?
  • 15:28 The web world has so much going on and our industry has so many amazing writers, how does one find a way to write something different? Is it even worth worrying about?
  • 19:50 I am facing a problem where I don’t have enough clients. How do I get more of them? I don’t live in an area with many businesses that I can work for. And how can I write a good proposal? Tips and experience?
  • 25:56 How do you handle small styles for example three lines of code in sass do you create its own partials or create one called global and put it in there?
  • 29:55 I find CSS modularization very intriguing but would like to view great examples of projects implementing style builds entirely in JS. Could you point me to some good open source examples?
  • 37:00 Is jQuery still the best library for DOM manipulation?
  • 42:47 Is there a workflow or tools you would recommend for automated pre-commit code formatting? So that everyone who contributes code has it automatically formatted the same without having to worry about editorconfig. We use css, js, and handlebars templates.
  • 46:40 I know the obvious answer is for everyone to work strictly locally and then use Git when work is ready, but what is the best way to handle this when working with partials? Should we compile on the server? Or separate our project out into a ‘development’ and ‘distribution’ structure with a build task?
  • 50:47 Do you guys have any suggestions on software options to provide monthly search engine ranking reports that can help automate this process. I’m building up a decent client base and would love to save some time with researching the hundreds of keywords I’m currently tracking. Thanks!

Links

Sponsors

Hack Reactor 17:45

This is Guy Morita: “At Hack Reactor I built two web games, an iOS game, and a recommendation engine in under three months.”

Guy Morita likes Hack Reactor.

Be smart.

Be like Guy.

Hack Reactor graduates leave armed with an arsenal of full-stack coding skills including a strong focus on JavaScript and a server development education like Node, SQL and Mongo. Onsite & Remote classes begin every 7 weeks. See what makes Hack Reactor the best choice for your programming career. Apply Today!

Fluent: the O’Reilly Web Conference 35:22

Get the big picture and the fine details on all things web-related at Fluent: programming, design, and making the web great. You’ll find:

  • 2-day intensive training courses on React, Node, and CSS Layout, and more.
  • Sessions covering everything from foundation design decisions to JavaScript workflows, hardware, chat, testing, and questions like “Will React hold off Angular 2?”
  • Great keynotes
  • Incredible networking opportunities

If you work on the web, you’ll want to be at Fluent. Happening March 7–10 in San Francisco. Shoptalk listeners: last chance to use code SHOPTALKS when you register and save 30%.

Job Mention

  • Pierre

    Hi,

    Good episode you mention React as a jQuery replacement and while I don’t entirely agree with that point I see where you’re going with it. (I see jQuery more as a utility library like underscore and React as a true framework but I digress)

    Anyhow this is going to be another one of those “hey what about framework X” but I hope you’ll read through to see and decide for yourself.

    Have you ever used Vuejs? It shares lots of common ideas from Angular and React but the core idea is it provides coding/design hybrid folks a very fast way to get things up and running. I’ve used angular (learning react) and the famous angular learning curve was real. It took weeks to grok everything. Vue was accessible within days, almost the entire library. To me this makes it closer to a jQuery replacement than React would be. At least in it’s vanilla version.

    While vue starts small it can be expanded with added modules to add routing, services and eventually a complete component system like other frameworks. Eventually it can become just as robust as Angular and React. But you still have the benefit of just quickly adding it to your page with low overhead if you want.

    To be fair pleas read through this page for more details:
    http://vuejs.org/guide/comparison.html

    Also Jeffery Way is a huge fan and has a free series:
    https://laracasts.com/series/learning-vue-step-by-step

    Cheers

  • Just wanted to add that their is an answer for the question asked at 9:10 about getting your JS files to concatenate in the correct order on a CSS-Tricks article about Gulp for Beginners ( https://css-tricks.com/gulp-for-beginners/ ) …In that article the author uses the gulp-useref plugin which looks for special tags surrounding your links to your JavaScript files and them concatenates them based on the order that the JavaScript files are written in the HTML …it then creates a concatenated js and modifies a built HTML file to link to that concatenated JavaScript file…I tried it and it works well…

    • chriscoyier

      Ah yes! Very sweet!

      I wonder if it could even be configured to leave the individual scripts alone in dev (good for debugging) and bundle them in prod (good for performance).

  • chriscoyier

    Ah yes! Very sweet.

    I wonder if it could even be configured to leave the individual scripts alone in dev (good for debugging) and bundle them in prod (good for performance).