Install and configure stimulus and turbo

pull/1/head
rebuilt 4 years ago
parent 412687b9e0
commit 48581b990a

@ -14,38 +14,30 @@ gem 'pg'
# Use Puma as the app server
gem 'puma', '>= 5.5.2'
# Use SCSS for stylesheets
# gem 'sassc-rails', require: false
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# See https://github.com/rails/execjs#readme for more supported runtimes
# Use jquery as the JavaScript library
gem 'jquery-rails'
# Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks
gem 'turbolinks', '~> 5'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.5'
# Use Redis adapter to run Action Cable in production
# gem 'redis', '~> 3.0'
gem 'redis', '~> 3.0'
# Use ActiveModel has_secure_password
# gem 'bcrypt', '~> 3.1.7'
# Use Capistrano for deployment
# gem 'capistrano-rails', group: :development
gem 'nokogiri', '>= 1.12.5'
gem 'bootsnap', require: false
gem 'haml'
# gem 'bootstrap'
gem 'friendly_id', '~> 5.1.0'
gem 'newrelic_rpm'
gem 'devise'
gem 'omniauth'
gem 'twilio-ruby', '~> 4.11.1'
@ -56,6 +48,10 @@ gem 'jsbundling-rails'
gem 'cssbundling-rails'
gem 'turbo-rails'
gem 'stimulus-rails'
group :development, :test do
# Call 'byebug' anywhere in the code to stop execution and get a debugger console
gem 'byebug', platform: :mri

@ -240,6 +240,7 @@ GEM
rb-fsevent (0.11.0)
rb-inotify (0.10.1)
ffi (~> 1.0)
redis (3.3.5)
regexp_parser (2.2.0)
responders (3.0.1)
actionpack (>= 5.0)
@ -291,15 +292,17 @@ GEM
actionpack (>= 5.2)
activesupport (>= 5.2)
sprockets (>= 3.0.0)
stimulus-rails (1.0.2)
railties (>= 6.0.0)
strscan (3.0.1)
temple (0.8.2)
thor (1.2.1)
tilt (2.0.10)
timecop (0.9.4)
timeout (0.2.0)
turbolinks (5.2.1)
turbolinks-source (~> 5.2)
turbolinks-source (5.2.0)
turbo-rails (1.0.1)
actionpack (>= 6.0.0)
railties (>= 6.0.0)
twilio-ruby (4.11.1)
builder (>= 2.1.2)
jwt (~> 1.0)
@ -355,14 +358,16 @@ DEPENDENCIES
puma (>= 5.5.2)
rails (~> 7.0.1)
rails-controller-testing
redis (~> 3.0)
rspec-rails (~> 5.1.0)
rubocop
seed_dump
simplecov
spring
sprockets-rails
stimulus-rails
timecop
turbolinks (~> 5)
turbo-rails
twilio-ruby (~> 4.11.1)
tzinfo-data
uglifier (>= 1.3.0)

@ -75,10 +75,9 @@ Postgres
### Gems
| Name | Description |
| ------------------- | ---------------------------------- |
| ------------------- | --------------------------------------------------- |
| puma | webserver |
| pg | postgres |
| sassc-rails | sass compiler |
| jquery-rails | legacy, allows use of jquery |
| jbuilder | legacy, build json objects |
| haml | legacy, write views in haml syntax |
@ -88,14 +87,22 @@ Postgres
| omniauth | authentication |
| twilio-ruby | legacy, text messaging |
| activerecord-import | faster database imports |
| stimulus | Create javascript controllers |
| turbo-rails | Manages what gets rendered on the frontend and when |
| redis | Caching system |
| jsbundling-rails | Bundle javascript asssets |
| cssbundling-rails | Bundle css assets |
### External APIs
None yet. Hoping to integrate with Powerschool and Aspen for school administrative data.
### Javascript libraries
### Javascript
Esbuild is used as the javascript bundler. The javascript testing library is jest.
Esbuild is used as the javascript bundler. Scripts for esbuild are defined in package.json e.g. `yarn build`. This script will run if in development with `bin/dev`.
The javascript testing library is jest. Manually run test with `yarn test`. Javascript tests will also run with `bundle exec rake`.
Stimulus is installed. Create a stimulus controller with `./bin/rails generate stimulus [controller]`. If you create a stimulus controller manually, you can add it to `index.js` with the command `stimulus:manifest:update`.
### css

