Hi @chrisvfritz, thanks for this repo, really useful!

I was looking at the vue-webpack solution and see it works by simply having webpack run alongside rails s and you've just put the directory "IN" the rails directory.

however... once you run npm run build where do the files go? And my real question is... once it's built and deployed to say Heroku, how does going to say "http://myvueapp.herokuapp.com" redirect to the built frontend files....?

thanks!

Hi there,

I stumbled across your excellent tutorials as I'm playing with vue.js at the moment and I want to port a rails site across.

Anyway, I'm thinking of going down the browserify route, as it seems the best one for me. So I cloned the vue-browserify branch. I then bundled, and ran the Procfile as per the README. Then I ran into a quite a few issues with the browserify Procfile command falling over.

To fix it, I ran:

npm install -g npm-run-all
npm install -g watchify
npm install -g http-server

And then the system was able to start up correctly, and I could post the TODO's etc. So it's all working now.

My question is, should I need to have run these install -g commands? If so, I'm happy to add them to the README in a pull request. If not, can you tell me what I was doing wrong?

Many many thanks for putting this together, it's the perfect starting point for me.

Oh, finally (and this is cheeky to put in an issue!) but, I can see that the system is compiling the js perfectly, and it looks like it is being served on localhost, but I can see in the logs that the http-serve says:

22:41:24 browserify.1 | > http-server -c 1 -a localhost
22:41:24 browserify.1 |
22:41:24 browserify.1 | Starting up http-server, serving ./public
22:41:24 browserify.1 | Available on:
22:41:24 browserify.1 |   http://localhost:5000
22:41:24 browserify.1 | Hit CTRL-C to stop the server
22:41:29 browserify.1 | 22:41:29 GMT+0200 (CEST) [HMR] Emitting updates
22:41:29 browserify.1 | 22:41:29 GMT+0200 (CEST) [HMR] Listening on localhost:3123
22:41:30 browserify.1 | 1625519 bytes written to app/assets/javascripts/application.js (5.18 seconds)
22:41:31 browserify.1 | 22:41:31 GMT+0200 (CEST) [HMR] User connected, syncing

can you explain what's going on there? When I look at localhost:5000 I get nothing. I don't really mind, as the app is perfect, I was just a little confused with it.

Anyway, the main thing is whether the installs needed to happen, feel free to ignore the server question :)

Thanks again - really appreciated this tutorial / quickstart!

Hi,

I just saw the description of the 'pure sprockets with jQuery' setup and while I'd recommend something else like React or Vue, etc. for front-end heavy work, I have created a cool (if I say so myself) plugin for exactly the situation where there is no room for anything but jQuery in a project (due to time, skills, necessity, etc).

Self plug:
https://github.com/abuisman/jquery-freud

What it allows you to do is componentize DOM elements by adding a data-attribute like so:

<div class='greeting-card' data-behaviours='IncreaseCount'></div>

The behaviour (class), would look like this:

class IncreaseCount
  constructor: (@element, options = {}) ->
    @count = @element.data('count') || 0
    $button = $('<button>Add one</button>')
    @element.append($button)
    $button.on('click', @handleButtonClick)

  buttonClick: =>
    @count = @count + 1;
    @element.find('.count').text(@count)

This way you can also selectively apply javascript to DOM elements as they come and go in and out of view while also being able to use classes and objects.

This approach has been very useful for a few years now for several projects where a full front-end framework is not a real option or simply overkill for various reasons.

Maybe you'd like to feature it as an alternative or share your thoughts about it here.