Rails & Vue.js Trello Clone - Part 1 Discussion
Great episode ! Do you think it's better to grab the json data rendered inside the html view or making an ajax call instead ?
AJAX will always be slower because you're making a second network request and will always force a 'loading' state on the Vue app. I personally hate waiting for widgets to load so I'd rather preload the JSON on the page and have an instantly available frontend.
Hey Chris, I feel like a missed a couple of episodes leading up to this one. You use some gems here I am not familiar with like 'devise_masquerade' and a few others. Do you have either a copy of the code base that you started out with for this episode or can you point me to the episode(s) where you built everything we are starting with here? Thanks!
Chris, seconding ccsalespro's comment, is there an episode where you kind of have a "stock" rails new app that has all of your favorite gems in them? I think I missed something here where you generated the admin stuff for Devise as well as a couple other things. Good work on these, I'm really enjoying it.
You can do multiple components on a page by creating multiple Vue apps. You'd basically just mount your different Vue apps to the appropriate tag, if you find them on the page. You won't necessarily have them on every page, so you'll need to conditionally check to set them up.
This is what I do with the Vue-Turbolinks integration. You can see an example here that checks each turbolinks pageview for the components and then sets up the vue app. https://github.com/excid3/vue-turbolinks#running-vue-only-on-specific-pages
You'd just do the same thing basically.
I also noticed that Laravel seems to have an interesting way of doing things that is using the whole server sided rendered HTML as the main component. It seems like it might be a really useful way of doing an even nicer middle ground.
Also, feel stupid but I can't figure out how to reply to your comment :)
You can think of that approach as similar to binding your events in jQuery. I worked on a nice little wrapper for that which I need to release. And once I get a chance to check out this other approach, I'll let you know. Might be a better way to structure things.
I've tried to add webpacker in existing app, and error showed up as bellow. I've googled it for hours and still can't find solution, plz help me with some hint, Thank you so so much.
Webpacker::Manifest::MissingEntryError - Webpacker can't find application.css in <App-Path>/public/packs/manifest.json. Possible causes:
1. You want to set webpacker.yml value of compile to true for your environment
unless you are using the `webpack -w` or the webpack-dev-server.
2. webpack has not yet re-run to reflect updates.
3. You have misconfigured Webpacker's config/webpacker.yml file.
4. Your webpack configuration is not creating a manifest.
Your manifest contains:
Do you have still issue ? Its because webpack compiling no css...
Lets add this line "import App from '../app.vue'" and then run in terminal "bin/webpack" , aplication css should be generated
i had the problem too. Could fix it with:
If you have get the message "can't find executable webpack for gem webpacker" along the way you can fix it with:
bundle exec rails webpacker:binstubs
Hints came from:
I ran into the same problem. I noticed I didn't have
_head.html.erb file. Once I included that line, I got the
Hello Vue! to render.
I binding port docker at 5000:5000
What is happen?
Transcripts is wrong.
rails g scaffold list new position:integer
rails g scaffold list name position:integer
Hey, Chris Oliver .
Is there a chance for you to make a Part 0? I mean, from "rails new" to the state of your first commit?
I'm beggining with rails and your first commit is already quite advanced for me...
If you are using ruby 2.5.x and copy the project down make sure to update devise in your gemfile or you will face a bug.
gem 'devise', git: 'https://github.com/plataformatec/devise'
Hey Guys, i a, having an issue in my app.vue.
this line has an error, that list.cards , cards to be specific, is an unresolved variable. Anyone with an idea what might be wrong?
Well, if anyone is watching this video now. Use the jumpstart template instead of trying to set the whole thing up from scratch because that might take a lot of time if you are a beginner like me.