react_on_rails 2.0.0.beta.1 → 2.0.0.beta.2

data/docs/releasing.md

@@ -0,0 +1,29 @@
+# Install and Release
+
+We're now releasing this as a combined ruby gem plus npm package. We will keep the version numbers in sync.
+
+## Testing the Gem before Release from a Rails App
+See [Contributing](../contributing.md)
+
+## Releaseing a new gem version
+Install https://github.com/svenfuchs/gem-release
+
+```bash
+# Having the examples prevents publishing
+rm -rf examples
+gem bump
+# Or manually update the version number
+cd spec/dummy
+# Update the Gemfile.lock of the tests
+bundle
+git commit -am "Updated Gemfile.lock"
+cd ../..
+gem tag
+gem release
+```
+
+
+## Releasing a npm version
+Be sure to keep the version number the same as the ruby gem!
+
+Use the npm package `release-it`

data/lib/generators/USAGE

@@ -0,0 +1,99 @@
+Description:
+
+The react_on_rails:install generator combined with the example pull requests of
+generator runs will get you up and running efficiently. There's a fair bit of
+setup involved when ~with~ integrating Webpack with Rails. Defaults for options
+are such that the default is for the flag to be off. For example, the default for
+`-R` is that redux is off, and the default of -b means that skip-bootstrap is off.
+
+* Redux
+
+    Passing the --redux generator option causes the generated Hello World example
+    to integrate the Redux state container framework. The necessary node modules
+    will be automatically included for you.
+
+    The generator uses the organizational `paradigm of "bundles"`. These are like
+    application domains and are used for grouping your code into webpack bundles
+    in case you decide to create different bundles for deployment. This is also
+    useful for separating out logical parts of your application. We recommend that
+    that each bundle will have it's own Redux store. If you have code that you
+    want to reuse across bundles, such as middleware or common utilities, place them
+    under `/client/app/lib`. You can then import them in your client code:
+    `import MyModule from 'lib/MyModule'`; since we have configured webpack to
+    automatically resolve the word lib to point to this folder.
+
+* Using Images and Fonts
+
+    The generator has amended the folders created in `client/assets/` to Rails's
+    asset path. We recommend that if you have any existing assets that you want
+    to use with your client code, you should move them to these folders and use
+    webpack as normal. This allows webpack's development server to have access
+    to your assets, as it will not be able to see any assets in the default Rails
+    directories which are above the `/client` directory.
+
+    Alternatively, if you have many existing assets and don't wish to move them,
+    you could consider creating symlinks from `client/assets` that point to your
+    Rails assets folders inside of `app/assets/`. The assets there will then be
+    visible to both Rails and webpack.
+
+* Bootstrap Integration
+
+    React on Rails ships with Twitter Bootstrap already integrated into the build.
+    Note that the generator removes require_tree in both the application.js and
+    application.css.scss files. This is to ensure the correct load order for the
+    bootstrap integration, and is usually a good idea in general. You will therefore
+    need to explicitly require your files.
+
+    How the Bootstrap library is loaded depends upon whether one is using the Rails
+    server or the HMR development server.
+
+    1. Bootstrap via Rails Server
+
+        The Rails server loads bootstrap-sprockets, provided
+        by the bootstrap-sass ruby gem (added automatically to your Gemfile by
+        the generator), via the `app/assets/stylesheets/_bootstrap-custom.scss`
+        partial.
+
+        This allows for using Bootstrap in your regular Rails stylesheets. If you
+        wish to customize any of the Bootstrap variables, you can do so via the
+        `client/assets/stylesheets/_pre-bootstrap.scss` partial.
+
+    2. Bootstrap via Webpack Dev Server
+
+        The webpack dev server does not go through Rails but instead loads bootstrap
+        via the `bootstrap-sass-loader` webpack loader. You can configure the loader
+        via the `client/bootstrap-sass-config.js` file.
+
+    3. Keeping Custom Bootstrap Configurations Synced
+
+        Because the webpack dev server and Rails each load Bootstrap via a different
+        file (explained in the two sections immediately above), any changes to
+        the way components are loaded in one file must also be made to the other
+        file in order to keep styling consistent between the two. For example,
+        if an import is excluded in _bootstrap-custom.scss, the same import should
+        be excluded in `bootstrap-sass-config.js` so that styling in the Rails
+        server and the webpack dev server will be the same.
+
+    4. Skip Bootstrap Integration
+
+        Bootstrap integration is enabled by default, but can be disabled by passing
+        the --skip-bootstrap flag (alias -b). When you don't need Bootstrap in your
+        existing project, just skip it as needed.
+
+* JavaScript Linters
+
+    JavaScript linters are enabled by default, but can be disabled by passing the
+    --skip-js-linters flag (alias j), and those that run in Node have been add to
+    `client/package.json` under devDependencies.
+
+* Ruby Linters
+
+    Ruby linters are disabled by default, but can be enabled by passing the
+    `--ruby-linters` flag when generating. These linters have been added to your
+    Gemfile in addition to the the appropriate Rake tasks.
+
+    We really love using all the linters! Give them a try.
+
+More Details:
+
+    `https://github.com/shakacode/react_on_rails#generator`