@ -1,19 +1,22 @@
// Entry point for the build script in your package.json
import Rails from "@rails/ujs"
import Turbolinks from "turbolinks"
import * as ActiveStorage from "@rails/activestorage"
// import "channels"
import Rails from "@rails/ujs";
import * as ActiveStorage from "@rails/activestorage";
Rails.start()
Turbolinks.start()
ActiveStorage.start()
import { initializeListenersForNavDropdowns, initializePopovers } from "./overview"
import { initializeListenersForHomeDropdowns } from "./home"
import { showEmptyDatasetModal } from "./modal"
Rails.start();
ActiveStorage.start();
document.addEventListener("turbolinks:load", () => {
initializeListenersForNavDropdowns()
initializeListenersForHomeDropdowns()
initializePopovers()
showEmptyDatasetModal()
})
import {
initializeListenersForNavDropdowns,
initializePopovers,
} from "./overview";
import { initializeListenersForHomeDropdowns } from "./home";
import { showEmptyDatasetModal } from "./modal";
document.addEventListener("turbo:load", () => {
initializeListenersForNavDropdowns();
initializeListenersForHomeDropdowns();
initializePopovers();
showEmptyDatasetModal();
});
import "@hotwired/turbo-rails";
import "./controllers";

@ -0,0 +1,9 @@
import { Application } from "@hotwired/stimulus"
const application = Application.start()
// Configure Stimulus development experience
application.debug = false
window.Stimulus = application
export { application }

@ -0,0 +1,5 @@
// This file is auto-generated by ./bin/rails stimulus:manifest:update
// Run that command whenever you add a new controller or create them with
// ./bin/rails generate stimulus controllerName
import { application } from "./application";

@ -7,8 +7,8 @@
<link href="https://fonts.googleapis.com/css?family=Cabin:400,600,700" rel="stylesheet" type="text/css"/>
<title>MCIEA</title>
<%= csp_meta_tag %>
<%= stylesheet_link_tag 'sqm', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
<%= stylesheet_link_tag 'sqm', media: 'all', 'data-turbo-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbo-track': 'reload' %>
<%= render partial: 'layouts/google_analytics', locals: { google_analytics_id: @google_analytics_id } %>
<%= render partial: 'layouts/hotjar', locals: { hotjar_id: @hotjar_id } %>
</head>

@ -3,9 +3,9 @@
<title>MCIEA</title>
<link href="https://fonts.googleapis.com/css?family=Bitter:400,600,700" rel="stylesheet" type="text/css"/>
<link href="https://fonts.googleapis.com/css?family=Cabin:400,600,700" rel="stylesheet" type="text/css"/>
<%= stylesheet_link_tag 'sqm', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= stylesheet_link_tag 'welcome', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
<%= stylesheet_link_tag 'sqm', media: 'all', 'data-turbo-track': 'reload' %>
<%= stylesheet_link_tag 'welcome', media: 'all', 'data-turbo-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbo-track': 'reload' %>
<%= render partial: 'layouts/google_analytics', locals: { google_analytics_id: @google_analytics_id } %>
<%= render partial: 'layouts/hotjar', locals: { hotjar_id: @hotjar_id } %>
</head>

@ -8,9 +8,9 @@
%link{href: "https://fonts.googleapis.com/css?family=Cabin:400,600,700", rel: "stylesheet", type: "text/css"}/
%title MCIEA
= csrf_meta_tags
= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload'
= stylesheet_link_tag 'application', media: 'all', 'data-turbo-track': 'reload'
= stylesheet_link_tag 'https://fonts.googleapis.com/css?family=Roboto:300,700'
= javascript_include_tag 'application', 'data-turbolinks-track': 'reload'
= javascript_include_tag 'application', 'data-turbo-track': 'reload'
/ Global site tag (gtag.js) - Google Analytics
%script{:async => "", :src => "https://www.googletagmanager.com/gtag/js?id=UA-132936999-1"}

@ -1,5 +1,6 @@
development:
adapter: async
adapter: redis
url: redis://localhost:6379/1
test:
adapter: test

