Merge pull request #6 from TwilioDevEd/upgrade-structure

Update structure and add webpacker

Author: rojasTob

.browserslistrc

@@ -0,0 +1 @@
+defaults

.github/workflows/ruby.yml

@@ -49,6 +49,13 @@ jobs:
  gem install bundler
  bundle config path vendor/bundle
  bundle install --jobs 4 --retry 3
+ - name: Setup Node
+ uses: actions/setup-node@v1
+ with:
+ node-version: 12.13.1
+ - name: Install packages
+ run: |
+ npm install
  - name: Run tests
  run: |
  cp .env.example .env

.gitignore

@@ -85,3 +85,10 @@ build-iPhoneSimulator/
 .rvmrc
 
 .tool-versions
+
+/public/packs
+/public/packs-test
+/node_modules
+/yarn-error.log
+yarn-debug.log*
+.yarn-integrity

Dockerfile

@@ -6,14 +6,14 @@ COPY Gemfile ./
 
 COPY Makefile ./
 
-RUN make install
-
-COPY . .
-
 # Install a Javascript environment in the container to avoid ExecJS::RuntimeUnavailable
 RUN curl -sL https://deb.nodesource.com/setup_10.x | bash - \
  && apt install -y nodejs
 
+RUN make install
+
+COPY . .
+
 RUN make database
 
 EXPOSE 3000

Gemfile

@@ -59,3 +59,5 @@ end
 
 # Windows does not include zoneinfo files, so bundle the tzinfo-data gem
 gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]
+
+gem "webpacker"

Gemfile.lock

@@ -111,6 +111,8 @@ GEM
  puma (4.3.5)
  nio4r (~> 2.0)
  rack (2.2.3)
+ rack-proxy (0.6.5)
+ rack
  rack-test (1.1.0)
  rack (>= 1.0, < 3)
  rails (6.0.3.2)
@@ -153,6 +155,7 @@ GEM
  sprockets (> 3.0)
  sprockets-rails
  tilt
+ semantic_range (2.3.0)
  spring (2.1.0)
  spring-watcher-listen (2.0.1)
  listen (>= 2.7, < 4.0)
@@ -184,6 +187,11 @@ GEM
  activemodel (>= 6.0.0)
  bindex (>= 0.4.0)
  railties (>= 6.0.0)
+ webpacker (5.1.1)
+ activesupport (>= 5.2)
+ rack-proxy (>= 0.6.1)
+ railties (>= 5.2)
+ semantic_range (>= 2.3.0)
  websocket-driver (0.7.2)
  websocket-extensions (>= 0.1.0)
  websocket-extensions (0.1.5)
@@ -212,6 +220,7 @@ DEPENDENCIES
  tzinfo-data
  uglifier (>= 4.2.0)
  web-console (>= 4.0.1)
+ webpacker
 
 BUNDLED WITH
  2.1.4

Makefile

@@ -2,7 +2,8 @@
 .PHONY: install database serve
 
 install:
-bundle install
+bundle install; \
+npm install;
 
 database:
 bundle exec rails db:migrate

README.md

@@ -6,7 +6,7 @@
 
 ![](https://github.com/TwilioDevEd/verify-v2-quickstart-rails/workflows/Ruby/badge.svg)
 
-> We are currently in the process of updating this sample template. If you are encountering any issues with the sample, please open an issue at [github.com/twilio-labs/code-exchange/issues](https://github.com/twilio-labs/code-exchange/issues) and we'll try to help you.
+> This template is part of Twilio CodeExchange. If you encounter any issues with this code, please open an issue at [github.com/twilio-labs/code-exchange/issues](https://github.com/twilio-labs/code-exchange/issues).
 
 ## About
 
@@ -25,7 +25,8 @@ Implementations in other languages:
 ### Requirements
 
 - [Ruby](https://www.ruby-lang.org/) **2.6.x** version.
-- [Sqlite3](https://www.sqlite.org/)
+- [Sqlite3](https://www.sqlite.org/).
+- [Node.js](https://nodejs.org/en/) **10.x** or **12.x** version.
 
 ### Twilio Account Settings
 

app/javascript/packs/application.js

@@ -0,0 +1,18 @@
+/* eslint no-console:0 */
+// This file is automatically compiled by Webpack, along with any other files
+// present in this directory. You're encouraged to place your actual application logic in
+// a relevant structure within app/javascript and only use these pack files to reference
+// that code so it'll be compiled.
+//
+// To reference this file, add <%= javascript_pack_tag 'application' %> to the appropriate
+// layout file, like app/views/layouts/application.html.erb
+
+
+// Uncomment to copy all static images under ../images to the output folder and reference
+// them with the image_pack_tag helper in views (e.g <%= image_pack_tag 'rails.png' %>)
+// or the `imagePath` JavaScript helper below.
+//
+// const images = require.context('../images', true)
+// const imagePath = (name) => images(name, true)
+
+console.log('Hello World from Webpacker')

babel.config.js

@@ -0,0 +1,72 @@
+module.exports = function(api) {
+ var validEnv = ['development', 'test', 'production']
+ var currentEnv = api.env()
+ var isDevelopmentEnv = api.env('development')
+ var isProductionEnv = api.env('production')
+ var isTestEnv = api.env('test')
+
+ if (!validEnv.includes(currentEnv)) {
+ throw new Error(
+ 'Please specify a valid `NODE_ENV` or ' +
+ '`BABEL_ENV` environment variables. Valid values are "development", ' +
+ '"test", and "production". Instead, received: ' +
+ JSON.stringify(currentEnv) +
+ '.'
+ )
+ }
+
+ return {
+ presets: [
+ isTestEnv && [
+ '@babel/preset-env',
+ {
+ targets: {
+ node: 'current'
+ }
+ }
+ ],
+ (isProductionEnv || isDevelopmentEnv) && [
+ '@babel/preset-env',
+ {
+ forceAllTransforms: true,
+ useBuiltIns: 'entry',
+ corejs: 3,
+ modules: false,
+ exclude: ['transform-typeof-symbol']
+ }
+ ]
+ ].filter(Boolean),
+ plugins: [
+ 'babel-plugin-macros',
+ '@babel/plugin-syntax-dynamic-import',
+ isTestEnv && 'babel-plugin-dynamic-import-node',
+ '@babel/plugin-transform-destructuring',
+ [
+ '@babel/plugin-proposal-class-properties',
+ {
+ loose: true
+ }
+ ],
+ [
+ '@babel/plugin-proposal-object-rest-spread',
+ {
+ useBuiltIns: true
+ }
+ ],
+ [
+ '@babel/plugin-transform-runtime',
+ {
+ helpers: false,
+ regenerator: true,
+ corejs: false
+ }
+ ],
+ [
+ '@babel/plugin-transform-regenerator',
+ {
+ async: false
+ }
+ ]
+ ].filter(Boolean)
+ }
+}