data/lib/generators/react_on_rails/base_generator.rb

@@ -0,0 +1,191 @@
+require "rails/generators"
+require File.expand_path("../generator_helper", __FILE__)
+
+include GeneratorHelper
+
+module ReactOnRails
+  module Generators
+    class BaseGenerator < Rails::Generators::Base # rubocop:disable Metrics/ClassLength
+      hide!
+      source_root(File.expand_path("../templates", __FILE__))
+
+      # --redux
+      class_option :redux,
+                   type: :boolean,
+                   default: false,
+                   desc: "Install Redux gems and Redux version of Hello World Example",
+                   aliases: "-R"
+      # --server-rendering
+      class_option :server_rendering,
+                   type: :boolean,
+                   default: false,
+                   desc: "Configure for server-side rendering of webpack JavaScript",
+                   aliases: "-S"
+      # --skip-js-linters
+      class_option :skip_js_linters,
+                   type: :boolean,
+                   default: false,
+                   desc: "Skip installing JavaScript linting files",
+                   aliases: "-j"
+      # --ruby-linters
+      class_option :ruby_linters,
+                   type: :boolean,
+                   default: false,
+                   desc: "Install ruby linting files, tasks, and configs",
+                   aliases: "-L"
+
+      # --skip-bootstrap
+      class_option :skip_bootstrap,
+                   type: :boolean,
+                   default: false,
+                   desc: "Skip integrating Bootstrap and don't initialize files and regarding configs",
+                   aliases: "-b"
+
+      def add_hello_world_route
+        route "get 'hello_world', to: 'hello_world#index'"
+      end
+
+      def create_client_assets_directories
+        empty_directory("client/assets")
+        empty_directory("client/assets/stylesheets")
+        empty_directory_with_keep_file("client/assets/fonts")
+        empty_directory_with_keep_file("client/assets/images")
+      end
+
+      def update_git_ignore
+        data = <<-DATA.strip_heredoc
+          # React on Rails
+          npm-debug.log
+          node_modules
+
+          # Generated js bundles
+          /app/assets/javascripts/generated/*
+        DATA
+
+        dest_file_exists?(".gitignore") ? append_to_file(".gitignore", data) : puts_setup_file_error(".gitignore", data)
+      end
+
+      def update_application_js
+        data = <<-DATA.strip_heredoc
+          // DO NOT REQUIRE jQuery or jQuery-ujs in this file!
+          // DO NOT REQUIRE TREE!
+
+          // CRITICAL that generated/vendor-bundle must be BEFORE bootstrap-sprockets and turbolinks
+          // since it is exposing jQuery and jQuery-ujs
+
+          //= require generated/vendor-bundle
+          //= require generated/app-bundle
+
+        DATA
+
+        app_js_path = "app/assets/javascripts/application.js"
+        found_app_js = dest_file_exists?(app_js_path) || dest_file_exists?(app_js_path + ".coffee")
+        if found_app_js
+          prepend_to_file(found_app_js, data)
+        else
+          create_file(app_js_path, data)
+        end
+      end
+
+      def strip_application_js_of_incompatible_sprockets_statements
+        application_js = File.join(destination_root, "app/assets/javascripts/application.js")
+        gsub_file(application_js, "//= require jquery_ujs", "// require jquery_ujs")
+        gsub_file(application_js, %r{//= require jquery$}, "// require jquery")
+        gsub_file(application_js, %r{//= require_tree \.$}, "// require_tree .")
+      end
+
+      def strip_application_js_of_double_blank_lines
+        application_js = File.join(destination_root, "app/assets/javascripts/application.js")
+        gsub_file(application_js, /^\n^\n/, "\n")
+      end
+
+      def create_react_directories
+        dirs = %w(components containers startup)
+        dirs.each { |name| empty_directory("client/app/bundles/HelloWorld/#{name}") }
+      end
+
+      def copy_base_files
+        base_path = "base/base/"
+        %w(app/controllers/hello_world_controller.rb
+           config/initializers/react_on_rails.rb
+           client/.babelrc
+           client/index.jade
+           client/server.js
+           client/webpack.client.rails.config.js
+           REACT_ON_RAILS.md
+           client/REACT_ON_RAILS_CLIENT_README.md
+           package.json).each { |file| copy_file(base_path + file, file) }
+      end
+
+      def template_base_files
+        base_path = "base/base/"
+        %w(Procfile.dev
+           app/views/hello_world/index.html.erb
+           client/webpack.client.base.config.js
+           client/webpack.client.hot.config.js
+           client/package.json).each { |file| template(base_path + file + ".tt", file) }
+      end
+
+      def add_base_gems_to_gemfile
+        return unless options.server_rendering?
+        append_to_file("Gemfile", "\ngem 'therubyracer', platforms: :ruby\n")
+      end
+
+      def template_client_registration_file
+        filename = "clientRegistration.jsx"
+        location = "client/app/bundles/HelloWorld/startup"
+        template("base/base/#{location}/clientRegistration.jsx.tt", "#{location}/#{filename}")
+      end
+
+      def install_server_rendering_files_if_enabled
+        return unless options.server_rendering?
+        base_path = "base/server_rendering/"
+        %w(client/webpack.server.rails.config.js
+           client/app/bundles/HelloWorld/startup/serverRegistration.jsx).each do |file|
+          copy_file(base_path + file, file)
+        end
+      end
+
+      def template_linter_files_if_appropriate
+        return if !options.ruby_linters? && options.skip_js_linters?
+        template("base/base/lib/tasks/linters.rake.tt", "lib/tasks/linters.rake")
+      end
+
+      def template_assets_rake_file
+        template("base/base/lib/tasks/assets.rake.tt", "lib/tasks/assets.rake")
+      end
+
+      def append_to_assets_initializer
+        data = <<-DATA.strip_heredoc
+          # Add client/assets/ folders to asset pipeline's search path.
+          # If you do not want to move existing images and fonts from your Rails app
+          # you could also consider creating symlinks there that point to the original
+          # rails directories. In that case, you would not add these paths here.
+          Rails.application.config.assets.paths << Rails.root.join("client", "assets", "stylesheets")
+          Rails.application.config.assets.paths << Rails.root.join("client", "assets", "images")
+          Rails.application.config.assets.paths << Rails.root.join("client", "assets", "fonts")
+          Rails.application.config.assets.precompile += %w( generated/server-bundle.js )
+        DATA
+        assets_intializer = File.join(destination_root, "config/initializers/assets.rb")
+        if File.exist?(assets_intializer)
+          append_to_file(assets_intializer, data)
+        else
+          create_file(assets_intializer, data)
+        end
+      end
+
+      # rename to application.scss from application.css or application.css.scss
+      def force_application_scss_naming_if_necessary
+        base_path = "app/assets/stylesheets/"
+        application_css = "#{base_path}application.css"
+        application_css_scss = "#{base_path}application.css.scss"
+
+        bad_name = dest_file_exists?(application_css) || dest_file_exists?(application_css_scss)
+        return unless bad_name
+
+        new_name = File.join(destination_root, "#{base_path}application.scss")
+        File.rename(bad_name, new_name)
+      end
+    end
+  end
+end

data/lib/generators/react_on_rails/bootstrap_generator.rb

@@ -0,0 +1,89 @@
+require "rails/generators"
+require File.expand_path("../generator_helper", __FILE__)
+include GeneratorHelper
+
+module ReactOnRails
+  module Generators
+    class BootstrapGenerator < Rails::Generators::Base
+      hide!
+      source_root(File.expand_path("../templates", __FILE__))
+
+      def copy_bootstrap_files
+        base_path = "bootstrap/"
+        %w(app/assets/stylesheets/_bootstrap-custom.scss
+           client/assets/stylesheets/_post-bootstrap.scss
+           client/assets/stylesheets/_pre-bootstrap.scss
+           client/assets/stylesheets/_react-on-rails-sass-helper.scss
+           client/bootstrap-sass.config.js).each { |file| copy_file(base_path + file, file) }
+      end
+
+      # if there still is not application.scss, just create one
+      def create_application_scss_if_necessary
+        path = File.join(destination_root, "app/assets/stylesheets/application.scss")
+        return if File.exist?(path)
+        File.open(path, "w") { |f| f.puts "// Created by React on Rails gem\n\n" }
+      end
+
+      def prepend_to_application_scss
+        data = <<-DATA.strip_heredoc
+          // DO NOT REQUIRE TREE! It will interfere with load order!
+
+          // Account for differences between Rails and Webpack Sass code.
+          $rails: true;
+
+          // Included from bootstrap-sprockets gem and loaded in app/assets/javascripts/application.rb
+          @import 'bootstrap-sprockets';
+
+          // Customizations - needs to be imported after bootstrap-sprocket but before bootstrap-custom!
+          // The _pre-bootstrap.scss file is located under
+          // client/assets/stylesheets, which has been added to the Rails asset
+          // pipeline search path. See config/application.rb.
+          @import 'pre-bootstrap';
+
+          // These scss files are located under client/assets/stylesheets
+          // (which has been added to the Rails asset pipeline search path in config/application.rb).
+          @import 'bootstrap-custom';
+
+          // This must come after all the boostrap styles are loaded so that these styles can override those.
+          @import 'post-bootstrap';
+
+        DATA
+
+        application_scss = File.join(destination_root, "app/assets/stylesheets/application.scss")
+
+        if File.exist?(application_scss)
+          append_to_file(application_scss, data)
+        else
+          puts_setup_file_error(application_scss, data)
+        end
+      end
+
+      def strip_application_scss_of_incompatible_sprockets_statements
+        application_scss = File.join(destination_root, "app/assets/stylesheets/application.scss")
+        gsub_file(application_scss, "*= require_tree .", "")
+        gsub_file(application_scss, "*= require_self", "")
+      end
+
+      def add_bootstrap_sprockets_to_gemfile
+        append_to_file("Gemfile", "gem 'bootstrap-sass'\n")
+      end
+
+      def add_bootstrap_sprockets_to_application_js
+        data = <<-DATA.strip_heredoc
+
+          // bootstrap-sprockets depends on generated/vendor-bundle for jQuery.
+          //= require bootstrap-sprockets
+
+        DATA
+
+        app_js_path = "app/assets/javascripts/application.js"
+        found_app_js = dest_file_exists?(app_js_path) || dest_file_exists?(app_js_path + ".coffee")
+        if found_app_js
+          append_to_file(found_app_js, data)
+        else
+          create_file(app_js_path, data)
+        end
+      end
+    end
+  end
+end

data/lib/generators/react_on_rails/dev_tests_generator.rb

@@ -0,0 +1,39 @@
+require "rails/generators"
+require_relative "generator_helper"
+include GeneratorHelper
+
+module ReactOnRails
+  module Generators
+    class DevTestsGenerator < Rails::Generators::Base
+      hide!
+      source_root(File.expand_path("../templates/dev_tests", __FILE__))
+
+      def copy_rspec_files
+        %w(spec/spec_helper.rb
+           spec/rails_helper.rb
+           spec/simplecov_helper.rb
+           .rspec).each { |file| copy_file(file) }
+      end
+
+      def copy_tests
+        %w(spec/features/hello_world_spec.rb).each { |file| copy_file(file) }
+      end
+
+      # We want to use the node module in the local build, not the one published to NPM
+      def change_package_json_to_use_local_react_on_rails_module
+        package_json = File.join(destination_root, "client", "package.json")
+        old_contents = File.read(package_json)
+        new_contents = old_contents.gsub(/"react-on-rails": ".+",/,
+                                         '"react-on-rails": "../../..",')
+        File.open(package_json, "w+") { |f| f.puts new_contents }
+      end
+
+      def add_test_related_gems_to_gemfile
+        gem("rspec-rails", group: :test)
+        gem("capybara", group: :test)
+        gem("selenium-webdriver", group: :test)
+        gem("coveralls", require: false)
+      end
+    end
+  end
+end