Skip to content

Instantly share code, notes, and snippets.

@theotherzach
Last active January 3, 2016 01:59
Show Gist options
  • Save theotherzach/8392543 to your computer and use it in GitHub Desktop.
Save theotherzach/8392543 to your computer and use it in GitHub Desktop.

##You Can't Take the Browser From Me

####Core

  • Learn JavaScript fundamentals to make your existing Rails App better.

####Doodling

#####Denial

  • Your server-side project becomes a collection of single page applications the moment a line of JavaScript runs in the browser. tweet
  • Rails plus jQuery swamp means that you have an accidental frontend app. Invest in the JavaScript that you're already using. tweet
  • Treat it with the respect that all production code deserves: Learn the language, test it, and adopt real tooling.
  • Remember, investing in JavaScript is a sure thing since it's not going away anytime soon.

#####Angular

  • Just as we use Rails to prevent wheel-reinventing, we adopt JavaScript frameworks for the same reasons.
  • Angular is a good fit for a hybrid approach because it focuses on HTML compilation over providing a complete SPA solution.
  • Rendering w/ Angular requires the exact same code-weight as server side rendering. There is no inherent developer cost difference beyond the up-front skill acquisition.
  • Converting a jQuery swamp to Angular allows structure without meaningless decisions.
  • Embracing JavaScript and Angular gives you freedom from monkey patching jQuery plugins. Use the plugins when they solve a problem and use Angular when you need ad-hoc interactivity.
  • Moving some Rails View code to Angular makes the entire codebase cleaner. Investment in the frontend pays dividends on the server, too.

####Abstract #####Long

Have you ever written a line of jQuery that made you feel yucky? Experienced the thrill when it instantly solves a problem? How about the hangover during the next feature and you don't know how it works? Does all that jQuery sometimes feel like a swamp? You have an accidental front-end app, and that's OK.

We'll get through it together.

Just as we use Rails to add structure and prevent wheel-reinvention, we also adopt JavaScript frameworks. I'll use Angular to demonstrate a hybrid rendering approach for moderately interactive Rails apps. We'll refactor troublesome jQuery to Angular and extend that code with new features. We'll then identify the heart of our logic, extract the code into Your Own Darn Objects, and talk about why that's sometimes a good thing.

We'll also discuss front-end development in 2014 and how it has a great tooling story including unit tests, instrumentation, and CI.

Explore the joy of JavaScript with me.

######Short

  • JavaScript can make you happier.
  • Hiding from JS by living in a jQuery swampland sucks for you and your users.
  • The same principles apply to both frontend and backend code. Break it down into manageable pieces and test it.
  • Frameworks add structure and can save code-weight. Less code, fewer problems.
  • JavaScript can make you happier.

Did you know that JavaScript doesn't have to stress you out? It can make you happier, even if your Rails app is rendered on the server.

Those principles that apply to the server also apply to the browser. Just as we use Rails to add structure and prevent wheel-reinvention, we also adopt JavaScript frameworks. Just as we break our Ruby code into reusable pieces, we also modularize our JavaScript.

Let me show you how much fun this can be.

@theotherzach
Copy link
Author

As lines of jQuery are added - tipping point and feels a square peg in a round hole.

@theotherzach
Copy link
Author

Non obvious at first that there will be a lot of interactivity. Only later realize that a more frontend heavy approach might be appropriate. Emergent behavior.

@theotherzach
Copy link
Author

Strategies for converting restful controllers to JSON API endpoints.

@zph
Copy link

zph commented Jan 15, 2014

First off, really useful topic.

Title: none of 'em are really grabbing me. They're all in the ballpark but not quite catchy enough. I'm thinking of something along the lines of "It's Alive! Js overthrow of Rails"... but that's not perfect either.

Keep in mind that your audience is Rails devs who accidentally write Js/Coffee... or the js-curious.

Hammer home that throwing in random js in the app is akin to re-writing your own framework. Could be great... probably will be spaghetti. Make the case for being able to use Angular as a drop in for specific spots in app that need more interactivity. I think a lot of ppl will be interested. Also emphasize that it encourages clean/flexible design b/c the rails side only handles the api.

Last thought, my creativity flows better when talking. We can do a Hangout today or tomorrow.

@theotherzach
Copy link
Author

Thanks! Great points, will filter and focus based on that.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment