- Generate new rails app using
--webpack
flag
rails new myApp --webpack=vue
Note:
- You can use
--webpack=angular
for angular application and--webpack=react
for react.
class WelcomeController < ApplicationController | |
skip_before_filter :authenticate_user! | |
layout 'welcome' | |
def index | |
end | |
def pricing | |
end |
<div id="main" role="main"> | |
<div class="container"> | |
<div class="row"> | |
<div class="span12" id="top-div"> <!--! added "top-div" id to help with ajax --> | |
<%= render 'layouts/messages' %> | |
<%= yield %> | |
</div> | |
</div> | |
<footer> | |
</footer> |
<template> | |
<div :id="uppyId"> | |
<div class="ThumbnailContainer" v-if="collection === 'thumbnail'"> | |
<button id="open-thumbnail-modal" class="button">Select file</button> | |
</div> | |
<div class="DashboardContainer" v-else></div> | |
</div> | |
</template> |
<template> | |
<div class="w-4/5"> | |
<form class="form" enctype="multipart/form-data" method="post" v-on:submit.prevent="submitForm"> | |
<div class="bg-white py-5 px-6 mb-6 rounded shadow"> | |
<div class="pb-8"> | |
<div class="text-base font-medium">General Information</div> | |
</div> | |
<div class="flex flex-wrap -mx-3 mb-6"> | |
<div class="w-full md:w-1/2 px-3 mb-6 md:mb-0"> |
cd | |
git clone git://github.com/sstephenson/rbenv.git .rbenv | |
echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.zshrc | |
echo 'eval "$(rbenv init -)"' >> ~/.zshrc | |
git clone git://github.com/sstephenson/ruby-build.git ~/.rbenv/plugins/ruby-build | |
echo 'export PATH="$HOME/.rbenv/plugins/ruby-build/bin:$PATH"' >> ~/.zshrc | |
source ~/.zshrc | |
sudo apt-get install -y libssl-dev libreadline-dev zlib1g-dev | |
rbenv install -v 2.3.1 | |
rbenv global 2.3.1 |
// 🔥 Node 7.6 has async/await! Here is a quick run down on how async/await works | |
const axios = require('axios'); // promised based requests - like fetch() | |
function getCoffee() { | |
return new Promise(resolve => { | |
setTimeout(() => resolve('☕'), 2000); // it takes 2 seconds to make coffee | |
}); | |
} |
import Vue from 'vue' | |
// Autoload all Vue components | |
const files = require.context('./', true, /\.vue$/i) | |
files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key))) | |
// Register the Vue component | |
const root = document.getElementById('app') | |
window.vue = new Vue({ | |
render: h => h( |
class ActionDispatch::Routing::Mapper | |
def draw(routes_names) | |
instance_eval(File.read(Rails.root.join("config/routes/#{routes_names}.rb"))) | |
end | |
end | |
Rails.application.routes.draw do | |
draw :users | |
draw :settings | |
... |