@ -4,6 +4,8 @@
"dependencies": {
"@babel/preset-env": "^7.15.8",
"@fortawesome/fontawesome-free": "^6.0.0-beta3",
"@hotwired/stimulus": "^3.0.1",
"@hotwired/turbo-rails": "^7.1.1",
"@popperjs/core": "^2.10.2",
"@rails/actioncable": "^6.0.0",
"@rails/activestorage": "^6.0.0",
@ -12,8 +14,7 @@
"bootstrap": "^5.1.3",
"esbuild": "^0.13.6",
"prettier": "^2.5.1",
"sass": "^1.43.4",
"turbolinks": "^5.2.0"
"sass": "^1.43.4"
},
"scripts": {
"build": "esbuild app/javascript/*.* --bundle --outdir=app/assets/builds",

@ -899,6 +899,24 @@
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free/-/fontawesome-free-6.0.0-beta3.tgz"
integrity sha512-4SqOuhC8tSLeQvbW1nDmq6T7+8vdSgHy/w7PRwCFzMQCbKuYFIir/3UuWsV1QblX1lt7SGlSgwbaCv9XhRt8HA==
"@hotwired/stimulus@^3.0.1":
version "3.0.1"
resolved "https://registry.yarnpkg.com/@hotwired/stimulus/-/stimulus-3.0.1.tgz#141f15645acaa3b133b7c247cad58ae252ffae85"
integrity sha512-oHsJhgY2cip+K2ED7vKUNd2P+BEswVhrCYcJ802DSsblJFv7mPFVk3cQKvm2vHgHeDVdnj7oOKrBbzp1u8D+KA==
"@hotwired/turbo-rails@^7.1.1":
version "7.1.1"
resolved "https://registry.yarnpkg.com/@hotwired/turbo-rails/-/turbo-rails-7.1.1.tgz#35c03b92b5c86f0137ed08bef843d955ec9bbe83"
integrity sha512-ZXpxUjCfkdbuXfoGrsFK80qsVzACs8xCfie9rt2jMTSN6o1olXVA0Nrk8u02yNEwSiVJm/4QSOa8cUcMj6VQjg==
dependencies:
"@hotwired/turbo" "^7.1.0"
"@rails/actioncable" "^7.0"
"@hotwired/turbo@^7.1.0":
version "7.1.0"
resolved "https://registry.yarnpkg.com/@hotwired/turbo/-/turbo-7.1.0.tgz#27e44e0e3dc5bd1d4bda0766d579cf5a14091cd7"
integrity sha512-Q8kGjqwPqER+CtpQudbH+3Zgs2X4zb6pBAlr6NsKTXadg45pAOvxI9i4QpuHbwSzR2+x87HUm+rot9F/Pe8rxA==
"@istanbuljs/load-nyc-config@^1.0.0":
version "1.1.0"
resolved "https://registry.yarnpkg.com/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz"
@ -1094,6 +1112,11 @@
resolved "https://registry.yarnpkg.com/@rails/actioncable/-/actioncable-6.1.4.tgz"
integrity sha512-0LmSKJTuo2dL6BQ+9xxLnS9lbkyfz2mBGeBnQ2J7o9Bn0l0q+ZC6VuoZMZZXPvABI4QT7Nfknv5WhfKYL+boew==
"@rails/actioncable@^7.0":
version "7.0.2"
resolved "https://registry.yarnpkg.com/@rails/actioncable/-/actioncable-7.0.2.tgz#69a6d999f4087e0537dd38fe0963db1f4305d650"
integrity sha512-G26maXW1Kx0LxQdmNNuNjQlRO/QlXNr3QfuwKiOKb5FZQGYe2OwtHTGXBAjSoiu4dW36XYMT/+L1Wo1Yov4ZXA==
"@rails/activestorage@^6.0.0":
version "6.1.4"
resolved "https://registry.yarnpkg.com/@rails/activestorage/-/activestorage-6.1.4.tgz"
@ -3825,11 +3848,6 @@ tr46@^2.1.0:
dependencies:
punycode "^2.1.1"
turbolinks@^5.2.0:
version "5.2.0"
resolved "https://registry.yarnpkg.com/turbolinks/-/turbolinks-5.2.0.tgz"
integrity sha512-pMiez3tyBo6uRHFNNZoYMmrES/IaGgMhQQM+VFF36keryjb5ms0XkVpmKHkfW/4Vy96qiGW3K9bz0tF5sK9bBw==
type-check@~0.3.2:
version "0.3.2"
resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.3.2.tgz"

Loading…
Cancel
Save